CODEWITHSUNDEEP
javascriptjqueryajax
jasonkkt
jasonkkt

Reputation: 53

Ajax jQuery Not passing Variable to Data Undefined Error

I'm loading data using a page scroll function. When I hard code the data line in my function everything works ok

For example this works sortby is set to "asc"

data: '{pageIndex: ' + pageIndex + ', sortby: "asc" }',

This doesn't work and I get undefined message

data: '{pageIndex: ' + pageIndex + ', sortby: '+ sortby +' }',

I have set an alert in the function and the value of var sortby does equal asc the alert box pops up when I scroll to the bottom of the page which is correct.

But it's not getting passed and causing the undefined error

This is what I have:

<script type="text/javascript">
  var pageIndex = 1;
  var pageCount;
  $(window).scroll(function () {
    if ($(window).scrollTop() == $(document).height() - $(window).height()) {
        GetRecords();
    }
  });
  function getdropdownlistSelectedItem(sender, args) {
    var raddropdownlist = $find('<%=RadDropDownList1.ClientID %>');
    var selecteditem = raddropdownlist.get_selectedItem().get_value() || "asc";
    return selecteditem;
  }
  function GetRecords() {
    var sortby = getdropdownlistSelectedItem();
    alert('Sortby: ' + sortby);
    pageIndex++;
    if (pageIndex == 2 || pageIndex <= pageCount) {
      $("#loader").show();
      $.ajax({
        type: "POST",
        url: "categorypage.aspx/GetCustomers",
        // data: '{pageIndex: ' + pageIndex + ', sortby: "asc" }',
        data: '{pageIndex: ' + pageIndex + ', sortby: '+ sortby +' }',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: OnSuccess,
        failure: function (response) {
          alert(response.d);
        },
        error: function (response) {
          alert(response.d);
        }
    });
  }
}

Can someone please show me how to pass this value correctly?

Thanks.

Alert box shows correct value

Upvotes: 1

Views: 303

Answers (1)

Rory McCrossan
Rory McCrossan

Reputation: 337560

The issue is because you're not wrapping the string contained in sortby in quotes. Try this:

data: '{pageIndex: ' + pageIndex + ', sortby: "'+ sortby +'" }',

Note the double quotes around the second concatenated value.

Better still would be to not build an ugly concatenated string yourself, but instead just provide an object to the data property. jQuery will encode it as required for you:

data: {
  pageIndex: pageIndex,
  sortby: sortby
},

Upvotes: 1

Related Questions