CODEWITHSUNDEEP
javascriptphphtmlformsdrop-down-menu
Даяна Димитрова
Даяна Димитрова

Reputation: 103

I cannot get the value of CHtml::dropDownList with Javascript

I am new to PHP and Javascript and I have an issue with the following problem. Here is my html/php:

<div class="row" style="margin-bottom:10px;">
                <div class="col-md-12">
                  <?php echo CHtml::dropDownList('contact_list','',
                  (array)Driver::contactDropList( Driver::getUserId())
                  ,array(
                  'class'=>"contact_list chosen"
                  ))?>
                </div>
            </div>

I am trying to reset this field when a button Cancel is clicked. By reset I mean to make it with value Select from contacts (it is the first option in the dropdown). Here is and my Javascript code, which is not working properly. It only closes the form, but without refresh of the page the dropdown value is there and it is not changed to the default one:

        $( document ).on( "click", ".close-modal", function() {     
            var elements = $('.contact_list');
            elements.select = 'Select from contacts';
            var id=$(this).data("id");
            $(id).modal('hide');
        });

I also tried to reset the whole form with $("#frm").reset(); method, but there was no desired result, too.

This is the default value, which I want to appear every time when the form is open:

Now, it is appearing the previous value, which the user have chosen.

first

second

Upvotes: 1

Views: 54

Answers (2)

Muhammad Mutti Ur Rehman
Muhammad Mutti Ur Rehman

Reputation: 74

$('.contact_list option:first-child').attr("selected", "selected");

Try this

You can also try the following code:

$(".contact_list").prop("selectedIndex",0);

Note: This option will select the first option of dropdown. Make sure to make "Select your contact" first option

Upvotes: 2

Shamir Imtiaz
Shamir Imtiaz

Reputation: 158

If you want to see the pre-selected value of $(.contact_list) then first you need to set a variable of pre-selected value:

var contactVal = $('.contact_list').find(":selected").val();

Now after $(id).modal('hide'); you set the pre-selected value:

$('.contact_list option[value=contactVal]').attr('selected','selected');

Let me know if this solves your issue.

Upvotes: 1

Related Questions