I am a beginner in the world of Javascript, JSON, and jQuery. I am seeking some guidance as I navigate through this new territory. On my JSP page, there is a drop down list that needs to be populated with content when the page loads. To achieve this, I have written a Servlet that retrieves the content for the drop down list in the form of a Map, converts it to a JSON string, and sends it back to the JSP using
response.getWriter().write(json);
. However, I am encountering difficulties in retrieving the result on the JSP side and populating the drop down list accordingly. Below are snippets of my code:
customer.jsp
$(document).ready(function() {
getCustomerOption('customer'); //attempting to pre-populate the customer drop down list
});
function getCustomerOption(ddId) {
var dd = $('#' + ddId);
$.getJSON("http://localhost:8080/WebApps/DDListJASON", function(opts) {
$('>option', dd).remove(); // Removing previous options in the drop down list
if (opts) {
$.each(opts, function(key, value) {
dd.append($('<option/>').val(key).text(value));
});
}
});
}
down where the drop down list is generated
<select id="customer" name="customer">
<option></option>
</select>
Despite my efforts, the list remains empty after the data retrieval process. It's quite frustrating.