Joomla！组件表单和jQuery来动态添加/删除字段的子集

Joomla! component form and jQuery to add/remove subset of fields dynamically

本文关键字：添加 删除 字段 子集 动态 组件 表单 jQuery Joomla      更新时间：2023-09-26

我有一个用于管理车间的Joomla组件，称为com_workshops及其相应的表jos_workshops。

然后我有了核心的com_users组件及其jos_users表。

我有一个链接表jos_works_users，用于将用户与车间（N，N）关联起来。

我知道如何添加一个表单字段type="user"，这样我就可以从用户模式视图中选择一个用户。

但我希望表单能够添加与一样多的表单字段类型

想要，并动态删除它们。我在考虑

jQuery (append(), clone(), remove() functions)

但不知道在Joomla里面是否可能！表单，以及如何执行。

我制作了一个类似的字段，尽管我使用了mootools。如果我是你，我会创建一个新的字段类型（Joomla-docs），并使用JHTML:：script（）向页面添加一些javascript。您需要使用像jform[userids][]这样的输入名称，以便浏览器可以传递一个用户id数组。

我的案子和你的不完全一样，但我就是这样做的：

我的HTML是这样的（注意每行有两个文本字段）：

<div id="ingredientList1">
    <div class="ingredient-row">
        <div class="delete"></div>
        <input type="text" class="amountField" style="display: block; " name="jform[ingredientAmounts][]">
        <input type="text" class="nameField" style="display: block; " name="jform[ingredients][]">
    </div>
    <div class="ingredient-row">
        <div class="delete"></div>
        <input type="text" class="amountField" style="display: block; " name="jform[ingredientAmounts][]">
        <input type="text" class="nameField" style="display: block; " name="jform[ingredients][]">
    </div>
    <div class="ingredient-row">
        <div class="add"></div>
        <input type="text" class="amountField" style="display: none; ">
        <input type="text" class="nameField" style="display: none; ">
    </div>
</div>

您的javascript应该：

  1. 当用户单击删除按钮时，删除一行（在mootools:row.dispose（）中）
  2. 使最后一行可见，并在单击添加按钮时创建一个新的隐藏行
  3. 有一个方法可以从数据库加载以前的数据
  4. 在加载（选择用户id）和存储（将它们保存到数据库）时，将代码添加到表中
相关文章：