Question

我正在使用AJAX请求将文本框和选项字段中的数据存储到存储到db的服务器，创建行并将其附加到表。

$("#addRecord").click(function(e) {
e.preventDefault();
var question_id = $("#questionId").val();
var question_text = $("#questionText").val();
$.ajax({
    url: "addContestAnswer.html",
    type: "post",
    dataType: "json",
    data: {"questionId": question_id, "contestText": question_text},
    success: function(data){
       addRows(data.questionId,data.contestText); 
       // calling the function to create row
    },
    error: function (request, status, error) {
        console.log("error" + status);
    }
  });   
});

创建行

function addRows(questionId ,questionText) {

    var deleteButton = '<a href="#" id="deleteButton" class="btn btn-primary">delete</a>';
    var fileUpload = '<input type="file" name="supportingDocument" accept="application/pdf" id="uploadSupportingDoc" />';
    var row = "<tr><td class=\"ques_id\">"+questionId+"</td><td class=\"ques_text\">"+questionText+"</td><td class=\"ques_file\">"+fileUpload+"</td><td></td><td>"+deleteButton+"</td></tr>";
    $('#recordTable tr:last').after(row);

    $("#questionId").val("-1");
    $("#questionText").val("");

}

到目前为止，生成的HTML看起来很不错。

但是当我刷新页面时，生成的行的html ID，类和名称都没有被保留。

在ajax调用后生成的行

<tr>
  <td class="ques_id">17</td>
  <td class="ques_text">asddgfdg</td>
  <td class="ques_file"><input type="file" name="supportingDocument" accept="application/pdf" id="uploadSupportingDoc"></td>
  <td></td>
  <td><a href="#" id="deleteButton" class="btn btn-primary">delete</a></td>
</tr>

刷新页面后

<tr>
    <td>17</td>
    <td>asddgfdg</td>
    <td><input type="file" name="" id=""></td>
    <td></td>                                   
    <td><a href="#" id="" class="btn btn-primary">delete</a></td>
</tr>

为什么会这样？我是否在生成行时错过了一些调整，如果不是什么解决方案？

在页面上刷新html标记ID，类和名称不会被保留

0 个答案: