2016-02-05 34 views
0

我初學者到AJAX和春季mvc.I已經從用ajax call.I想知道如何從AJAX對象設置下拉值我的數據庫(MongoDB中)得到的數據。如何設置使用Ajax調用下拉值Spring MVC中

home.jsp 

<select class="form-control" id="list1value"> 
<c:forEach items="${???}" var="item"> 
<option value="${item. pri-ID}">${item.uniID}</option> 
</c:forEach> 
</select> 

<script type="text/javascript" > 
    $(document).ready(function() { 
      $('#id').on('change', function() { 
       var value = $(this).val(); 
       $.ajax({ 
        type: "GET", 
        url: "list", 
        data: "id=" +value, 
        success: function(data) { 
         alert(data); 
         console.log(data); 
         $('#list1value').val(data.cusID); 
         $('#list1value').val(data.uniID); 
        } 
       }); 
      }) 
    }) 
</script> 

我的數據對象是 { 「cusID」: 「14345」, 「uniID」: 「123999」, 「名稱」: 「wName」, 「PRI-ID」: 「11335」 }

如何編寫代碼部分分配選項值

回答

0

如果我理解正確的話,有什麼你的代碼錯誤。分配值list1value和list2value後你檢查檢查自己的「價值」屬性的元素?

您的代碼僅改變「value」屬性,而不是在元件的內HTML顯示的文字。

要確保你可以這樣做:

$.ajax({ 
     type: "GET", 
     url: "list", 
     data: "id=" +value, 
     success: function(data) { 
       alert(data); 
       console.log(data); 
       $('#list1value').val(data.cusID); 
       $('#list2value').val(data.uniID); 

       //check if value is assigned correctly 
       console.log($('#list1value').val()); 
       console.log($('#list2value').val()); 

       //Write in the inner html of the option 
       $('#list1value').html(data.cusID); 
       $('#list2value').html(data.uniID); 
     } 
}); 
0

嘗試使用以下成功的回調:

function(data) { 
    var selectEl = $('select.form-control'); 
    selectEl.children().remove(); 
    for (var key in data) { 
     var optionEl = $('<option/>') 
       .attr('value', data[key]) 
       .text(key); 
     el.append(optionEl); 
    } 
}