Osama Elsayed
Osama Elsayed

Reputation: 29

asp.net Pass Multiple Parameters to jQuery ajax call

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="jquery-1.12.0.min.js"></script>
    <script src="Lash.js"></script>
</head>
<body>
   first name <input id="txtFirstname" type="text" /><br />
   last name  <input id="txtLastname" type="text" /><br />
   E-mail     <input id="txtEmail" type="text" /><br />
   password   <input id="txtPassword" type="password" /><br />
    <input id="btnRegister" type="button" value="Register" /><br />
</body>
</html>

/// <reference path="jquery-1.12.0.min.js" />

$(document).ready(function () {

    $("#btnRegister").click(function () {
        Register();
    });

    function Register() {

        var obj = { Firstname: $("#txtFirstname").val(), Lastname: $("#txtLastname").val(), Email: $("#txtEmail").val(), Password: $("#txtPassword").val() };

            $.ajax({
            type: "POST",
            contentType: "application/json; charset=utf-8",
            url: "http://localhost:7910/WebService.asmx/Registering",
            data:JSON.stringify(obj),
            datatype: "json",
            success: function (data) {
                alert("Successfully register");
            },
                error: function (data) {
                alert("error");
            }

        });

    }

});

 [WebMethod]
        public string Registering(string user3gmail, string pass3, string name3, string nickname3, string birth)
        {
            return "{\"registerPachage\":{\"Id\":26}}";
        }

I'm a beginner in Ajax Jquery and I'm doing exercise to improve my knowledge about it. My problem is when I click #btnRegister it's print error not Successfully message . I think there's a problem in the parameters I passed on the ajax but I don't know what is it.

Upvotes: 0

Views: 749

Answers (3)

Bharat
Bharat

Reputation: 6095

You can just simply pass parameters like these,

    $.ajax({
        type: "POST",
        contentType: "application/json; charset=utf-8",
        url: "http://localhost:7910/WebService.asmx/Registering",
        data: "user3gmail=" + $("#txtEmail").val() + "&pass3="+$("#txtPassword").val(),
        datatype: "json",
        success: function (data) {
            alert("Successfully register");
        },
        error: function (data) {
            alert("error");
        }
    })

here i have added only 3 parameters, but you can add more.

Upvotes: 0

Vijay
Vijay

Reputation: 31

I think you have to pass same name of parameter as in your code behind method. See below code :

var obj = { user3gmail: 'test1', pass3: 'test1', name3: 'test1', nickname3: 'test1', birth: '232' };
        $.ajax({
            type: "POST",
            contentType: "application/json; charset=utf-8",
            url: "Home/Registering",
            data: JSON.stringify(obj),
            datatype: "json",
            success: function (data) {
                alert("Successfully register");
            },
            error: function (data) {
                alert("error");
            }
        });

    public string Registering(string user3gmail, string pass3, string name3, string nickname3, string birth)
            {
               return "{\"registerPachage\":{\"Id\":26}}";
            }

I think this will be help

Upvotes: 2

dbugger
dbugger

Reputation: 16389

You are sending a single object with multiple properties. The Registering method currently is expecting multiple parameters (with different names than the properties being sent). Its should have a single parameter with the properties supplied -- Firstname, Lastname, Email and Password.

public class RegisterInfo
{
    public string Lastname {get;set;}
    public string Firstname {get;set;}
    public string Password {get;set;}
    public string Email {get;set;}

}

Then the registering method would look like...

 public string Registering(RegisterInfo register)
        {
            return "{\"registerPachage\":{\"Id\":26}}";
        }

Upvotes: 1

Related Questions