CODEWITHSUNDEEP
jqueryajaxbootstrap-multiselect
Tamar E. Granor
Tamar E. Granor

Reputation: 3937

Bootstrap multiselect radio button has multiple options selected

I'm using the Bootstrap Multiselect control for a number of options on a page, and for uniformity, using it for both the items where multiple selections are accepted and for those where only a single item is accepted (radio buttons). After the user completes one entry and saves it, this section of the page is temporarily hidden and a different section shown(though I don't think that's relevant.) After a button click, this section is shown again and the multiselect controls are supposed to update to show the new data. (This is happening in AJAX code.)

The problem is that while the correct option for the radio buttons shows when the control is closed, when you drop it open, both that item and the first item on the list are selected. In fact, after several rounds of this, it's possible to have more than two of the buttons selected.

I've tried several variations of code to reset things properly. Here's the HTML/PHP code that generates one of these radio-button style controls:

    <div class="form-group">
        <label class="control-form-label col-md-offset-1 col-md-1" for="urgency">When</label>
        <div class="col-md-9">
            <select id="urgency" required>
            <?php
            $urgency = getdata("GetActionUrgencies", "", "Couldn't retrieve list of urgency.<br/>");
            while ($obj = mysqli_fetch_object( $urgency)) {
                echo "<option value='".$obj->UrgencyDesc."' id='".$obj->iID."'>".$obj->UrgencyDesc."</option>";
            }
            ?>
            </select>
        </div>
    </div>

And here's the javascript I'm using in the AJAX success method to update it:

$('#urgency').multiselect('deselectAll',false);         
$('#urgency').multiselect('select', obj.UrgencyDesc);

I've also tried calling multiselect('refresh') after this code, but it doesn't change anything.

Any ideas?

Upvotes: 0

Views: 1333

Answers (2)

Basia
Basia

Reputation: 11

I had a similar problem and I used:

$('#yourSelect').val([]).multiselect('refresh');

It did the trick for me.

Upvotes: 1

Alyssa Muu
Alyssa Muu

Reputation: 131

From Bootstrap-Multiselect docs: "Currently, it is required to call .multiselect('updateButtonText') manually after calling .multiselect('selectAll', justVisible)."

Have you tried this?

Upvotes: 0

Related Questions