Heim > Backend-Entwicklung > PHP-Tutorial > jquery实现动态表格解决思路

jquery实现动态表格解决思路

WBOY
Freigeben: 2016-06-13 12:25:18
Original
929 Leute haben es durchsucht

jquery实现动态表格
a.php


    jquery表格操作
    <script></script>
    


$user = "root";
$password ="";
$con = mysql_connect($url,$user,$password);
 mysql_query("set names utf8");
 mysql_select_db("abc",$con);
?>
    
        
            
            
            
            
        
    

                序号
            

                步骤名称
            

                步骤描述
            

                相关操作 添加
            

    
    

    




<script><br /> var currentStep = 0;<br /> var max_line_num = 0;<br /> //添加新记录<br /> function add_line() {<br /> max_line_num = $("#content tr:last-child").children("td").html();<br /> if (max_line_num == null) {<br /> max_line_num = 1;<br /> }<br /> else {<br /> max_line_num = parseInt(max_line_num);<br /> max_line_num += 1;<br /> }<br /> $('#content').append(<br /> "<tr id='line" + max_line_num + "'>" +<br /> "<td class='td_Num'>" + max_line_num + "" +<br /> "<td class='td_Item'><input type='text' name='bz' class='stepName' value='步骤名称" + max_line_num + "'>" <br /> "<td class='td_Item'><input type='text' class='stepDescription' value='步骤描述" + max_line_num + "'>" +<br /> "<td class='td_Oper'>" +<br /> "<span onclick='up_exchange_line(this);'>上移 " +<br /> "<span onclick='down_exchange_line(this);'>下移 " +<br /> "<span onclick='remove_line(this);'>删除 " +<br /> "" +<br /> "");<br /> }<br /> //删除选择记录<br /> function remove_line(index) {<br /> if (index != null) {<br /> currentStep = $(index).parent().parent().find("td:first-child").html();<br /> }<br /> if (currentStep == 0) {<br /> alert('请选择一项!');<br /> return false;<br /> }<br /> if (confirm("确定要删除改记录吗?")) {<br /> $("#content tr").each(function () {<br /> var seq = parseInt($(this).children("td").html());<br /> if (seq == currentStep) { $(this).remove(); }<br /> if (seq > currentStep) { $(this).children("td").each(function (i) { if (i == 0) $(this).html(seq - 1); }); }<br /> });<br /> }<br /> }<br /> //上移<br /> function up_exchange_line(index) {<br /> if (index != null) {<br /> currentStep = $(index).parent().parent().find("td:first-child").html();<br /> }<br /> if (currentStep == 0) {<br /> alert('请选择一项!');<br /> return false;<br /> }<br /> if (currentStep <= 1) {<br /> alert('已经是最顶项了!');<br /> return false;<br /> }<br /> var upStep = currentStep - 1;<br /> //修改序号<br /> $('#line' + upStep + " td:first-child").html(currentStep);<br /> $('#line' + currentStep + " td:first-child").html(upStep);<br /> //取得两行的内容<br /> var upContent = $('#line' + upStep).html();<br /> var currentContent = $('#line' + currentStep).html();<br /> $('#line' + upStep).html(currentContent);<br /> //交换当前行与上一行内容<br /> $('#line' + currentStep).html(upContent);<br /> $('#content tr').each(function () { $(this).css("background-color", "#ffffff"); });<br /> $('#line' + upStep).css("background-color", "yellow");<br /> event.stopPropagation(); //阻止事件冒泡<br /> }<br /> //下移<br /> function down_exchange_line(index) {<br /> if (index != null) {<br /> currentStep = $(index).parent().parent().find("td:first-child").html();<br /> }<br /> if (currentStep == 0) {<br /> alert('请选择一项!');<br /> return false;<br /> }<br /> if (currentStep >= max_line_num) {<br /> alert('已经是最后一项了!');<br /> return false;<br /> }<br /> var nextStep = parseInt(currentStep) + 1;<br /> //修改序号<br /> $('#line' + nextStep + " td:first-child").html(currentStep);<br /> $('#line' + currentStep + " td:first-child").html(nextStep);<br /> //取得两行的内容<br /> var nextContent = $('#line' + nextStep).html();<br /> var currentContent = $('#line' + currentStep).html();<br /> //交换当前行与上一行内容<br /> $('#line' + nextStep).html(currentContent);<br /> $('#line' + currentStep).html(nextContent);<br /> $('#content tr').each(function () { $(this).css("background-color", "#ffffff"); });<br /> $('#line' + nextStep).css("background-color", "yellow");<br /> event.stopPropagation(); //阻止事件冒泡<br /> }<br /> <br /></script>

b.php

$url = "localhost";
$user = "root";
$password ="";
$con = mysql_connect($url,$user,$password);
mysql_query("set names utf8");
mysql_select_db("abc",$con);
$sql2="INSERT INTO bz(bz) VALUES ('$_POST[bz]')"; 
if(mysql_query($sql2)or die(mysql_error()));
?>



请教下各位大神怎样实现提交数据后每行表单的数据可以插入数据库,现在的情况是如果增加多行只有最后一行的数据可以插入数据库。。。。
------解决思路----------------------
按 php 的约定:同名表单元素,在命名是要写作数组样式
即 name='bz' 应写作 name='bz[]'
------解决思路----------------------


这样会被后面的覆盖的。
需要改为数组形式。

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage