如何使用JQuery从AJAX调用中使用JSON值更新下拉列表

Question

Hi I am receiving a JSON list in the Ajax success block and I want to assign these values to a dropdown list potentialFailureModeList present on my JSP. I am new to JSON, i have tried a lot to findout on the net but did not get anything. Please help me. Any useful link will also work.

//Code from JSP

<td><select name="fmeaEntityForm[0].potentialFailureMode.id"
                            id="potentialFailureMode0" onchange="potentialFailureModeText(this)">
                                <option value="-1"><spring:message code="label.fmea.select.potentialFailureMode" /></option>
                                <c:forEach items="${potentialFailureModeList}" var="pfm">
                                    <option value="${pfm.id}">${pfm.potentialFailureMode}</option>
                                </c:forEach>
                        <option value="0"><spring:message code="label.fmea.select.other" /></option>
                        </select></td>

//pattern receiving in ajax

{"potentialFailureModeList":[{"id":3,"potentialFailureMode":"potentialFailureMode1","remark":"1"},
             {"id":4,"potentialFailureMode":"potentialFailureMode2","remark":"2"}]}

//Ajax method function getpotentialFailureModeList(elementIdIndex) {

        if (-1 != document.getElementById("subSystem"+elementIdIndex+"").value)  {

            $.ajax({
                type: "GET",
                url: '/ISO26262/FmeaDocumentPage/potentialFailureModeList',
                data: ({subSystemId : $('#subSystem'+elementIdIndex+'').val() }),
                success: function(items) {
                    alert("success");
                    alert(items);
                    // to do task
                },
                error: function (e) {
                    alert('Error Received: ' + e);
                  },
            });
        } 
}

Answer 1

json should be in format of

 {id: x, value: y}

Then the ajax success function similar to this --

success: function (items) {
    $.each(items, function (index, item) {
    $('#potentialFailureMode0').append($('<option>', {value: item.id, text: item.potentialFailureMode}));
});

Answer 2

Thanks a lot for replying. I got the answer. I am posting here, so that if anyone else need the same.

function getpotentialFailureModeList(elementIdIndex)  {

        if (-1 != document.getElementById("subSystem"+elementIdIndex+"").value)  {

            $.ajax({
                type: "GET",
                url: '/ISO26262/FmeaDocumentPage/potentialFailureModeList',
                data: ({subSystemId : $('#subSystem'+elementIdIndex+'').val() }),
                dataType:'json',
                success: function(items) {
                    var list = items;
                    $.each(list.potentialFailureModeList, function (index, item) {
                        $('#potentialFailureMode'+elementIdIndex+'').append($('<option>', {value: item.id, text: item.potentialFailureMode}));
                        })
                },
                error: function (e) {
                    alert('Error Received: ' + e);
                  },
            });
        } 
}