开发者

JQuery plugin for progressive enhancement of select drop-downs to muli-column display

开发者 https://www.devze.com 2022-12-24 02:50 出处:网络
Any开发者_运维知识库one know of a jquery plugin that can convert the contents of a select drop-down list to a multi-column panel? Ideally, I would want to also support option groups, so that all the i

Any开发者_运维知识库one know of a jquery plugin that can convert the contents of a select drop-down list to a multi-column panel? Ideally, I would want to also support option groups, so that all the items in a group would stay together in a single column. Here is an example of what I mean:

JQuery plugin for progressive enhancement of select drop-downs to muli-column display


Well I don't know of a plugin that does that and in fact I've never seen that behavior before (your link is broken at the time of this answer).

But I don't think it would be that hard using a modal dialog of some kind (there's one that comes with the jQuery UI). With that you could do something like:

<div id="#yearList">
    <a href="1990">1990</a>
    <a href="1991">1991</a>
    <a href="1992">1992</a>
</div>

<select id="#yearSelect">
    <option value="choose">Choose Year</option>
    <option value="1990">1990</option>
    <option value="1991">1991</option>
    <option value="1992">1992</option>
</select>

$('#yearList').dialog();

$('#yearSelect').change(function() {
    if ($(this).val() == 'choose') {
        $('#yearList').dialog('open');
    }
});

$('#yearList a').live('click', function(e) {
     e.preventDefault();
     $('#yearSelect').val($(this).text());
     $('#yearList').dialog('close');
});

Obviously in a real world scenario you would load the dialog links and select options dynamically which is why I made the click event based on live.

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号