点击按钮后动态添加表单域

时间：2015-06-20 作者：HalfWebDev

我期待着创建一个按钮点击点击表单部分。假设我想添加一个新的卖家代理信息部分，次数与我想单击+按钮的次数相同。卖方代理信息部分应包含基本文本、下拉列表等。

因此，这些新创建的条目应该存储在数据库中。我还需要稍后将条目导出为CSV。

虽然我使用WordPress作为平台，但我不介意其他PHP/AJAX解决方案添加此功能。

我找不到任何完美的匹配，强大的表单与此非常接近，但单击按钮添加新内容会将我引导到单独的页面。其他插件不提供这样做的可能性。

您可以建议任何免费或付费的第三方表单生成器、wordpress插件或示例代码来帮助我实现这一点，以防我遗漏任何内容。

我已经分享了要编码的表单截图！！

Dynamic form example

1 个回复
SO网友:Marina Dunst

通过创建新的DOM元素，可以使用Javascript实现这一点。

你可以用这个Try it yourself functionality from W3Schools

将此代码复制并粘贴到“自己尝试”中，看看它是如何工作的，它只是添加了一个新段落：

<!DOCTYPE html>
<html>
<body>

<div id="div1">
<p id="p1">This is a paragraph.</p>
<p id="p2">This is another paragraph.</p>
<p><input type="button" value="Add Paragraph" onclick="addPara();"></p>
</div>

<script>
function addPara()
{
var para = document.createElement("p");
var node = document.createTextNode("This is new.");
para.appendChild(node);
var element = document.getElementById("div1");
element.appendChild(para);
}
</script>

</body>
</html>
现在，看看this post in SO to see how to add a form.

抱歉，我错过了数据库部分。您需要创建一个php页面来处理数据处理和存储在db中。我再次使用的是W3schools自己尝试的功能（但一般来说，该网站在更严肃和专业的编程信息上是不可信的）is the link with an example how to send data from a form to php.

这是一种方法，它会刷新页面。我最喜欢的方法是使用Javascript收集数据，然后使用AJAX调用将其发送到php页面。Here is the link to ajax with php.

这是guide on working with database tables in WP, 我想您可以在php页面中使用这些函数来处理数据操作。

结束
标签： plugins   forms   小码农  

相关推荐

JQuery Plugins in Wordpress

我已经能够在某种程度上拼凑出应该如何做到这一点，但我真的很难做到这一点。我想使用Table Sorter插件(http://tablesorter.com) 在自定义页面模板中显示数据，但我不确定它是否正确。我已经钩住了“wp\\u enqueue\\u scripts”，并使用此函数将表分类器JS文件排入队列。我相信这是正确的，但是我还需要在JQuery Ready（）函数中放置一行，但是我不确定如何从自定义页面模板中执行此操作。有人能解释一下吗？<?php /* Templat