Question

我正在使用j chosen plugin并喜欢它，但我正在尝试创建一个通用脚本，用于我的应用程序中具有特定类的所有SELECT查询。问题是我正在尝试获取活动选择选择的ID。下面是我的jQuery代码。

$("SELECT.editable").chosen({
    create_option: function (term) {
        var chosen = this;
        chosen.append_option({
            value: term,
            text: term
        });
        var tableField = $(this).attr('id'); // <<<< HERE IS THE ISSUE. I am trying to get the ID of the select to pass to the jQuery post as a paramter. It comes back as undefined.
        alert(tableField);
        var params = { optionValue: term, tableField: tableField };
        var paramsStr = $.param(params);
        var actionUrl = '/Setup/_addDropDownOption';
        $.post(actionUrl, paramsStr);
    },
    persistent_create_option: false,
    create_option_text: 'Add Option'
});

任何帮助都将不胜感激。

这是来自View Source的HTML代码。

<div>
<select class="editable" id="tblContacts.Prefix" name="Prefix">
<option selected="selected" value="Mr.">Mr.</option>
<option value="Ms.">Ms.</option>
<option value="Mrs.">Mrs.</option>
<option value="Mr. and Mrs.">Mr. and Mrs.</option>
<option value="Miss.">Miss.</option>
<option value="Mr. and Dr.">Mr. and Dr.</option>
<option value="Dr. and Mrs.">Dr. and Mrs.</option>
<option value="Dr.">Dr.</option>
</select>
<span class="field-validation-valid" data-valmsg-for="Prefix" data-valmsg-replace="true"></span>
</div>

我创建了jsfiddle，但我不确定我是否做得对。如果我需要做一些不同的事情，请告诉我。

Answer 1

首先，您的选择类应为<select class="chosen-select editable" id="tblContacts.Prefix" name="Prefix"> <option selected value="Mr.">Mr.</option> <option value="Ms.">Ms.</option> <option value="Mrs.">Mrs.</option> <option value="Mr. and Mrs.">Mr. and Mrs.</option> <option value="Miss.">Miss.</option> <option value="Mr. and Dr.">Mr. and Dr.</option> <option value="Dr. and Mrs.">Dr. and Mrs.</option> <option value="Dr.">Dr.</option> </select>。像这样：

jQuery::each

此外，如果您希望迭代一组元素，// create all the chosen-selects $(".chosen-select").chosen(); // iterate over all the .editable selects $('select.editable').each(function() { var chosen = $(this); var selected_option = chosen.find(':selected').val(); var select_id = chosen.attr('id'); alert('The ID you are looking for is "' + select_id + '"'); alert('The selected option is "' + selected_option + '"'); // append element var option = "<option value='whatever_value'>Whatever</option>"; chosen.append(option); // refresh the chosen-select chosen.trigger('chosen:updated'); });会派上用场。所以脚本将是：

$redis = Redis.new(:host => '192.168.56.1', :port => 6379)
=> #<Redis client v3.2.2 for redis://192.168.56.1:6379/0>
$redis.set('a', 'b')
=> "OK"
$redis.get('a')
=> "b"

这里是JSFiddle 确保除了选择的插件外还包含jQuery。

Answer 2

这应该是修改代码的一行以使其工作的简单情况。您正在使用的Chosen jQuery插件的作者对以下修改感到满意，我在遇到类似问题documented here时使用了该修改。

$("SELECT.editable").chosen({
    create_option: function (term) {
        var chosen = this;
        chosen.append_option({
            value: term,
            text: term
        });
        // *** I modified the following line ***
        var tableField = chosen.form_field.id
        // *** End of modification ***
        alert(tableField);
        var params = { optionValue: term, tableField: tableField };
        var paramsStr = $.param(params);
        var actionUrl = '/Setup/_addDropDownOption';
        $.post(actionUrl, paramsStr);
    },
    persistent_create_option: false,
    create_option_text: 'Add Option'
});

用于选择下拉菜单的jQuery“选择”插件 - 获取ID

2 个答案: