CodeIgniter/JQuery/Ajax: Set dropdown based on previously selected value

[eluser]ShawnMA[/eluser]
First off, much thanks for all of the help provided thus far. Great community!

I know this has been asked in various ways, but I have not been able to find a clear answer to my problem. I'm using a combo if CI/JQuery/Ajax for CRUD operations within my app. Within my create are multiple dropdowns, which are populated from the database...the ID of each user selection is stored with the new record upon saving. When a user updates that record, I need to be able to render the update page, with the dropdowns populated, but set to the selected value. Any guidance you can provide on where in the app/how I can set this is greatly appreciated. Below are snippets of the code I am using:

JQuery:

Code:

$.ajax(
{
url: 'index.php/admin/getEventById/' + updateId,
dataType: 'json',            
success: function( response ) {
$( '#uEventName' ).val( response.event_name );
$( '#uEventType' ).val( response.eventType_eventType_id );
/*Obviously, this would work fine if I was setting the value of a ID# of the value I want to have my dropdown default to */

My View:

Code:

<p>    
<label for="uEventName">Event Name:</label>      
&lt;input type="text" id="uEventName" name="uEventName" /&gt;  
</p>  
<p>      
<label for="uEventType">Event Type:</label>  
&lt;!--I'm populating the dropdown with all values, but need it to be set to value as obtained above (via the response) --&gt;            
&lt;?php                        
$eventtype_options = array();                
foreach($eventtypes as $eventtype){                
$eventtype_options[$eventtype->eventtype_id]=$eventtype->event_type;                
}                
echo "<td>" . form_dropdown('uEventType', $eventtype_options) . "</td>";            
?&gt;                      
</p>

Thanks!

[eluser]Aken[/eluser]
If you input a value into jQuery.val(), it will set an element's value to that. When you do that with a select element, it will find an option that has a matching value, and set it as selected.

So, in your response, include some sort of key -> value pair with the key being the select element's ID, and the value being the option value you want to issue as selected.

You can also make your ajax response jQuery code instead of JSON, which gives you more control over selectors and values and stuff. Maybe not something you want to use if you're doing a lot of ajax, but it's an option.

[eluser]theprodigy[/eluser]
Another way is to use form_dropdown's third parameter:

and the third parameter will contain the value you wish to be selected.

Just grab the value before you call your view, instead of making a second call via ajax.

[eluser]Aken[/eluser]
I believe they are looking for a solution where they can update the drop down from a value received by Ajax. The form helper wouldn't be of any help in that situation.

I'm populating the dropdown with all values, but need it to be set to value as obtained above (via the response)

[eluser]theprodigy[/eluser]
Yeah, I noticed that in his code comments, but was focusing more on his explanation prior to the code

When a user updates that record, I need to be able to render the update page, with the dropdowns populated, but set to the selected value. Any guidance you can provide on where in the app/how I can set this is greatly appreciated.

[eluser]ShawnMA[/eluser]
I appreciate all of the feedback. In the end, I am looking for a way via Ajax to set the value of the dropdown prior to it rendering. In its rendering I need all of the values populated, but the dropdown to display as set to the previously selected value.

[eluser]theprodigy[/eluser]
If you are looking for an Ajax solution, than Aken's suggestion of .val() is your best bet.

[eluser]ShawnMA[/eluser]
Thanks. I've tried the .val() solution but no luck. It's inclear to me how exactly to set the number/value pair. I've tried, $( '#uEventName' ).val( response.event_name ); where response.event_name is the response from a SQL query. Could it be that my view is overriding the assignment of values from JQuery? In other words, in my view code posted above, I'm loading the dropdown with all of the values per a query I run from my model. Could this be loading after I've assigned my value and simply overwriting the selected value? Or it would be nice to leverage the 3rd parameter (CI) for the selected value, but since that value is coming from my JQuery page, is there a way I'd be able to set it within my view?

[eluser]theprodigy[/eluser]
just to be sure, since I don't see it in your code, does your jQuery code reside within a

Code:

$(document).ready(function(){
//...
});

?

[eluser]ShawnMA[/eluser]
No.