在foreach循環中使用ajax發佈表單數據onclick事件

Question

我有一個PHP MVC項目。我從數據庫中讀取數據併爲每條記錄創建一個表單。我想在按下按鈕的時候進行更新。但我混淆瞭如何在JavaScript函數中訪問表單元素。我爲每條記錄使用了一個索引，但是我無法克服如何在javascript中找到它。

我的PHP文件：

$index = 1; 
foreach ($categories as $category) { 
    ?> 
    <div class="row"> 
     <form id="updateForm"> 
      <div style="visibility: hidden"> 
       <input type="text" name="editId<?php echo "$index"?>" id="editId<?php echo "$index"?>" value="<?php echo $category['id']; ?>"> 
      </div> 
      <div class="form-group col-md-4"> 
       <input type="text" class="form-control" name="editTitle<?php echo "$index"?>" id="editTitle<?php echo "$index"?>" 
         value="<?php echo $category['title']; ?>"> 
      </div> 
      <div class="form-group col-md-4"> 
       <select class="form-control" name="editline<?php echo "$index"?>" id="editline<?php echo "$index"?>"> 
        <option disabled selected value="">Sıra</option> 
        <?php 
        for ($i = 1; $i <= $rows; $i++) { 
         ?> 
         <option value="<?php echo $i; ?>"><?php echo $i; ?></option> 
         <?php 
        } 
        ?> 
       </select> 
      </div> 
      <div class="form-group col-md-1"> 
       <a class="btn btn-success" id="btnUpdateSubmit" name="btnUpdateSubmit" href="<?php echo BASE_URL; ?>/category" 
        onclick="updatecategory();"><i class="fa fa-check"></i> Kaydet</a> 
      </div> 
      <div class="form-group col-md-1"> 
       <a class="btn btn-danger" href="#"><i class="icon-trash icon-large"></i> Sil</a> 
      </div> 
     </form> 
    </div> 
<?php 
$index++; 

我的javascript函數：

function updatecategory() { 
    if (window.XMLHttpRequest){ 
     xmlhtpp = new XMLHttpRequest(); 
    } 
    else { 
     xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    xmlhtpp.onreadystatechange = function() { 
     if(xmlhttp.readyState == 4 && xmlhttp.status == 200){ 
      document.getElementById("existCategories").innerHTML = xmlhtpp.responseText; 
     } 
    }; 
    xmlhtpp.open("POST", '<?php echo BASE_URL ?>/category'); 
} 

Answer 1

1. 從表單中刪除ID - ID必須是唯一的。

2. 更改鏈接提交按鈕

3. 添加事件處理程序：

---

window.onload=function() { 
    var forms = document.getElementsByTagName("form"); 
    for (var i=0;i<forms.length;i++) { 
    forms[i].onsubmit=function() { 
     updateCategory(this); 
     return false; // cancel submit 
    } 
    } 
} 

然後有

function updatecategory(theForm) { 
    var categoy = theForm.elements[0].value; // editIdxxx