JSON.stringify is sending empty string

Total Post:61

Points:429
 1641  View(s)
Ratings:
Rate this:

I am using jQuery 1.7.2 and jQuery Validation 1.8.1 with asp.net. In jQuery Validation there is one option called remote it need ajax call to web service. My thing is I am checking id is already use or not. I am using JSON.stringify to post the value to the web service but it will send empty string but if I send without JSON.stringify, I can see the value. 

My code is as below. So how can we solve this 

$(document).ready(function () {
    var validator = $("#form1").validate({
      rules: {
        ctl00$ContentPlaceHolder$txCivilID: {
          required: true,
          rangelength: [12,12],
          digits: true,
          remote: {
            url: "CivilID.aspx/IsAlreadyAvailable",
            type: "post",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            data: JSON.stringify({ civilID: $('#<%=txCivilID.ClientID%>').val() }),
            dataFilter: function (data) {
              var msg = JSON.parse(data);
              if (msg.hasOwnProperty('d'))
                return msg.d;
              else
                return msg;
            }
          }
        },
        ctl00$ContentPlaceHolder$txFirstName: {
          required: true
        },
        ctl00$ContentPlaceHolder$txLastName: {
          required: true
        },
        ctl00$ContentPlaceHolder$txMobile: {
          required: true,
          rangelength: [8,8],
          digits: true
        },
        ctl00$ContentPlaceHolder$dpUserType: {
          required: true
        }
      },
      messages: {
        ctl00$ContentPlaceHolder$txCivilID: {
          required: "Civil for is required!",
          rangelength: "Civil for should be {0} in length!",
          digits: "Civil for should be only numbers!",
          remote: "Civil ID already exists !!!"
        },
        ctl00$ContentPlaceHolder$txFirstName: "First Name is required!",
        ctl00$ContentPlaceHolder$txLastName: "Last Name is required!",
        ctl00$ContentPlaceHolder$txMobile: {
          required: "Mobile number is required!",
          rangelength: "Mobile number should be {0} in length!",
          digits: "Mobile number should be only numbers!"
        },
        ctl00$ContentPlaceHolder$dpUserType: "Select User Type !"
      },
      errorPlacement: function (error, element) {
        $('label[for="' + element.attr("id") + '"]').text(error.text());
      }
    });
  });  

Render Version of Javascript 

<script type="text/javascript">
$(document).ready(function () {
    var validator = $("#form1").validate({
      rules: {
        ctl00$ContentPlaceHolder$txCivilID: {
          required: true,
          rangelength: [12,12],
          digits: true,
          remote: {
            url: "CivilID.aspx/IsAlreadyAvailable",
            type: "post",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            data: '{ civilID:' + JSON.stringify($('#ContentPlaceHolder_txCivilID').val()) + '}',
            dataFilter: function (data) {
              var msg = JSON.parse(data);
              if (msg.hasOwnProperty('d'))
                return msg.d;
              else
                return msg;
            }
          }
        },
        ctl00$ContentPlaceHolder$txFirstName: {
          required: true
        },
        ctl00$ContentPlaceHolder$txLastName: {
          required: true
        },
        ctl00$ContentPlaceHolder$txMobile: {
          required: true,
          rangelength: [8,8],
          digits: true
        },
        ctl00$ContentPlaceHolder$dpUserType: {
          required: true
        }
      },
      messages: {
        ctl00$ContentPlaceHolder$txCivilID: {
          required: "Civil for is required!",
          rangelength: "Civil for should be {0} in length!",
          digits: "Civil for should be only numbers!",
          remote: "Civil ID already exists !!!"
        },
        ctl00$ContentPlaceHolder$txFirstName: "First Name is required!",
        ctl00$ContentPlaceHolder$txLastName: "Last Name is required!",
        ctl00$ContentPlaceHolder$txMobile: {
          required: "Mobile number is required!",
          rangelength: "Mobile number should be {0} in length!",
          digits: "Mobile number should be only numbers!"
        },
        ctl00$ContentPlaceHolder$dpUserType: "Select User Type !"
      },
      errorPlacement: function (error, element) {
        $('label[for="' + element.attr("id") + '"]').text(error.text());
      }
    });
  });

  1. Post:194

    Points:1396
    Re: JSON.stringify is sending empty string

    Try changing this line:

     data:JSON.stringify({ civilID: $('#<%=txCivilID.ClientID%>').val() }),

    to this...

     data:JSON.stringify('{ civilID:' + $('#<%=txCivilID.ClientID%>').val() + '}'),

    As that didnt work have you thought about offloading the data bit to a function:

    function getCivilIdData() {
      var data = {};
      data['civilId'] =$('#<%=txCivilID.ClientID%>').val();
      return data;
    }

    Then change your other line to this:

     data: JSON.stringify(getCivilIdData()),

      Modified On Apr-07-2018 01:03:17 AM

Answer

NEWSLETTER

Enter your email address here always to be updated. We promise not to spam!