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

从表单中删除ID - ID必须是唯一的。
更改提交按钮的链接
添加事件处理程序：

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

在foreach循环中使用ajax发布表单数据onclick事件

1 个答案: