title: Pass Multi Parameters in jQuery Ajax Script
body: <p>This is my Default.aspx + jQuery Script:</p>
  
  <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org
  /TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
  &lt;%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" 
  Inherits="Sample001.Default" %&gt;
  &lt;script src="jquery-1.6.4.min.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
  &lt;head runat="server"&gt;
      &lt;title&gt;&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;form id="form1" runat="server"&gt;
      &lt;div&gt;
          &lt;table&gt;
              &lt;tr&gt;
                  &lt;td&gt;
          &lt;asp:Label ID="masterlbl" Text="Master" runat="server" /&gt;
                  &lt;/td&gt;
                  &lt;td&gt;
                      &lt;span class="Mastercs"&gt;
                  &lt;asp:DropDownList ID="ddl1" runat="server"&gt;
                  &lt;asp:ListItem Text="Item1" Value="Item1" /&gt;
                  &lt;asp:ListItem Text="Item2" Value="Item2" /&gt;
                  &lt;asp:ListItem Text="Item3" Value="Item3" /&gt;
                  &lt;asp:ListItem Text="Item4" Value="Item4" /&gt;
                  &lt;asp:ListItem Text="Item5" Value="Item5" /&gt;
                  &lt;/asp:DropDownList&gt;
                      &lt;/span&gt;
                  &lt;/td&gt;
                  &lt;td&gt;
              &lt;asp:Label ID="slavelbl" Text="Slave" runat="server" /&gt;
              &lt;/td&gt;
                  &lt;td&gt;
                      &lt;span class="slavecs"&gt;
                      &lt;asp:DropDownList ID="ddl2" runat="server" /&gt;
                      &lt;/span&gt;
                  &lt;/td&gt;
              &lt;/tr&gt;
          &lt;/table&gt;
      &lt;/div&gt;
      &lt;/form&gt;
      &lt;script type="text/javascript"&gt;
          $(document).ready(function () {
              $('span.Mastercs select').change(function () {
                  $.ajax({
                      type: "POST",
                      url: 'MyHandler.ashx',
                      dataType: "text",
                      data: "ItemSelected=" + $('select#ddl1').val(),
                      async: true,
                      success: function (data) { Handler_Success(data); }
                  });
              });
              function Handler_Success(data) {
                  $('select#ddl2').empty();
                  $.each(data, function (i, slaveValue) {
  $('select#ddl2').append($('&lt;option&gt;&lt;/option&gt;')
  .val(data.Value).html(data.Text));
                  });
              }
          });
      &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>The above code work correctly.
  But I need to pass one more parameter, and there is a problem.
  I try <a href="https://stackoverflow.com/questions/1916309/pass-multiple-parameters-to-jquery-ajax-call">This Way</a> and also the following code, but  retrieve null value:</p>
  
  <pre><code>$.ajax({
      type: "POST",
      url: 'MyHandler.ashx',
      dataType: "text",
      data: '{"ItemSelected=" ' + $('select#ddl1').val() + ', "ID="' + 
      $('select#ddl1').attr('id') + ' }',
      async: true,
      success: function (data) { Handler_Success(data); }
      });
  });
  </code></pre>
  
  <p>Where is the problem?</p>
  
  <p>Edit:</p>
  
  <p>I also need to use HttpHandler  rather WebService or WebMethod</p>
  
  <p>this is my HttpHandler:</p>
  
  <pre><code>public class SlaveValue {
      public string Value { get; set; }
      public string Text { get; set; }
      }
  
  public class SlaveValueHandler : IHttpHandler {
  
      public bool IsReusable {
      get { return true; }
      }
  
          public void ProcessRequest(HttpContext context) {
              string valueSelected = context.Request["ItemSelected"];
              string id = context.Request["ID"];
              List&lt;SlaveValue&gt; slaveValues = new List&lt;SlaveValue&gt;();
              SlaveValue sv;
              sv = new SlaveValue();
              sv.Text = "SV1";
              sv.Value = valueSelected + id + "s1";
              slaveValues.Add(sv);
  string responseText = Newtonsoft.Json.JsonConvert.SerializeObject(slaveValues);
  context.Response.ContentType = "text/json";
  context.Response.Write(responseText);
  }
  }
  </code></pre>
  
  <p>And My WebConfig:</p>
  
  <pre><code>&lt;configuration&gt;
      &lt;system.webServer&gt;
          &lt;validation validateIntegratedModeConfiguration="false" /&gt;
          &lt;handlers&gt;
              &lt;add name="Slave Handler" verb="*" path="MyHandler.ashx" 
  type="Sample001.SlaveValueHandler,Sample001" preCondition="integratedMode" /&gt;
          &lt;/handlers&gt;
      &lt;/system.webServer&gt;
      &lt;system.web&gt;
          &lt;compilation debug="true" targetFramework="4.0" /&gt;
      &lt;/system.web&gt;
  
  &lt;/configuration&gt;
  </code></pre>
  
  <p>Edit:</p>
  
  <p>I Find it here:
  <a href="http://www.codeproject.com/Articles/203621/Call-HTTPhandler-from-jQuery-Pass-data-and-retriev" rel="nofollow noreferrer">CodeProject</a></p>