获取由Ajax，动态输入字段和静态输入字段加载的表单输入字段的值

Question

这有点复杂，所以我希望我说出这个权利。

我有一个加载选项列表，并用一个静态的输入开始的一种形式：

<span id="keyword_list_out" class="input"><input class="keys margin-bottom" type="text" name="keywords[]" /> 

当页面加载属于列表，如Ajax调用显示其他输入字段：

<span class="field-wrapper"><input class="keys" type="text" name="keywords[]" value="Option One" /><a class="remove-keyword" href="javascript:void(0);"><img src="images/icons/cross-button-icon.png" /></a></span> 
<span class="field-wrapper"><input class="keys" type="text" name="keywords[]" value="Option Two" /><a class="remove-keyword" href="javascript:void(0);"><img src="images/icons/cross-button-icon.png" /></a></span> 

这些选项被预置在第一个静态输入字段ID：keyword_list_out的顶部。

用户可以动态地添加更多的输入字段，他们可以删除现有的字段。

到目前为止，所有这些工作都很好。我的问题是访问输入字段中包含的数据。我需要能够执行三种功能，一旦提交表单：

1. 如果用户已删除的选项，我需要如果用户添加一个字段我需要插入从数据库
2. 删除此这个到数据库
3. 如果用户改变现有字段的我需要在数据库中更新此值

我可以通过使用输入名称“KEYWORD_NAME []”访问输入字段内的数据作为一个数组，然后我可以遍历数组。

但是，这并没有解决具有特定ID号的现有选项。我可以将ID编号分配给从Ajax调用加载的字段，但静态字段和用户添加的字段不会有ID编号，因为这些不是必需的。这些字段将被简单地插入到数据库中。

所以我想我的问题是我将如何去确定哪个现有选项属于数据库中的什么ID号。我应该补充一点，这些选项并不是唯一命名的。

我考虑一些诸如：

1. 只为Ajax加载字段
2. 当通过每个输入提交循环和使用定界符用户预先设置ID到名称值的末尾提供的ID号不会提供。 IE：选项二--- 1
3. 使用PHP循环访问数组并在数组中匹配的数组值爆炸---''
4. 如果在'---'上找到匹配项，则更新数据库，否则插入到数据库中

有什么想法？

UPDATE

我已划分输入字段成两个阵列：existing_options []和new_options []。发布我添加了一些之前

在我的jQuery脚本：

var existing_options = $('input[name=existing_options]').attr('value'); 
var new_options = $('input[name=new_options]').attr('value'); 

发送Ajax的数据是：

'existing_options[]=' + existing_options + '&new_options[]=' + new_options; 

但是PHP正在恢复，这些值是字符串，不是数组。在这里丢失的东西....

Answer 1

我会建议在数据库端使用自动增量ID。当加载页面，已删除时使用的ID放在像这样<span class="field-wrapper" id="$row[id]">比：

$('.remove-keyword').on('click', function(){ 
    var id = $(this).parents('span').attr('id'); 
    place ajax post here with data sent being this id. 
}); 

，基本上这将是相同的添加关键字，除了使用AJAX张贴到你的脚本，并使用mysql_insert_id();作为返回的id而不是动态创建下一行。

Answer 2

当字段通过AJAX加载它们分配的ID

<input class="keys" type="text" id="keyword_11" name="keywords[]" value="Option Two" /> 
<input class="keys" type="text" id="keyword_12" name="keywords[]" value="Option Two" /> 

上提交点击然后在jQuery中，你可以通过关键字回路

var new_keywords=Array(); 
var existing_keywords=Array(); 
$("input[name^='keywords']").each(function(){ 
    var id = $(this).attr("id"); 
    var val=$(this).val(); 
    if(id=="" && val!="") 
    { 
    new_keywords.push($(this).val()); 
    } 
    else if(id!="") 
    { 
    var keyword_id=id.split("_")[1]; 
    existing_keywords.push({"id":keyword_id,"val":val}); 
    } 
}); 

// call AjAX function add new_keywords to database 
// call Ajax function to update existing keywords 

更新1

在向数据库添加new_keywords的成功功能通过AJAX更新现有的dom，这样如果添加新的关键字，那么您可以编辑它并尝试保存它将具有与其关联的ID。