pass parameter value to web service using javascript

Question

This is my hltm5 code

<div data-options="dxView : { name: 'home' } " >
    <div data-options="dxContent : { targetPlaceholder: 'content' } " >
        <h1 data-bind="text: message"></h1>
        <div id="textusername" data-bind="dxTextBox: { value: name }" style="width: 150px"></div>
        <div id="textpwd" data-bind="dxTextBox: { value: name }" style="width: 150px"></div>       
        <div data-bind="dxButton: { text: 'Login', clickAction: sayHello }"></div>
        <div data-bind="dxButton: { text: 'Forget Password', clickAction: greet }"></div>
    </div>
</div>

And this is my JavaScript code

sayHello: function () {
            var username = $("#textusername").dxTextBox("instance");
            var G_username = username.option('value');                
            var pwd=$("#textpwd").dxTextBox("instance");
            var G_pwd= pwd.option('value');
             $.ajax({ type: "POST",
    url: "AllMethods.asmx/HelloWorlds",
    data: "{ 'username': " + $("#G_username").dxTextBox("instance") + ", 'pwd': " + $("#G_pwd").dxTextBox("instance") + "}",
    contentType: "application/json; charset=utf-8",
    dataType: "json"});     
}   

My question is that: How to pass two parameter value to web service using javascript and get return value from webservice ... please give a example...

Answer 1

check the below link for passing parameters to webservice

http://midnightprogrammer.net/post/calling-asp-net-web-service-using-jquery-part-ii-passing-parameters

Answer 2

I don't think it is safe to send username and password as Json data. But for your question here is how you pass data to webservice:

        var username = $("#txtUsername").val();
        var password = $("#txtPassword").val();
        $.ajax({
            url: "webservice url",
            type: "POST",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            data: "{'username':'"+username+"','password':'"+password+"'}",
            cache: false,
            success: function (data) {
                var output = data.d;
            },
            error: function (data) {
            }
        });

Answer 3

Remove the quotes

change following

data: "{ 'username': " + $("#G_username").dxTextBox("instance") + ", 'pwd': " + $("#G_pwd").dxTextBox("instance") + "}",

with

data: { 
   'username': $("#G_username").dxTextBox("instance"), 
   'pwd': $("#G_pwd").dxTextBox("instance")
},

Also there is no need to specify this contentType: "application/json; charset=utf-8"