asp.net passing paramets to generic handler throgh jquery ajax

Question

Hi I have been going through this article: asp.net jquery ajax json: Simple example of exchanging data

I am also using same code problem that is I am able to pass values to my handler and when i see values in handler using breakpoint everything is working fine but I am not getting values returned by handler My javascript code is:

 <script type="text/javascript">
     jQuery("#<%=btnsubmit.ClientID %>").click(function () {

         var myData = { "hicode": $('#textbox1 ').val() };

         $.ajax({
             url: "HandlerHinditoEnglish.ashx",
             data: myData,

             type: 'POST',

             success: function (data) {

                 $("#textbox2").val(data);
             },
             error: function (data, status, jqXHR) { alert("FAILED:" + status); }
         });
     });

and handler code is

        HttpResponse r = context.Response;
        r.ContentType = "text/plain";

        string Hinditext = string.Empty;
        string Englishtext = string.Empty;
        string myPar = context.Request.Form["hicode"]; 
        Hinditext = myPar;
        Englishtext = hcnvrt.ToEnglish(Hinditext).ToString();

        context.Response.Write(Englishtext);

I want to do is if i enter some text in textbox1, textbox2 should get filled with the same value.

Are you sure your text boxes IDs are `textbox1` and `textbox2`? Please check or post the relevant HTML. — Serge Belov, Nov 23 '12 at 11:02
textbox naming is not an issue i have changed textbox names before posting — user1426009, Nov 26 '12 at 09:22

score 0 · Answer 1 · answered Aug 24 '14 at 13:28

If you put your Ajax code in $(document).ready you can see that it's working fine, but when you put it in .click event it cause error. It's becuase the default behavior of button.

In order to solve this problem you need to prevent the default behavior of your button when clicking so add e parameter to .click function and also add e.preventDefault(e);.

Your final code must be look like this:

jQuery("#<%=btnsubmit.ClientID %>").click(function (e) {
    e.preventDefault(e);
    var myData = { "hicode": $('#<%=textbox1.ClientID %>').val() };
    $.ajax({
        url: "HandlerHinditoEnglish.ashx",
        data: myData,
        type: 'POST',
        success: function (data) {
            $("#<%=textbox2.ClientID %>").val(data);
        },
        error: function (data, status, jqXHR) { alert("FAILED:" + status); }
    });
});

asp.net passing paramets to generic handler throgh jquery ajax

1 Answers1