CODEWITHSUNDEEP
jquerydrop-down-menu
psobhan
psobhan

Reputation: 635

How to bind drop down based on selected text

I have a drop down list as follows:

<select name="ddTblrule" id="ddTblrule" class="controlFont controlWidth">
    <option value="Abc">Abc [ abc ]</option>
    <option value="Abc">Abc [ abc1 ]</option>
    <option value="Abc">Abc [ abc2 ]</option>
    <option value="Abc Associations">abc Associations [ abcas ]</option>
</select>

Since the values of drop down are the same (It should be same, as values are depended on other textbox). I have a grid which contains the selected drop down text in it. when user clicks on edit button I have to show the respective text selected in drop down for which I am using the following code.

 var ruleObj = data.find('td:eq(3)').text();
 $("#ddTblrule option").removeAttr("selected");
 $("#ddTblrule option").filter(function () {
     return this.text == ruleObj;
 }).attr('selected', true);

But the data is not displaying properly in drop down. Please help

Upvotes: 0

Views: 1278

Answers (1)

Ibrahim Khan
Ibrahim Khan

Reputation: 20740

According to your question I think you are looking for something like following.

$('#edit').click(function() {
    var ruleObj = 'Abc [ abc2 ]';
    $("#ddTblrule option").filter(function() {
        return $(this).text() == ruleObj;
    }).prop('selected', true);
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="ddTblrule" id="ddTblrule" class="controlFont controlWidth">
    <option value="Abc">Abc [ abc ]</option>
    <option value="Abc">Abc [ abc1 ]</option>
    <option value="Abc">Abc [ abc2 ]</option>
    <option value="Abc Associations">abc Associations [ abcas ]</option>
</select>

<button id="edit">Edit</button>

Upvotes: 2

Related Questions