Magento 2表单中InsertListing选中值无法随表单提交问题

AI 小北

2026-8-5

问题：Magento 2模态框勾选客户后数据未随表单提交

问题场景与现象

后台UI表单点击「选择客户」按钮弹出客户列表模态框，预期勾选客户后，客户ID随父表单一同提交，但提交后POST数据中无选中客户的ID信息。示例POST数据如下：

Array
(
    [name] => Tesy
    [ready_to_send] => false
    [message] => test
    [form_key] => bJBYSJKVwlJVVQmA
)

对应的模态框与表单配置XML：

<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
    <argument name="data" xsi:type="array">
        <item name="js_config" xsi:type="array">
            <item name="provider" xsi:type="string">
                pillbox_textmessaging_campaigns_add_form.campaigns_add_form_data_source
            </item>
            <item name="deps" xsi:type="string">
                pillbox_textmessaging_campaigns_add_form.campaigns_add_form_data_source
            </item>
        </item>
        <item name="label" xsi:type="string" translate="true">Add New Campaign</item>
        <item name="config" xsi:type="array">
            <item name="dataScope" xsi:type="string">data</item>
            <item name="namespace" xsi:type="string">pillbox_textmessaging_campaigns_add_form</item>
        </item>
        <item name="template" xsi:type="string">templates/form/collapsible</item>
        <item name="buttons" xsi:type="array">
            <item name="save" xsi:type="string">Pillbox\TextMessaging\Block\Adminhtml\Campaigns\Buttons\Save</item>

        </item>
    </argument>
    <dataSource name="campaigns_add_form_data_source">
        <argument name="dataProvider" xsi:type="configurableObject">
            <argument name="class" xsi:type="string">Pillbox\TextMessaging\Model\Campaigns\FormDataProvider</argument>
            <argument name="name" xsi:type="string">campaigns_add_form_data_source</argument>
            <argument name="primaryFieldName" xsi:type="string">id</argument>
            <argument name="requestFieldName" xsi:type="string">id</argument>
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="submit_url" xsi:type="url" path="*/*/save"/>
                </item>
            </argument>
        </argument>
        <argument name="data" xsi:type="array">
            <item name="js_config" xsi:type="array">
                <item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
            </item>
        </argument>
    </dataSource>
    <modal name="customers_modal">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">

                <item name="onCancel" xsi:type="string">
                    actionDone
                </item>
                <item name="options" xsi:type="array">
                    <item name="title" xsi:type="string">
                        All Customers
                    </item>
                    <item name="buttons" xsi:type="array">
                        <item name="0" xsi:type="array">
                            <item name="text" xsi:type="string">
                                Selected
                            </item>
                            <item name="class" xsi:type="string">
                                action-primary
                            </item>
                            <item name="actions" xsi:type="array">
                                <item name="0" xsi:type="array">
                                    <item name="targetName" xsi:type="string">
                                        index = customer_listing
                                    </item>
                                    <item name="actionName" xsi:type="string">save</item>
                                </item>
                                <item name="1" xsi:type="string">
                                    closeModal
                                </item>
                            </item>
                        </item>
                    </item>
                </item>
            </item>
        </argument>
        <insertListing name="customer_listing">
            <settings>
                <dataLinks>
                    <exports>false</exports>
                    <imports>true</imports>
                </dataLinks>
                <autoRender>true</autoRender>
                <selectionsProvider>
                    customer_listing.customer_listing.columns.ids
                </selectionsProvider>
                <dataScope>customer_listing</dataScope>
                <ns>customer_listing</ns>
            </settings>
        </insertListing>
    </modal>
    <fieldset name="campaign_information">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="collapsible" xsi:type="boolean">false</item>
                <item name="label" xsi:type="string" translate="true">Campaign Information</item>
                <item name="sortOrder" xsi:type="number">10</item>
            </item>
        </argument>

        <button name="customers_button"
                component="Magento_Ui/js/form/components/button">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="label" xsi:type="string" translate="true">
                        Select Customers
                    </item>
                    <item name="title" xsi:type="string" translate="true">
                        Customers
                    </item>
                    <item name="displayAsLink" xsi:type="boolean">true</item>
                    <item name="labelVisible" xsi:type="boolean">true</item>
                    <item name="template" xsi:type="string">
                        ui/form/components/button/container
                    </item>
                    <item name="actions" xsi:type="array">
                        <item name="0" xsi:type="array">
                            <item name="targetName" xsi:type="string">
                                pillbox_textmessaging_campaigns_add_form.pillbox_textmessaging_campaigns_add_form.customers_modal
                            </item>
                            <item name="actionName" xsi:type="string">
                                toggleModal
                            </item>
                        </item>
                    </item>
                </item>
            </argument>
        </button>
        <field name="name">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="dataType" xsi:type="string">text</item>
                    <item name="label" xsi:type="string" translate="true">Campaign Name</item>
                    <item name="formElement" xsi:type="string">input</item>
                    <item name="sortOrder" xsi:type="number">10</item>
                    <item name="validation" xsi:type="array">
                        <item name="required-entry" xsi:type="boolean">true</item>
                    </item>
                </item>
            </argument>

        </field>
        <field name="message">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="dataType" xsi:type="string">text</item>
                    <item name="label" xsi:type="string" translate="true">Message Content</item>
                    <item name="formElement" xsi:type="string">textarea</item>
                    <item name="sortOrder" xsi:type="number">20</item>
                    <item name="validation" xsi:type="array">
                        <item name="required-entry" xsi:type="boolean">true</item>
                    </item>
                </item>
            </argument>
        </field>
        <htmlContent name="sms_count_html_content">
            <argument name="block" xsi:type="object">
                Pillbox\TextMessaging\Block\Adminhtml\Shared\HtmlContent\TextFormCountHtml
            </argument>
        </htmlContent>
        <field name="ready_to_send" formElement="checkbox">
            <settings>
                <label translate="true">Ready To Send?</label>
                <tooltip>
                    <description translate="true">Check the box if you would like to send the campaign immediately.
                    </description>
                </tooltip>
            </settings>
            <formElements>
                <checkbox>
                    <settings>
                        <prefer>toggle</prefer>
                        <valueMap>
                            <map name="false" xsi:type="boolean">false</map>
                            <map name="true" xsi:type="boolean">true</map>
                        </valueMap>
                    </settings>
                </checkbox>
            </formElements>
        </field>
    </fieldset>
