使用嵌套表单

时间:2018-05-15 16:48:25

标签: javascript jquery sheepit

我在这里使用演示:http://www.mdelrosso.com/sheepit/index.php?lng=en_GB&sec=demo3

但是如果您有两个外部表单(地址)和两个内部表单(数字)并检查元素,您会注意到输入的名称仍然具有#index#和/或{ {1}}索引名称中的字符串。

如果您尝试提交表单,则字段数据将丢失(因为只保留该名称的最新副本)。我已经尝试调试JavaScript,所以我可以修补它,但我没有看到它的错误。似乎#index_phone#函数没有正确处理嵌套。

如何更正代码以使索引按预期执行? (即:输入两个地址(A和B),每个地址有两个电话号码(A1,A2和B1,B2),给我一个POSTed值,如:

normalizeForms

(注意:我不是在寻找那种确切的格式;我可以解析任何输出,我只需要将所有数据从客户端获取到具有有意义索引且没有冲突的服务器。)

1 个答案:

答案 0 :(得分:1)

当涉及到嵌套输入时,此插件的索引“规范化”方面似乎存在一些基本的逻辑问题。

基本上有nametemplateidtemplate只有%index%%index_phones%的元素名称,其中索引应该是,{{1只有nameid替换为实际的元素输入ID时才应该是这些模板。

“规范化”过程中发生的事情是函数在这些模板上运行(每个表单每个元素一次),并根据表单替换 %index%或{{ 1}}与相关索引,取决于正在处理的表单。

当输入嵌套时会出现问题,因为函数首先用例如%index_phones%替换(例如)%index%。然后,它会使用此值更新结果%index_phones%%index%,例如0。当它到达嵌套表单时,它再次执行相同的操作,仅使用name。结果现在为id,因为它仍然使用未修改的模板属性,而不是已经半修改过的person_addresses_0_phones_%index_phones%_phone

为了正确解决这个问题,插件整个部分的逻辑真的需要重建,但是我已经把一个快速补丁打了个电影,这个补丁应该作为临时修复。

在主插件文件中,将%index_phones%函数更新为:

person_addresses_%index%_phones_0_phone

然后更新name功能。在未经修改的插件文件中的normalizeFieldsForForm行附近,添加行

    function normalizeFieldsForForm(form, index)
    {
        form.find(formFields).each(function(){
            var that = $(this)
                ,idTemplateAttr = getOrSetTemplate(that,"id")
                ,nameTemplateAttr = getOrSetTemplate(that, "name")
                ,idAttr = that.attr("id")
                ,nameAttr = that.attr("name")
                ,formParents = that.parents('[idtemplate]')

            /* Normalize field name attributes */
            var newNameAttr = nameTemplateAttr.replace(options.indexFormat, index);

            /* Normalize field id attributes */
            var newIdAttr = idTemplateAttr.replace(options.indexFormat, index);

            $.each(formParents,function(index,element){
                $element = $(element);
                if($element.data('indexFormat') != options.indexFormat){
                    /* Normalize field name attributes */
                    newNameAttr = newNameAttr.replace($element.data('indexFormat'), $element.data('formIndex'))

                    /* Normalize field id attributes */
                    newIdAttr = newIdAttr.replace($element.data('indexFormat'), $element.data('formIndex'))
                }
            });

            form.find("label[for='"+idAttr+"']").each(function(){
                $(this).attr("for", newIdAttr);
            });

            that.attr("id", newIdAttr);
            that.attr("name", newNameAttr);
        });
    }

以上

addForm

这应该作为一个修复,直到插件作者解决修复逻辑问题。这适用于插件版本385