如何确定使用JQuery和Ajax调用哪个函数？

Question

我一直在开发单页应用程序，用户可以在其中运行不同的进程。 在某些情况下，这将涉及添加新记录，更新现有记录以及删除记录。 我的问题是在前端处理此过程的最佳方法是什么？ 我试图监视Stack-overflow工作方式以及它们如何处理这种情况。 仍然可以说100％我了解，如果他们使用不同的url或使用提交的表单数据来决定哪个进程应在后端运行。 这是一个小例子：

<div class="row">
   <div class="form-group col-xs-12 col-sm-12 col-md-12 col-lg-12">
       <button type="button" name="new_record" id="new_record">New</button>
   </div>
</div>
<table>
   <thead>
      <tr>
         <th>Name</th>
         <th>Status</th>
         <th>Edit</th>
      </tr>
   </thead>
   <tbody>
      <tr>
        <td>New York</td>
        <td>Active</td>
        <td class="text-center">
           <button class="record_edit">Edit</button>
        </td>
      </tr>
   </tbody>
</table>

在上面的HTML中，您可以看到两个不同的按钮New和Edit 。 我只在表中显示了一条记录用于测试。 所以在这种情况下，我想知道如何在JQuery / JavaScript和Ajax中处理它。 这是我的js代码示例：

$('#frmSave').on('submit', submitFrm);
function submitFrm(e){
    var formData = frmObject.serialize();

    $.ajax({
       type: 'POST',
       url: 'Components/Functions.cfc?method=saveData',
       data: formData,
       dataType: 'json'
    }).done(function(obj){
       if(obj.STATUS === 200){
           // Successfully saved.
       }else{
           // Error!   
       }  
    }).fail(function(jqXHR, textStatus, errorThrown){
       alert('Error: '+errorThrown);
    });
}

您可以看到，我在“新建”和“编辑”两种情况下都调用了一个函数。 在后端，我有两个不同的过程。 一种用于插入，另一种用于更新。 基于从用户传递的参数，这些参数将在后端确定。 我怎么知道我可以使用data-attributes并将该值附加到具有url名称的formData并发送到服务器。 有人会说这是不可靠的，我后端的代码将根据表单数据中提交的参数进行插入或更新。 我想知道如今对于这种情况有什么好的方法。 如何以专业的方式处理？ 如果有人有好的榜样，请告诉我。 还有一件事，我想将这两个进程保留在后端的同一功能中，以防止某些代码冗余。

Answer 1

您可以做一些简单的事情

.done(function(obj){
       if(obj.STATUS === 200){
           // Successfully saved.
            $('#main').load("./newContent.cfm");
          }

因此，一旦成功，它将加载newContent页面。