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

Question

I have been working on single page application where users can run different processes. That would involve adding new records, updating existing records and deleting records in some situations. My question is what is the best way to handle this processes on the front end? I have tried to monitor how Stack-overflow works and how they handle this situations. Still can say 100% that I'm understanding if they use different url or they use submitted form data to decide which process should run on the back end. Here is small example:

<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>

In HTML above you can see two different buttons New and Edit . I only showed one record in table for testing purpose. So this si situation where I'm wondering how to handle this in JQuery/JavaScript and Ajax. Here is example of my js code:

$('#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);
    });
}

You can see that I call one function for both cases New and Edit. On the back end I have two different processes. One it's for insert and other for update. Based on parameters passed from the user that will be decided on the back end. How ever I know that I can use data-attributes and append that value to my formData with url name and send to the server. Some people will say that is not reliable.My code on the back end will Insert or Update based on the submitted parameters in form data. I'm wondering what is a good way for this situation now days. How that is handled in professional manner? If anyone have a good example please let me know. One more thing, I would like to keep these two processes in the same function on the back end to prevent some code redundancy in my opinion.

Answer 1

You could do something as simple as

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

So on success, it loads the newContent page.