I have one dropdown which is optional and need to show only up when there is data and is selected. When is selected, the next dropdown should only show data related to the  selected item. For some reason I can see the selected ID  but my Jquery function is not returning the matching item, rather returning everything because of the "data: { contractid: window.contractID }". I want to add extra parameter so that if that parameter is present, the related item should be only loaded. Below is my html and the JQuery

2. Html
3. *******************
4. 
   
5. @{
6. var contractClass = ViewData["ContractClass"] as List<SelectListItem>;
7. if (contractClass == null || contractClass.Count == 0)
8. {
9. @Html.DropDownList("ddlContract", new List<SelectListItem>(), "--Select A Contract--", new { disabled = true, id = "ddlContract", @style = "width:95%; disabled" })
10. }
11. else
12. {
13. @Html.DropDownList("ddlContract", contractClass, "--Select A Contract--", new { id = "ddlContract", @style = "width:95%" })
14. }
15. }
16. </td>
17. </tr>
18. <tr id="myWdtoToHide" style="display: none;">
19. <td>
20. <span id=wdtoDrop>WD/TO</span> <br>
21. <select name=ddlwdto id=ddlwdto style="HEIGHT: 25px; WIDTH: 95%">
22. <option value="" selected>--Select A WD/TO--</option>
23. </select>
24.  
25. </td>
26. </tr>
27. <tr id="cdrlselect">
28. <td>
29. <span id=cdrlDrop>CDRL</span> <br>
30. <select name=ddlCdrl id=ddlCdrl disabled style="HEIGHT: 25px; WIDTH: 95%">
31. <option value="" selected>--Select A CDRL Number--</option>
32. </select>
33.  
34. </td>
35. </tr>
36. <tr>
37. <td id="DDID">
38. <span id=scheduleDrop>CDRL Due Date</span> <br>
39. <select name=ddlSchedules id=ddlSchedules style="HEIGHT: 25px; WIDTH: 95%">
40. <option value="" selected>--Select A Due Date--</option>
41. </select>
42.  
43. </td>
44. <td>&nbsp; </td>
45. </tr>
46. </tbody>
47. </table>
48. 
    
49. 
    
50. 
    
51. 
    
52. 
    
53. JQuery
54. 
    
55. $('#ddlwdto').change(function ()
56.  {
57.   
58.    CascadeClearCdrl();
59.    
60.    var contractId = window.contractID;
61.    if (!contractId) return;
62.    var wdtoSelected = $('#ddlwdto').prop('selectedIndex') > 0;
63.    if (wdtoSelected) {
64.        var cdrlwdtoId = $('#ddlwdto').val();
65.        window.wdtoID = cdrlwdtoId;
66.        LoadCdriSelect();
67.    }
68. });
69. 
    
70. 
    
71. 
    
72. function LoadCdriSelect() {
73. $.ajax({
74. method: "GET",
75. dataType: "json",
76. url: "@Url.Action("LoadCdrls", "VendorUpload")",
77. cache: false,
78. data: { contractid: window.contractID, wdtoid: window.wdtoID },
79. success: function (result) {
80.  
81.    $.each(result, function (i, cdrls) {
82.        if (window.wdtoID) {
83.            debugger;
84.            $("#ddlCdrl").append('<option value="' + cdrls.Value + '">' + cdrls.Text + '</option>');
85.            
86.        }
87. //$("#ddlCdrl").append('<option value="' + cdrls.Value + '">' + cdrls.Text + '</option>');
88. });
89. $("#ddlCdrl").removeAttr("disabled");
90. },
91. error: function() {
92. alert('CDRL retrieval Error.');
93. }
94. });
95. }
96. 
    
97.               function CascadeClearCdrl() {
98. var control = $("#ddlCdrl");
99. ClearDropDown(control);
100. CascadeClearSchedule();
101. }