CODEWITHSUNDEEP
jquerycss-selectors
sanders
sanders

Reputation: 10898

Remove a class select option is not selected

When i select something from a selectbox it adds a class to the

selected option this way:

$(
    'div#tabs input[type="text"],
    select option:selected,
    input:checked,
    textarea'
).addClass('takethis');

But when I select a different option it doesn't remove the class takethis from the option which I first selected. How can I force this?

Upvotes: 4

Views: 11622

Answers (3)

Paolo Bergantino
Paolo Bergantino

Reputation: 488454

You could use removeClass like this:

$('#tabs').find('option').removeClass('takethis');

I am not sure what you are trying to do, though. This code:

$('div#tabs input[type="text"],
            select option:selected,
            input:checked,
            textarea').addClass('takethis');

Is grabbing all text fields, the selected option of all selects, all checked fields, and all textareas and adding the class takethis to it. Is that what you want to do?

EDIT I see what you're trying to do. If that is the case, why not just do this?

var table = $('<table>');
$('div#tabs :input').each(function() {
    var val = $.trim($(this).val());
    var name = $(this).attr('name');
    if(val) {
        var td1 = $('<td>').html(name);
        var td2 = $('<td>').html(val);
        $('<input>').attr({
            type: 'hidden',
            name: name
        }).appendTo(td2);
        $('<tr>').append(td1).append(td2).appendTo(table);
    }
});
$('#4tab').append(table);

Wouldn't this be simpler or am I missing a requirement here?

Upvotes: 3

Seb
Seb

Reputation: 25147

Remove class from all non-selected options:

$("select option:not(:selected)").removeClass("takethis");

Then add to selected one:

$("select option:selected").addClass("takethis");

Upvotes: 13

Andrew Hare
Andrew Hare

Reputation: 351536

You need to call removeClass on the previously selected item.

Upvotes: 2

Related Questions