Search code examples
jquerycssdisabled-input

Disable sibling element when one is select where select name are same but value is different


My website has four html select with same select name and different values.

<td>
    <select name="bali" disabled>
        <?php
            $query="select * from bali_intro";
            $result=$con->query($query) or die($con->error);
            while($row=$result->fetch_assoc()){
            $heading=$row['heading'];
        ?>
        <option value="<?php echo $heading?>"><?php echo $heading?></option>
        <?php } ?>
    </select>
</td>

<td>
    <select name="bali" disabled>
        <?php
            $query="select * from veg_intro";
            $result=$con->query($query) or die($con->error);
            while($row=$result->fetch_assoc()){
            $heading=$row['heading'];
        ?>
        <option value="<?php echo $heading?>"><?php echo $heading?></option>
        <?php } ?>
    </select>
</td>

<td>
    <select name="bali" disabled>
        <?php
            $query="select * from fruit_intro";
            $result=$con->query($query) or die($con->error);
            while($row=$result->fetch_assoc()){
            $heading=$row['heading'];
        ?>
        <option value="<?php echo $heading?>"><?php echo $heading?></option>
        <?php } ?>
    </select>
</td>

<td>
    <select name="bali" disabled>
        <?php
            $query="select * from pasu_intro";
            $result=$con->query($query) or die($con->error);
            while($row=$result->fetch_assoc()){
            $heading=$row['heading'];
        ?>
        <option value="<?php echo $heading?>"><?php echo $heading?></option>
        <?php } ?>
    </select>
</td>

I want to disable sibling select element when one is selected. I use following code for this issue

$('select[name="bali"]').click(function(){
    $(this).removeAttr('disabled').siblings().attr('disabled','disabled');
});

But it doesn't work. What is appropriate jquery function to this problem ?


Solution

  • Remove the default disabled attribute added in html,it wont fire click event. Most probably it will solve your problem.