Question

我具有应在表中插入/更新记录的功能。从服务器接收到ajax响应后，数据将通过saveData(obj.DATA)函数传递。这是示例：

$.ajax({
    type: 'POST',
    url: 'cfc/save.cfc?method=saveData',
    data: frmData,
    dataType: 'json'
}).done(function(obj){
    if(obj.STATUS === 200){
        saveData(obj.DATA);
    }else{
        alert('Error! Please contact administrator.');
    }
}).fail(function(jqXHR, textStatus, errorThrown){
    alert('Error: ' + errorThrown);
});

服务器中的obj.DATA如下所示：

{"DATA":{
   "date":"06/27/2019",
   "comment":"Comment Test",
   "rec_id":23517,
   "title":"Test",
   "user":"MI0983",
   "year":2019
   }
}

然后，最后一块是saveData函数，该函数应使用数据填充JS对象并插入/更新表行。这是我到目前为止的内容：

    var js Data = {}; // global variable data storage.
    function saveData(data) {
        if(jsData.hasOwnProperty(data.rec_id)) {
             jsData[data.rec_id] = {
                "rec_id": data.rec_id,
                "title": data.title,
                "comment": data.comment
             }

             var tr = $('row_' + data.rec_id);
             tr.empty();                          
        } else {
             jsData[data.rec_id] = {
                 "rec_id": data.rec_id,
                 "title": data.title,
                 "comment": data.comment
             }

             var tr = $('<tr>').prop('id', 'row_' + data.rec_id);
             $('#tbl_my > tbody').prepend(tr);   
        }

        tr.append($('<td>').text(data.title));
        tr.append($('<td>').text(data.user));
        tr.append($('<td>').text(data.date));
        tr.append($('<td>').text(data.year));
        tr.append($('<td>').html('<button class="edit">Edit</button>'));
        tr.append($('<td>').html('<button class="delete">Delete</button>'));
  }

我想知道是否有更好的方法来插入/更新表行。如您所见，我只在JavaScript对象（jsData）中存储三个数据字段，因为这三个数据字段是在表单中使用的。用户只能更新那些字段。其他字段仅用于显示目的。另外，我想知道从服务器返回插入的数据是否是一个好习惯（一旦ajax进程完成，我将在上面的代码中做什么）还是应该从form对象中抓取数据？如果有人有建议，请告诉我。谢谢。

如何在表格中插入/更新表格行？

0 个答案: