Advanced Search

Fill select list with text value pairs

/ Published in: jQuery
Save to your folder(s)
This snippet describes how to fill select html element with Text, Value pairs
where 'Text' is displayed to the user and 'Value' is actual value to be processed.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. function FillSelectHtmlElement(ctrlId,result) {
  2.         $(ctrlId).get(0).options.length = 0;
  3.         $(ctrlId).get(0).options[0] = new Option("-- Make your selection --", "-1");
  4.         //$('<option/>').appendTo(ctrlId); // uncomment this line if you wish an empty select option
  5.  
  6.         $.each(result, function (index, item) {
  7.             $(ctrlId).get(0).options[$(ctrlId).get(0).options.length] = new Option(item.Text, item.Value);
  8.         });
  9.     }
  10.  
  11. Call this function like this:
  12. var ddl = $("#myDropDownList");
  13. var someTestValues = [{ "Text": "Selection 1", "Value": "Value1" }, { "Text": "Selection 2", "Value": "Value2"}];
  14. FillSelectHtmlElement(ddl,someTestValues );

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.