jquery+ajax實現表格修改行操作

標籤：enum   成功   form   class   host   else   提交   oda   pretty   

大體思路每一行的 <tr> 標籤都將其 id 賦值成對應在資料庫記錄中的主索引值；點擊編輯按鈕時，將該行的 id 值傳給 js 函數，作為更新時的條件；當在編輯介面輸入更新的資料後，點擊更新按鈕時，將新的資料傳給 js 函數；將 這一行的 id 值，也就是對應記錄的主鍵和編輯後的更新資料，封裝成 json 通過 ajax 傳遞給後台；剩下的就交給後台...重新整理介面即可；執行個體示範 擷取改行的id，先存起來；

 

  
 //擷取待更改指標的id
  
 function getZBId(obj){
  
 temp = $(obj).attr("optionId");
  
 }
 

點擊提交按鈕後，將之前擷取的 id 和更新後的資料，傳給後台；

 

  
//編輯指標名稱
  
 function editZB(obj){
  

  
 var zbId = temp;
  
 var zbName = $("#zb_name").val();
  

  
 var strJson={};
  
 strJson.id=zbId;
  
 strJson.name=encodeURIComponent(zbName);
  

  
 $.ajax({
  
 type:"get",
  
 url:"http://localhost:8080/DemoPlatform/zb-UpdateZB.action",
  
 data:strJson,
  
 dataType:"jsonp",
  
 error:function(error){
  
 swal("失敗","更新指標失敗","question");
  
 },
  
 success:function(data){
  
 if(data.success === 1){
  
 swal("更新成功","成功更新指標名稱","success");
  
 $(‘#zbBody‘).html(‘‘);
  
 getZBsByPage();
  
 $(‘#editZB‘).modal(‘hide‘);
  
 }else{
  
 swal("更新失敗","未成功更新指標名稱","error");
  
 }
  
 }
  

  

  
 });
  
 }
 

 

jquery+ajax實現表格修改行操作