2015-01-04 59 views
0

我只在這裏添加了完整代碼的一部分。我想要的代碼是一旦提交,我只希望它更新表中已更改的字段,而不是每行中的每個項目(因爲某些是NULL值,並且需要保持這種方式) 。僅更新已被用戶修改或添加的字段

因此最終 - 我將如何編碼PHP進程頁面。

表被格式化爲heli_cust
cust_id
cust_fname
cust_lname
cust_kg
cust_email
cust_addr
cust_phone

http://jsfiddle.net/qz7k5caj/

HTML:

<table width="100%"> 
<div class="form_head">Passengers</div> 
<table width="100%" cellpadding="4" cellspacing="0" id="px"> 
<thead> 
<tr class="tab_head"> 
<td width="25px" style="text-align:center; color:#FFFFFF; font-size:11px;">#</td> 
<td class="form_label" style="color:#ffffff; font-size:11px;">Cust#</td> 
<td class="form_label" style="color:#FFFFFF; font-size:11px;">First Name</td> 
<td class="form_label" style="color:#FFFFFF; font-size:11px;">Last Name</td> 
<td class="form_label" style="color:#FFFFFF; font-size:11px;">Wgt</td> 
<td class="form_label" style="color:#FFFFFF; font-size:11px;">Address</td> 
<td class="form_label" style="color:#FFFFFF; font-size:11px;">Phone</td> 
<td class="form_label" style="color:#FFFFFF; font-size:11px;">Email</td> 
<td></td> 
</tr> 
</thead> 
<tbody id="tbl1"> 
<?php if ($cust = mysql_fetch_assoc($getcust)) { 
    do { ?> 
<tr id="pass"> 
<td style="vertical-align:middle; text-align:center"><input type="text" name="pass_num[]" readonly="readonly" value="1" class="pass" style="font:Verdana; font-size:11px; border:none; background-color:transparent; width:25px; text-align:center; vertical-align:middle;" tabindex="-1"></td> 
<td><input type="text" readonly="readonly" class="form_a" value="<?php echo (int)$cust[cust_id] ?>" style="text-align:right; border:none; background-color:transparent; width:25px" /></td> 
<td><input type="text" name="cust_fname[]" class="form_g" value="<?php echo $cust[cust_fname] ?>"/></td> 
<td><input type="text" name="cust_lname[]" class="form_g" value="<?php echo $cust[cust_lname] ?>"/></td> 
<td><input type="text" name="cust_kg[]" class="form_a" value="<?php echo $cust[cust_kg] ?>"/></td> 
<td><input type="text" name="cust_addr[]" class="form_c" style="width:200px" value="<?php echo $cust[cust_addr] ?>"/></td> 
<td><input type="text" name="cust_phone[]" class="form_g" value="<?php echo $cust[cust_phone] ?>"/></td> 
<td><input type="text" name="cust_email[]" class="form_b" value="<?php echo $cust[cust_email] ?>"/></td> 
<td style="vertical-align:middle"><a class="removePax"><img src="images/remove_pax.png" /></a></td> 
</tr> 
<?php } while ($cust = mysql_fetch_assoc($getcust)); 
} ?> 
</tbody> 
</table> 
<table width="100%"> 
<tr><td style="text-align:right"><a id="add">&nbsp;<img src="images/add_pax.gif">&nbsp;</a></td></tr> 
</table> 
<br /> 
<table width="100%"><tr><td></td><td style="text-align:right"><input type="submit" value="Update" /></td></tr> 
</table> 

JQuery的:

$("#tbl1 tr:even").css({"background-color":"#CCC", "opacity":"0.8"}); 
$("#tbl1 tr:odd").css({"background-color":"#FFF", "opacity":"0.8"}); 
$(".pass").each(function(){ 
    $(this).val($(this).closest('tr').index()+1); 
}); 

$("#tbl1 .removePax").on("click",function() { 
    if($("#tbl1 tr:last").index() >0) { 
     var tr = $(this).closest('tr'); 
      tr.css("background-color","#FF3700"); 
      tr.fadeOut(500, function(){ 
       tr.remove(); 
       $(".pass").each(function(){ 
        $(this).val($(this).closest('tr').index()+1); 
       }); 
       $("#tbl1 tr:even").css({"background-color":"#CCC", "opacity":"0.8"}); 
       $("#tbl1 tr:odd").css({"background-color":"#FFF", "opacity":"0.8"}); 
      }); 
      return false; 
    } else { 
    if($(this).closest('tr').index() == 0) { 
     $("#tbl1 tr:eq(0)").find("input").each(function(){ 
      if ($(this).hasClass('pass')) { 
      } else { 
       $(this).val(''); 
      }; 
     }); 
    }; 
    }; 
}); 

$("#add").click(function(){ 
    $("#tbl1 tr:first").clone().find("input").each(function() { 
     $(this).val('')}).end().appendTo("#tbl1"); 
     $("#tbl1 tr:even").css({"background-color":"#CCC", "opacity":"0.8"}); 
     $("#tbl1 tr:odd").css({"background-color":"#FFF", "opacity":"0.8"}); 
     $(".removePax").on("click",function() { 
      if($("#tbl1 tr:last").index() >0) { 
       var tr = $(this).closest('tr'); 
       tr.css("background-color","#FF3700"); 
       tr.fadeOut(500, function(){ 
        tr.remove(); 
        $(".pass").each(function(){ 
         $(this).val($(this).closest('tr').index()+1); 
        }); 
        $("#tbl1 tr:even").css({"background-color":"#CCC", "opacity":"0.8"}); 
        $("#tbl1 tr:odd").css({"background-color":"#FFF", "opacity":"0.8"}); 
       }); 
       return false; 
      } else { 
      if($(this).closest('tr').index() == 0) { 
       $("#tbl1 tr:eq(0)").find("input").each(function(){ 
        if ($(this).hasClass('pass')) { 
        } else { 
         $(this).val(''); 
        } 
       }).end(); 
      } else { 
       var tr = $(this).closest('tr'); 
       tr.css("background-color","#FF3700"); 
       tr.fadeOut(500, function(){ 
        tr.remove(); 
        $(".pass").each(function(){ 
         $(this).val($(this).closest('tr').index()+1); 
        }); 
        $("#tbl1 tr:even").css({"background-color":"#CCC", "opacity":"0.8"}); 
        $("#tbl1 tr:odd").css({"background-color":"#FFF", "opacity":"0.8"}); 
       }); 
       return false; 
      } 
      }; 
     }); 
     $(".pass").each(function(){ 
       $(this).val($(this).closest('tr').index()+1); 
     }); 
    }); 
}); 
+0

檢索當前值並將它們進行比較... – rjdown

+0

Ahh,ok ..那麼從那裏開始,只需對每個值使用一個'IF'語句來構建查詢?.. –

回答

0
從@rjdown給出的主意,如果你想它使用AJAX做

除此之外,您可以添加一個onchange處理程序,並將「更改」類添加到已更改的項目中。然後,只需將所有更改的數據發送回您的後端。這樣你肯定知道你要發送什麼。

相關問題