</form>

原因分析

insertListing的dataLinks中exports设为false，导致选中的客户数据无法同步到父表单的数据源
父表单缺少用于存储选中客户ID的字段，无承载数据的容器，提交时自然不会包含该数据
模态框「Selected」按钮的save动作目标指向错误，未关联到父表单的数据源，无法将选中数据写入父表单

解决方案

1. 添加隐藏字段存储选中客户ID

在campaign_information字段集中添加隐藏字段，用于承载选中的客户ID数组：

<field name="selected_customers" formElement="input">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="dataType" xsi:type="string">text</item>
            <item name="formElement" xsi:type="string">hidden</item>
            <item name="dataScope" xsi:type="string">selected_customers</item>
        </item>
    </argument>
</field>

2. 修改`insertListing`配置开启数据导出

调整insertListing的dataLinks和添加exports配置，将选中的ID同步到父表单的隐藏字段：

<insertListing name="customer_listing">
    <settings>
        <dataLinks>
            <exports>true</exports>
            <imports>true</imports>
        </dataLinks>
        <autoRender>true</autoRender>
        <selectionsProvider>customer_listing.customer_listing.columns.ids</selectionsProvider>
        <dataScope>customer_listing</dataScope>
        <ns>customer_listing</ns>
        <!-- 配置导出规则，将选中项同步到父表单的selected_customers字段 -->
        <exports>
            <link name="selected">${ $.provider }:data.selected_customers</link>
        </exports>
    </settings>
</insertListing>

3. 修正模态框按钮的动作目标

将「Selected」按钮的save动作目标改为父表单的数据源，确保数据正确写入：

<item name="0" xsi:type="array">
    <item name="text" xsi:type="string">Selected</item>
    <item name="class" xsi:type="string">action-primary</item>
    <item name="actions" xsi:type="array">
        <item name="0" xsi:type="array">
            <item name="targetName" xsi:type="string">pillbox_textmessaging_campaigns_add_form.campaigns_add_form_data_source</item>
            <item name="actionName" xsi:type="string">save</item>
        </item>
        <item name="1" xsi:type="string">closeModal</item>
    </item>
</item>

4. 初始化表单数据中的选中字段

在表单的FormDataProvider类的getData()方法中初始化selected_customers字段，避免数据加载时缺失：

public function getData()
{
    $data = parent::getData();
    // 初始化选中客户字段，确保字段存在
    if (!isset($data['selected_customers'])) {
        $data['selected_customers'] = [];
    }
    return $data;
}

完成以上修改后，提交表单时POST数据将包含selected_customers字段，值为选中的客户ID数组。

内容的提问来源于stack exchange，提问作者noname

Magento 2表单中InsertListing选中值无法随表单提交问题

问题场景与现象 #

原因分析 #

解决方案 #

1. 添加隐藏字段存储选中客户ID #

2. 修改insertListing配置开启数据导出 #

3. 修正模态框按钮的动作目标 #

4. 初始化表单数据中的选中字段 #