显示Ajax请求的响应

Question

 public ArrayList getConsignmentsID(final DB database, String searchValue) { System.out.println("inside getConsignmentsID function"); Consignment consignment = new Consignment(); DBConnection dbConnection = new DBConnection("mongodb://localhost", "transport"); dbConnection.open(); DBCollection conCollection = dbConnection.getDatabase().getCollection("consignment"); List dbCursor = null; if (searchValue != null) { BasicDBObject searchObj = new BasicDBObject("_id", new BasicDBObject("$regex", "^" + searchValue)); dbCursor = conCollection.find(searchObj, new BasicDBObject("_id", "true")).toArray(); dbConnection.close(); ArrayList consignmentList = new ArrayList(); for (DBObject x: dbCursor) { System.out.println(x); consignmentList.add(x.get("_id")); } return consignmentList; } else { return null; } //System.out.println(new > BasicDBObject("consignmentList",consignmentList)); } 

By Ajax Call i am getting this response from the json string in javascript

{ "consignmentList" : [ "" , "AAA" , "ABC" , "BHU" , "MAN" , "WER" , "ZXC"]}

and i want to parse this array string in javascript and display its values in the unodered list. and the backend response from the database is.

{ "_id" : ""} { "_id" : "AAA"} { "_id" : "ABC"} { "_id" : "BHU"} { "_id" : "MAN"} { "_id" : "WER"} { "_id" : "ZXC"}

 function autocomplet() { var min_length = 0; // min caracters to display the autocomplete var consignmentID = $('#consignmentID').val(); var consignmentList = $('#consignmentList'); if (consignmentID.length >= min_length) { $.ajax({ url: '/jqueryreturn', type: 'POST', datatype: JSON, data: { consignmentID: consignmentID }, success: function(data) { consignmentList.show(); consignmentList.html(data); } }); } else { $('#consignmentList').hide(); } } // set_item : this function will be executed when we select an item function set_item(item) { // change input value $('#consignmentID').val(item); // hide proposition list $('#consignmentList').hide(); } 

 <div ><label style="margin:15px 0 0 0;" >Consignment:</label><input onkeyup="autocomplet()" id="consignmentID" type="text" class="inputlt" name="consignmentId" value="${(consign._id)!""}" id="c" style="font-size: 16px " onclick="clearInput(this)"> <ul id="consignmentList"></ul> 

function autocomplet() {
    var min_length = 0; // min caracters to display the autocomplete
    var consignmentID = $('#consignmentID').val();
    var consignmentList = $('#consignmentList');
    if (consignmentID.length >= min_length) {
        $.ajax({
            url: '/jqueryreturn',
            type: 'POST',
            datatype: JSON,
            data: {
                consignmentID: consignmentID
            },
            success: function(data) {


                consignmentList.show();
                consignmentList.html(data);
            }
        });
    } else {
        $('#consignmentList').hide();
    }
}

// set_item : this function will be executed when we select an item
function set_item(data) {
    // change input value
    $('#consignmentID').val(data);
    // hide proposition list
    $('#consignmentList').hide();
}

<div  ><label style="margin:15px 0 0 0;" >Consignment:</label><input onkeyup="autocomplet()" id="consignmentID" type="text" class="inputlt"     name="consignmentId" value="${(consign._id)!""}" id="c" style="font-size: 16px "  onclick="clearInput(this)">
        <ul id="consignmentList"></ul>

Answer 1

You can do it this way...

success: function(data) {
   var res = "";
   for(var i=0; i<data.consignmentList.length; i++)
    {
       res +="<li>"+data.consignmentList[i]+"</li>";
    }
    consignmentList.html(res).show();

            }