trying to select value of a select box with jquery

Question

I looked at this example but couldn't implement it. I wonder if I am missing something else.

Note: response.user_data['admin'] is not null. I checked.

Any ideas?

Thanks

DIDN'T WORK LINES

$('#select_administrator option[value="'+response.user_data['admin']+'"]');
$('#select_administrator option:eq('+response.user_data['admin']+')').attr('selected', 'selected');
$('#select_administrator option:eq('+response.user_data['admin']+')').prop('selected', true);

HTML

<select id="select_administrator" name="select_administrator">
    <option value="NO" <?php echo ($administrator == 'NO') ? 'selected="selected"' : null; ?>>NO</option>
        <option value="YES" <?php echo ($administrator == 'YES') ? 'selected="selected"' : null; ?>>YES</option>
</select>

JQUERY

$(document).ready(function()
{
   $("#select_user").change(function(event)
   {
      event.preventDefault();

      var selected_user = null;
      selected_user = $(this).val();

      $.ajax({
                 type       : "POST",
                 url        : 'mypage.php',
                 data       : {select_user:selected_user},
                 dataType   : "json",
                 success        : function(response)
         {
            if(response.status == "success")
                    {
                        $("#form_errors_jquery").hide();

                        $("#text_username").val(response.user_data['username']);

                        //response.user_data['admin'];
                        //Should select admin combo here

        //$('#select_administrator option[value="'+response.user_data['admin']+'"]');
        //$('#select_administrator option:eq('+response.user_data['admin']+')').attr('selected', 'selected');
        //$('#select_administrator option:eq('+response.user_data['admin']+')').prop('selected', true);

                    }
                    else
                    {
                        $("#form_errors_jquery").html(response.error).fadeIn(1000);
                    }
         },
                 error      : function(response)
                 {
                     $("#form_errors_jquery").html("A network error occured").fadeIn(1000);
         }

      return false;
   });
});

Define "didn't work". FYI, I believe you can simply do `$('#select_administrator').val('YES');` — random_user_name, Dec 05 '12 at 14:12

Magicmarkker · Answer 1 · 2012-12-05T15:02:30.250

Well for starters, your jquery is selecting this when it changes $("#select_user").change(function(event) but your html is <select id="select_administrator" name="select_administrator"> so you might want to select the correct id of the select element and try again.

Further, both of these work in a jsfiddle with your HTML. Either your response.user_data['admin'] has spaces, or is not coming back correctly formatted is my guess.

$(document).ready(function() {
   $('#select_administrator option[value="NO"]').prop('selected', true); 
});

$(document).ready(function() {
   $('#select_administrator option[value="NO"]').attr('selected','selected'); 
});

Edit: I've made a jsfiddle that boiled down the code above with what you're trying to do, and these two options didn't work at all:

 $('#select_administrator option:eq('+response.user_data['admin']+')').attr('selected', 'selected');
 $('#select_administrator option:eq('+response.user_data['admin']+')').prop('selected', true);

But if you add the attr('selected', 'selected'); to the first try to make it look like this:

$('#select_administrator option[value="'+response.user_data['admin']+'"]').attr('selected', 'selected');

it works fine. Try it out and let me know?

`response.user_data['admin']` returns either YES or NO without spaces. I'l alert()'ing it to double check. ID attribute of the field is also correct. — BentCoder, Dec 05 '12 at 14:51

score 0 · Answer 2 · answered Dec 05 '12 at 14:57

0

To solve the issue I ended up using this code instead but why original code above doesn't work?

if (response.user_data['admin'] == 'YES')
{
    $('#select_administrator').val('YES');
}
else
{
    $('#select_administrator').val('NO');
}

answered Dec 05 '12 at 14:57

BentCoder

12,257
22
93
165

trying to select value of a select box with jquery

2 Answers2