从动态创建的字段中获取值,并通过Ajax

时间:2016-08-28 23:42:32

标签: php jquery mysql ajax

我的网页包含文字字段Field name和两个按钮(Insert field, Show fields)

用户在第一个文本字段内插入一个值,该值将成为新字段的名称。当他点击Insert field时,该值将发送到我的数据库并插入名为TBL_FIELDS的表中。

当用户点击Show fields时,该页面会加载TBL_FIELDS中的所有字段名称,并使用包含已加载名称的占位符创建 N 文本字段。

这些字段显示在包含另一个按钮.fieldList的{​​{1}} div内部,当用户点击它时,我希望从这些动态创建的字段及其占位符中获取所有值并将它们插入另一个名为Insert values的数据库表中,该表有三列,TBL_VALUESID代表字段的名称(占位符),FIELD_NAME代表该领域的价值。

所以我的问题是,如何从所有这些动态创建的字段中获取值和占位符,并通过Ajax将它们发送到我的.php文件?我知道我可以使用FIELD_VALUE来获取它的值,.val()来获取占位符,但这不是我的观点,我的问题是我不知道会有多少个字段,也不知道我怎么能使用.attr('placeholder')访问他们。

这是我到目前为止,这里是script.js:

$_POST

请注意,我不是要求任何人为我这样做,我知道我没有提供$(document).ready(function(){ var fieldCount = 0; $("#btnFieldSend").click(function(){ if($("#txtFieldName").val()) { $.ajax({ type: 'post', dataType: 'json', url: 'insertField.php', data: { txtFieldName: $("#txtFieldName").val() } }).done(function(data){ if(data.ok) { $("#txtFieldName").val(''); alert(data.ok); } else alert(data.err); }) } }); $("#btnFields").click(function(){ if($(".fieldList").is(":hidden")) { $.ajax({ dataType: 'json', url: 'selectField.php' }).done(function(data){ if(data.ok) { fieldCount = data.fieldCount; for(var i = 0; i < fieldCount; i++) $(".appField").append('<input id="' + i + '" type="text" placeholder="' + data.fieldName[i][0] + '">'); $(".fieldList").show(); } else alert(data.err); }); } }); $("#insertValues").click(function(){ // send values }); }); 的任何代码,它将从字段中获取所有值并将它们发送到php ,它也缺乏将接收它的PHP代码。我只是陷入困境,不知道该做什么或如何继续,我只是需要一些帮助来指导我解决这个问题。

如果您需要我显示我的HTML,$("#insertValues").click()insertField.php或者我的sql脚本,请告诉我。

1 个答案:

答案 0 :(得分:0)

为所有输入提供名称属性,以便将它们发送到您的后端。

您可以通过整个表单发送,就好像它不是通过Ajax并将$('#formId').serialize()指定为您的Ajax函数的data属性。