Dynamically Change The Items In Dropdownlist

Hi All,

Recently got to manage a site developed in YII. Learning the framework on the fly. Given my use case below. Searched almost a day in forums but in vain. Much appreciate any pointers. I have a dropDownList which should simply show 0,1,2,3,4,5…‘n’. The numbers should be dynamically changed based on another array populated in the same page. If the array has 3 elements, the list should show only 0,1,2,3. The array can be changed by the user dynamically in the same page.

How can I change the dropDownList dynamically without reloading the page. With jQuery/JS can I dynamically change the list? If so, how can it be done?


<div class="row">

    &lt;?php echo &#036;form-&gt;labelEx(&#036;model,'required_courses'); ?&gt;

	&lt;?php echo &#036;form-&gt;dropDownList(&#036;model,'required_courses', 

              array('' =&gt; 'Please select required number of courses') + (&quot;1&quot;=&gt;&quot;1&quot;, &quot;2&quot;=&gt;&quot;2&quot;, &quot;3&quot;=&gt;&quot;3&quot;), 

              array('class' =&gt; 'span-7')); ?&gt;

    &lt;?php echo &#036;form-&gt;error(&#036;model,'required_courses'); ?&gt;


The list is static now. I cannot post the complete page. The other array is coursesArray(). This can be dynamically changed through JS in the same page.

Yes, jQuery can change that list for you. Example:

var dropdown = $("#idofdropdown");

 $(dropdown).empty(); // removes all elements in dropdown

$(data).each(function () {

 	$("<option />", {

          val: this.value,

          text: this.text



I Googled and found this answer here: