Question

I have a combobox that I disable when user clicks on checkbox with this:

$(this).parent().next('td').children('.xyz').attr("disabled", true);

I would also like to reset the same combobox to display the first value on the list, using this:

$(this).parent().next('td').children('.xyz option:first-child').attr("selected", "selected");

Unfortunately, this does not seem to work, what am I doing wrong?

Answer 1

Selection with JavaScript is a bit different. It’ll be easier to use this plugin, from this discussion:

/**
 * Select/deselect any matching checkboxes, radio buttons or option elements.
 */
$.fn.selected = function(select) {
    if (select == undefined) select = true;
    return this.each(function() {
        var t = this.type;
        if (t == 'checkbox' || t == 'radio')
            this.checked = select;
        else if (this.tagName.toLowerCase() == 'option') {
            var $sel = $(this).parent('select');
            if (select && $sel[0] && $sel[0].type == 'select-one') {
                // deselect all other options
                $sel.find('option').selected(false);
            }
            this.selected = select;
        }
    });
};

and

$(this).parent().next('td').children('.xyz option:first-child').selected(true);