Ajax jQuery Not passing Variable to Data Undefined Error

Question

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.

Rory McCrossan · Accepted Answer · 2017-11-19 15:25:09Z

1

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
},

answered Nov 19, 2017 at 15:25

Rory McCrossan

338k41 gold badges322 silver badges353 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

jasonkkt Over a year ago

thanks wrapping it worked. when I tried the other part I got undefined again

Collectives™ on Stack Overflow

Ajax jQuery Not passing Variable to Data Undefined Error

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related