Chained or Dependent 选择 Zend_Form jQuery 来移除或替换表单元素？答案

【问题标题】：Chained or Dependent Select Zend_Form jQuery to remove or replace the form elements?Chained or Dependent 选择 Zend_Form jQuery 来移除或替换表单元素？
【发布时间】：2013-11-28 07:58:19
【问题描述】：

我一直在使用 Zend Framework 1 创建一个依赖/链接的 Zend_Form。

当Zend_Form_element_Select 另一个 Zend_Form_Element_Select 被添加到表单时，其正确字段取决于第一个选择的值。

所以我添加了新的 Select ：

$("#city-label").before(data);

这将在城市标签之前插入新的选择。

再次更改第一个选择的值时会出现问题。然后一个新的 Select 被添加到表单中。理想情况下，我希望旧的 satellite element 是标签和要删除的选择。

<dt id="satellite-label">
<label for="satellite" class="optional">Satelite</label>
</dt>
<dd class="ui-select">
<select name="satellite" id="satellite">
    <option value="--Select One--" label="--Select One--">--Select One--</option>
    <option value="5" label="Alex">Alex</option>
    <option value="6" label="Patro">patro</option>
    <option value="7" label="Zozo ">Zozo</option>
</select></dd>
<dt id="city-label"><label for="city" class="optional">City</label></dt>

然后用新元素替换。

【问题讨论】：

标签： javascript jquery zend-framework

【解决方案1】：

在您的 AJAX 中尝试此操作成功：

$("#satellite-label").remove();
$("#satellite").parent().remove();

【讨论】：

【解决方案2】：

您应该跟踪新元素，以便在值再次更改时将其删除：

var currentLabel;

...

if (currentLabel) {
    currentLabel.remove();
}
currentLabel = $(data);
$("#city-label").before(currentLabel);

【讨论】：

【解决方案3】：

试试这个...

$("#satellite_elem-label").remove();
$("#satellite_elem").parent().remove();;
$("#city-label").before(newElement);

【讨论】：

这是一种合法的方式，看似最优雅，但答案是前两个答案的组合。

【解决方案4】：

您可以使用隐藏输入 (Zend_Form_Element_Hidden)，然后简单地替换隐藏元素。

$("#target-element").html(data);

不要忘记在 data 的 html 内容上使用相同的 id (target-element)。

这样您还可以将后端验证器添加到此隐藏元素以使用isValid 方法。

【讨论】：

【解决方案5】：

您必须先删除先前插入的选择，然后再插入另一个选择，然后再次更改第一个选择的值。

所以它可能对你的情况有所帮助。

$("#city-label").prev('.ui-select').remove();
$("#city-label").prev('#satellite-label').remove();
$("#city-label").before(data);

或者简单地添加这个

$("#city-label").prev().remove();
$("#city-label").prev().remove();
$("#city-label").before(data);

它将删除选择然后标签并在插入新选择之前插入新选择。

【讨论】：