使用 JQuery 更新 Select 选项时缺少帖子数据

Posted 2023-05-09

【中文标题】使用 JQuery 更新 Select 选项时缺少帖子数据

【英文标题】：Missing post data when updating Select options with JQuery

【发布时间】：2015-12-16 19:31:46

【问题描述】：

我在一个表单中有两个选择：

input_licensee_list：充满了可能的选项（使用 Ajax 调用） output_licensee_list：获取用户的选择。

当我发布表单时，我会在output_licensee_list 中获得列表。

为此，我添加了两个按钮：添加（将所选选项从输入移动到输出）和全部添加（将所有选项从输入移动到输出）。

// Add all button: remove all entries from input list and add them to output list
add_all_button.on('click', function (e) 
    var options = input_licensee_list.find("option").remove();
    options.append(' (' + group_selection.find("option:selected").text() + ')');
    options.appendTo(output_licensee_list);
    output_licensee_list.trigger('change');
    input_licensee_list.trigger('change');
);

// Add button: remove selected entries from input list and add them to output list
add_button.on('click', function (e) 
    var options = input_licensee_list.find("option:selected").remove();
    options.append(' (' + group_selection.find("option:selected").text() + ')');
    options.appendTo(output_licensee_list);
    output_licensee_list.trigger('change');
    input_licensee_list.trigger('change');
);

我已经准备了一个 JSFiddle 来展示它：

https://jsfiddle.net/zaun8qgp/4/

JQuery 代码本身似乎工作正常，如果我使用“添加”按钮（即使我选择所有选项），表单也会正确发布。

但是由于某种原因，如果我使用“全部添加”按钮：

输入output_licensee_list根本没有出现在POST中，所以我没有从中得到任何信息； 如果我使用“添加”，然后使用“全部添加”，如果我最初添加的列表（在全部添加之前），我在帖子中获得的信息。

如果有人知道它为什么不能正常工作，或者我可以如何调试更多，我将不胜感激！

【参考方案1】：

您的问题是提交包含 <select> 的 from 仅提交选定的选项。您在“全部添加”中添加的选项未被选中。

解决此问题的最简单方法是添加：

options.prop('selected', 'true');

给你表单提交事件处理程序，以确保在提交之前选择所有选项。