Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > JavaScript: Применение библиотек > [jquery] выбрать select кнопочкой

Автор: bars80080 6.4.2011, 17:19

задача простая: есть select, а есть набор кнопок.

при нажатии на кнопку, хочу чтобы в select'е выбрался нужный option

эти методы:

Код


$('selname').eq(0).val(v);

или

Код


    $('selname').eq(0).find('option').each(function() {
        if(this.value == v) { $(this).attr('selected', 'yes'); }
        else { $(this).attr('selected', ''); }
    });

почему-то не меняют выбранный элемент в селекте

Автор: нуп 6.4.2011, 17:32

А хтмл покажите.

Автор: bars80080 6.4.2011, 17:50

да, не ладно что-то в датском королевстве.

свёл код к простому примеру - работает, а в оригинале - нет.

там примерно такой механизм:
в форме изначально присутствует select.

Код


                <div>
                    <p class="pag"><select name="qwqw" >
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>

<option value="4" >4</option>
<option value="5" >5</option>
<option value="6" >6</option>
</select></p>
                </div>

по загрузке страницы я дополняю его снизу кнопочками:

resetselbox('qwqw');

Код


function resetselbox(n) {
    var selname = 'select[name="'+ n +'"]';
    var pag = $(selname).eq(0).parent();
    var w30 = $(pag).eq(0).parent();
    var i = 0;
    $(w30).eq(0).find('.pag').each(function() {
        if(i == 0) { $(this).css('display', 'none'); }
        else { $(this).empty(); }
        i++;
    });
    var t = '';
    $(selname).eq(0).find('option').each(function() {
        if(this.selected) { t += '<span>'+ this.value +'</span>'; }
        else { t += '<a href="javascript:void(0);" onclick="changeselopt(\''+ n +'\', '+ this.value +')">'+ this.value +'</a>'; }
    });
    $(w30).eq(0).html($(w30).eq(0).html() + '<p class="pag">'+ t +'</p>');
}

select скрывается, а заместо него ряд кнопочек - ссылок
при нажатии, они изменяют значение, причём в качестве хранителя значения я использую тот же select:

Код


function changeselopt(n, v) {
    var selname = 'select[name="'+ n +'"]';alert(v);
    //$(selname).eq(0).val(v);
    //$(selname).eq(0).find('option:eq('+ v +')').eq(0).attr('selected', 'yes');
    $(selname).eq(0).find('option').each(function() {
        if(this.value == v) { this.selected = true; }
        else { /*$(this).attr('selected', '');*/ }
    });
    resetselbox(n);
}

так как кнопочки перещёлкиваются, значит значение сохраняется в select, однако, по нему это не видно. и если отправить форму, то на сервер придёт изначальное значение, а не то, которое мы нащёлкали

видимо, где-то получается не стыковка

Автор: нуп 6.4.2011, 18:14

Цитата(bars80080 @ 6.4.2011, 17:50

)

$(w30).eq(0).html($(w30).eq(0).html() + '<p class="pag">'+ t +'</p>');

Вот здесь затирает, и селект сбрасывается. Такую байду я написал, должно помочь

Код


        function changeselopt(n, v) {
        var selname = 'select[name="'+ n +'"]';
        $(selname).val(v);
        var options = '';
        $(selname + ' option').each(function()
        {
            var selected = ($(this).attr('selected')) ? 'selected' : '';
            options += '<option value="' + $(this).val() + '" ' + selected + '>' + $(this).text() + '</option>';
        });
        $(selname).empty().html(options);
        resetselbox(n);
    }

Автор: bars80080 7.4.2011, 09:44

дас ист гуд, работает отлично

как всегда вечером плохо соображаю