jquery form上的表单元素重复提交

我动态地将SELECT元素添加到表单中，然后使用JQuery表单插件提交ajax表单提交。我想（1）将SELECT添加到表单中，（2）将SELECT放入DIV中，（3）使用ajax调用正确提交表单。我似乎无法做到这三件事！jquery form上的表单元素重复提交

<form name="mainForm" id="mainForm" method="POST" action="fellowRight.php"> 
    ...various working form elements 

<div class="field_wrapper"> 
    </div> 

    </form>

上面的代码是使用中的窗体的代码片段。我再加入一些额外的选择元素动态地按照下文

$(addFormElementButton).click(function(){ 
    var fieldHTML = '<select required name="ABC" ><option value="LT">Left</option><option selected value="RT">Right</option></select>';   
    $('.field_wrapper'); .append(fieldHTML); // Add field html 
    $('select[name=ABC]').appendTo('#mainForm'); 
    }

的问题是，元素“appendto”的形式，而不是作为intented在div“.field_wrapper”（并因此出现预期的DIV之外）。如果我省略了appendTo，但是select不再链接到表单，我可以正确地设置它的格式。

如果我省略了AppendTo代码，而是在<select>元素中添加了form="mainForm"调用，则它会正确格式并正确提交。然而，然后我通过JQUERY FORM（.ajaxForm）提交的表单数据中重复了这个特定的SELECT元素。

有没有办法不使用appendTo或form= SELECT元素链接到窗体或我应该忘了使用jQuery形式

来源

2016-05-22 kidnim

'$（'。field_wrapper'）; .append（fieldHTML）;'我认为这是不正确的语法 –

只是在这里输入错误，语法在真正的代码中是正确的，thx – kidnim

只需插入select内.field_wrapper，它已经在表单内。

您可能还希望取消addFormElementButton上的点击事件，因为如果它是button，它可能会自动提交表单。

$(addFormElementButton).click(function(e) { 
    e.preventDefault(); 
    var fieldHTML = '<select required name="ABC" ><option value="LT">Left</option><option selected value="RT">Right</option></select>';   
    $('.field_wrapper').append(fieldHTML); //<-there was a typo here 
});

来源

2016-05-22 06:33:54 Gabriel

错误在真正的代码中是正确的。不幸的是，如果我不附加形式或添加名称='mainform'，尽管在窗体和/窗体标签内，数据不会POST – kidnim

好吧，那么你将不得不发布你如何发送表单。张贴ajax呼叫部分。 – Gabriel

jquery form上的表单元素重复提交

回答

相关问题