I have a form that lists a bunch of links that open basic documents, ie. pdf, docs, etc. On the right side those links I have a href link to open a jQuery dialog with details on each specific link, for example, name of link, option to upload a new updated document etc. Now also in this dialog I would like to be able to have a dropdown list that holds a sort order, which would be a list of numbers 1,2,3,4,5 etc. so the user can reorder their links. What is the best way to fill the form textboxes, dropdown lists (most important) with needed data from the database and then open the jquery dialog. I currently am using jquery ajax and webservice to fill the textboxes fine, but the dropdown list is getting filled after the browser is rendered. I execute the ajax call with the jquery button click event when the user clicks on the href tag that lives on the right side of each link. This doesnt allow me to grab the selectedvalue on postback on the save button click event to get the updated values and update the record. Any help would be greatly appreciated.
function LoadDocumentSort(id, selectedSort) {
$.ajax({
type: 'POST',
url: baseUrl + 'webservices.asmx/GetSortCount',
data: JSON.stringify({ articleID: articleid }),
contentType: "application/json; charset=utf-8",
dataType: 'json',
success: function (data) {
if (data.d != '') {
$("#UIEditSort").empty();
var sortCount = data.d;
var listItems;
listItems = "<option value=''></option>";
for (var i = 1; i < sortCount + 1; i++) {
if (selectedSort == i) {
listItems += "<option selected='true' value='" + i + "'>" + i + "</option>";
//$("#UIEditSort").append($("<option selected='true'><option />").val(i).text(i));
}
else {
//$("#UIEditSort").append($("<option><option />").val(i).text(i));
listItems += "<option value='" + i + "'>" + i + "</option>";
}
};
$("#UIEditSort").html(listItems);
}
},
error: function (xhr, ajaxOptions, thrownError) {
alert('error');
}
});