title: Unable to call Page Method using jQuery ajax
body: <p>I have created a sortable ListView using jQueryUI and now I am stuck in trying to save it back to the database. Here's how I have created the ListView: </p>
  
  <pre><code>&lt;asp:ListView ID="ListViewItems" runat="server"&gt;
  &lt;LayoutTemplate&gt;
      &lt;div id="sortable1" class="connectedSortable"&gt;
          &lt;asp:PlaceHolder ID="itemPlaceholder" runat="server"&gt;&lt;/asp:PlaceHolder&gt;
      &lt;/div&gt;
  &lt;/LayoutTemplate&gt;
  &lt;ItemTemplate&gt;
      &lt;li class="ui-state-default" id='id_&lt;%# Eval("Item_ID") %&gt;'&gt;&lt;%# Eval("Item_Name") %&gt;&lt;/li&gt;
  &lt;/ItemTemplate&gt;
  </code></pre>
  
  <p> 
  There is a button(div) under the ListView which upon being clicked should save the reordered list back to db: </p>
  
  <pre><code>&lt;div class="btn-info" id="UpdateOrder" onclick="SendUpdatedOrder()"&gt;Update Order&lt;/div&gt;  
  </code></pre>
  
  <p>JS File content:  </p>
  
  <pre><code>function SendUpdatedOrder() {
  var order = $('#sortable1').sortable('toArray').join(',').replace(/id_/gi, '');
  //alert(order);
  $.ajax({
      type: "POST",
      url: "~/AdminEditItems.aspx/UpdateRuleOrder",
      data: '{}',
      contentType: "application/json; charset=utf-8",
      dataType: "json",
      success: OnSuccess,
      failure: function (response) {
          alert(response.d);
      }
  });} 
  </code></pre>
  
  <p>I have created a page method in AdminEditItems.aspx.cs - </p>
  
  <pre><code> [WebMethod]
      public static void UpdateRuleOrder(string order)
      {
          ....do something...
      }   
  </code></pre>
  
  <p>Upon execution the UpdateRuleOrder method is not getting called at all. Any alerts put by me in UpdateRuleOrder function of JS is getting called successfully but the ajax method somehow is not working. I am not able to find out where I am going wrong.  </p>