2017-09-14 96 views
0

我是jquery的新手,並且試圖用我返回的結果填充下拉菜單。我基本上有一個按鈕,它將在一個ajax調用中打開一個局部視圖,然後通過另一個ajax調用返回下拉數據。使用JQuery AJAX在部分視圖中填充下拉菜單

這裏是我的按鈕 -

<button type="button" id="createIssueBtn" class="btn btn-lg btn-info" data-toggle="collapse" data-target="#PopUpDiv">I need to create an issue</button><br/> 
<div id="PopUpDiv"></div> 

這裏是關於頁面級

<script type="text/javascript"> 

    $(document).ready(function() { 

     $('#createIssueBtn').bind("click", function() { 
      $.ajax({ 

       url: '@Url.Action("OpenPopUp", "Issues")', 
       dataType: 'html', 
       success: function (html) { 
        $('#PopUpDiv').html(html); 
       } 
      } 
     ) 
      $.ajax({ 

       dataType: "json", 
       url: '@Url.Action("GetIssueTypes", "Issues")', 
       success: function (data) { 

        $.each(data.IssueTypes, function (index, item) { 

         $("#selectIssueType").append(
          $("<option></option>") 
           .text(item.IssueType) 
           .val(item.IssueID) 
          ) 
        }) 
       } 
      }) 
     }) 

    }) 
</script> 

的JavaScript這是部分視圖 -

<div id="AddIssues"><br/> 


<div > 
<select id="selectIssueType"> 
    <option value="0">Select Issue Type...</option> 
</select> 
    </div> 
    <br/> 
    <div>Enter the details of the issue (be specific):</div> 
    <div><input type="text" id="IssueDetails" /></div> 
    <br/> 
    <p>Location of Issue:</p> 
    <div><input type="text" id="IssueLocation" /></div> 
    <div>&nbsp;<br/></div> 
</div> 

我想填充選擇。我把數據拿回來了,但綁定是把我扔掉的東西。

謝謝!

編輯

這裏是我的IssueTypes對象 -

public class IssueTypes 
    { 
     public int IssueID { get; set; } 

     public string IssueType { get; set; } 
    } 

編輯

這是我GetIssueTypes功能的問題控制器 -

public ActionResult GetIssueTypes() 
     { 
      List<IssueTypes> issuesList = new List<IssueTypes>(); 

      issuesList = issueService.GetAllIssueTypes().data.Select(w => new IssueTypes() 
      { 
       IssueID = w.IssueID, 
       IssueType = w.IssueType 
      }).ToList(); 

      return Json(issuesList, JsonRequestBehavior.AllowGet); 
     } 
+0

爲什麼不直接使用'$( '#createIssueBtn')點擊(函數(){...});' – JustinJmnz

+0

你。沒有解釋什麼不是在你的問題工作!但是你的代碼存在多個問題,尤其是在你第一次調用Ajax調用完成之前,ajax是異步調用和第二個Ajax調用可能會被執行,這意味着你將'