jQuery UI Widgets › Forums › Lists › DropDownList › select item on dropdown based on fetched JSON
Tagged: ajax, asp, DropDownList, item, jqxDropDownList, json, select, selectItem
This topic contains 2 replies, has 2 voices, and was last updated by GrantM 8 years, 2 months ago.
-
Author
-
I am looking for a working example or explaination on how to acheive the following:
At the momemt i have dropdownlist that is populated by
var source = { datatype: "csv", datafields: [ { name: 'Page' }, { name: 'Category' }, { name: 'Icon' }, { name: 'PageFile' }, { name: 'SecuritySetting' } ], url: "includes/getAllModules.asp?user=<%= Session("UserName") %>", async: true }; var allModulesData = new $.jqx.dataAdapter(source); $("#ddlModule1").jqxDropDownList({ source: allModulesData, displayMember:"Page", valueMember:"Page", selectedIndex: 0, width: '240'});
The above is done when the page loads. But when I click a button i want the dropdownlist to display the “Page” that has been retrieved from the .asp file like so:
$(".iconEditDashBtn").click(function() { $.post("includes/getDashboardPagesJSON.asp, function(data) { // CHANGE SELECTED OPTION ON '#ddlModule1' TO THE FIRST 'Page' IN MY JSON OUTPUT }); });
My JSON output is from getDashboardPagesJSON.asp is:
[{"PageFile":"bar_DeliveryPerformanceByMonth.html","PanelID":1,"Page":"Del Performance By Month","Args":""},{"PageFile":"bar_InvoiceTotalQuarterLast5Y.html","PanelID":2,"Page":"Inv Quarter Comparison","Args":""},{"PageFile":"bar_InvoiceTotalYearOnYearToDate.html","PanelID":3,"Page":"Inv Total Year On Year To Date","Args":""},{"PageFile":"bar_InvoiceAnalysis.html","PanelID":4,"Page":"Inv Analysis","Args":""}]
So to be clear, I have all the available “Page”‘s preloaded in to the dropdown, then later when im editing my layout, i want it to bring up the current “Page” from the data retreived instead of showing the first “Page” in the list.
Thank you for any help.- This topic was modified 8 years, 2 months ago by GrantM.
Hello GrantM,
So, in this case, you would like to set the currently selected dropdownlist item to bar_DeliveryPerformanceByMonth.html, is that correct? If such item already exists in the dropdownlist, you can call the selectItem method, e.g.:
$(".iconEditDashBtn").click(function() { $.post("includes/getDashboardPagesJSON.asp, function(data) { $("#ddlModule1").jqxDropDownList("selectItem", data[0].PageFile); }); });
Best Regards,
DimitarjQWidgets team
http://www.jqwidgets.com/It was actually “data[0].Page” I was after, but that done the trick. Thanks for your help.
-
AuthorPosts
You must be logged in to reply to this topic.