javascript - Using ddSlick and selecting an item in the list by value rather than index

Question

I'm using ddSlick to change my drop down menus into prettier ones;

But I have a problem. I rely on programatically changing the selected item in a list, but I must do it by value rather than index. So this is the code to select the list item by index;

$('#demoSetSelected').ddslick('select', {index: 1 });

I can't seem to find any way of doing it in the documentation, thought there may be someone who has come across and solved the issue. Or if anyway knows an alternative plugin that does the same job as ddSlick?

score 1 · Accepted Answer

我遇到了这个问题，解决方法很丑 - 基本上，我必须遍历 ddslick 持有的所有项目，匹配值，然后从那里获取索引。我想我得到了他们演示页面的源代码来帮助我理解示例 3 和 4。我使用示例 3 来帮助我理解如何遍历其所有数据，因此我可以遍历项目，找到匹配的值，然后抓取它的索引。然后示例 4 让我设置下拉项。抱歉，我找不到我测试过的文件。

DdSlick 看起来不错，但最后我选择了MsDropDown。我发现它更健壮 - 它有一个 SetIndexByValue 函数。他们在 github 站点和演示站点上都有详细的文档。

score 1 · Accepted Answer

以编程方式选择 ddslick 下拉菜单非常简单。

在您的 json 数据中传递 selected:true 您需要显示为选中状态

var ddData = [
    {
        text: "Facebook",
        value: 1,
        selected: false,
        description: "Description with Facebook",
        imageSrc: "http://dl.dropbox.com/u/40036711/Images/facebook-icon-32.png"
    },
    {
        text: "Twitter",
        value: 2,
        selected: true,
        description: "Description with Twitter",
        imageSrc: "http://dl.dropbox.com/u/40036711/Images/twitter-icon-32.png"
    }
];

我希望您了解创建 json 数据的地方只是放置条件（例如，如果数据库中的 id 与您为插件创建的数据中的 id 匹配）make selected:true else selected:false 以上代码将默认选择 twitter。

希望这是有道理的。

score 1 · Accepted Answer

我在Github中看到了这个选项：

$('#myDropdown li:has(.dd-option-text:contains("MyValue"))').index();

或者如果文本不等于值：

 $('#myDropdown li:has(input[value="MyValue"])').index();

score 1 · Accepted Answer

丑陋但有效：

            var s = 0;
            var ind;
            $('#your_select .dd-option-value').each(function(i) {
                if ($(this).val() == your_value_to_test) {
                    ind = s;
                    return false;
                }
                s++;
            });

            $('#your_select').ddslick('select', {index: ind });

score 0 · Accepted Answer

您还可以在调用 .ddslick() 之前在格式化下拉列表之前强制选择选项，只需在您的选择中选择一个选项，如下所示

    $("#demoSetSelected  option[value='YOURVALUE']").attr('selected', 'selected');

接着：

    $("#demoSetSelected").dsslick();

javascript - Using ddSlick and selecting an item in the list by value rather than index

5 回答 5

Related

Reference