如何将一个表格的所有数据存到数据库的一个字段里,并如何将这一个数据字段里的数据填充到前端表格里

表格图:


html:

<table>
  <tr class="trClass">
                                        <td class=""><input type="text" value="1" style="width:20px;" /></td>
                                        <td class=""><input type="text" value="诸葛华森" style="width: 70px;" /></td>
                                        <td class=""><input type="text" value="女" style="width:20px;" /></td>
                                        <td class=""><input class="font12" type="text" value="450302111111111111" style="width: 130px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 60px;" /></td>
                                        <td class=""><input type="text" value="33" style="width:20px;" /></td>
                                        <td class=""><input type="text" value="配偶" style="width: 60px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 40px;" /></td>
                                        <td colspan="2" class=""><input type="text" value="" style="width: 80px;" /></td>
                                    </tr>
                                    <tr class="trClass">
                                        <td class=""><input type="text" value="2" style="width:20px;" /></td>
                                        <td class=""><input type="text" value="诸葛华森" style="width: 70px;" /></td>
                                        <td class=""><input type="text" value="女" style="width:20px;" /></td>
                                        <td class=""><input class="font12" type="text" value="450302111111111111" style="width: 130px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 60px;" /></td>
                                        <td class=""><input type="text" value="33" style="width:20px;" /></td>
                                        <td class=""><input type="text" value="配偶" style="width: 60px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 40px;" /></td>
                                        <td colspan="2" class=""><input type="text" value="" style="width: 80px;" /></td>
                                    </tr>
                                    <tr class="trClass">
                                        <td class=""><input type="text" value="3" style="width:20px;" /></td>
                                        <td class=""><input type="text" value="诸葛华森" style="width: 70px;" /></td>
                                        <td class=""><input type="text" value="女" style="width:20px;" /></td>
                                        <td class=""><input class="font12" type="text" value="450302111111111111" style="width: 130px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 60px;" /></td>
                                        <td class=""><input type="text" value="33" style="width:20px;" /></td>
                                        <td class=""><input type="text" value="配偶" style="width: 60px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 40px;" /></td>
                                        <td colspan="2" class=""><input type="text" value="" style="width: 80px;" /></td>
                                    </tr>
                                    <tr class="trClass">
                                        <td class=""><input type="text" value="" style="width:20px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 70px;" /></td>
                                        <td class=""><input type="text" value="" style="width:20px;" /></td>
                                        <td class=""><input class="font12" type="text" value="" style="width: 130px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 60px;" /></td>
                                        <td class=""><input type="text" value="" style="width:20px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 60px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 40px;" /></td>
                                        <td colspan="2" class=""><input type="text" value="" style="width: 80px;" /></td>
                                    </tr>
                                    <tr class="trClass">
                                        <td class=""><input type="text" value="" style="width:20px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 70px;" /></td>
                                        <td class=""><input type="text" value="" style="width:20px;" /></td>
                                        <td class=""><input class="font12" type="text" value="" style="width: 130px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 60px;" /></td>
                                        <td class=""><input type="text" value="" style="width:20px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 60px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 40px;" /></td>
                                        <td colspan="2" class=""><input type="text" value="" style="width: 80px;" /></td>
                                    </tr>
                                    <tr class="trClass">
                                        <td class=""><input type="text" value="" style="width:20px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 70px;" /></td>
                                        <td class=""><input type="text" value="" style="width:20px;" /></td>
                                        <td class=""><input class="font12" type="text" value="" style="width: 130px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 60px;" /></td>
                                        <td class=""><input type="text" value="" style="width:20px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 60px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 40px;" /></td>
                                        <td colspan="2" class=""><input type="text" value="" style="width: 80px;" /></td>
                                    </tr>
                                    <tr class="trClass">
                                        <td class=""><input type="text" value="" style="width:20px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 70px;" /></td>
                                        <td class=""><input type="text" value="" style="width:20px;" /></td>
                                        <td class=""><input class="font12" type="text" value="" style="width: 130px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 60px;" /></td>
                                        <td class=""><input type="text" value="" style="width:20px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 60px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 40px;" /></td>
                                        <td colspan="2" class=""><input type="text" value="" style="width: 80px;" /></td>
                                    </tr>
                                    <tr class="trClass">
                                        <td class=""><input type="text" value="" style="width:20px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 70px;" /></td>
                                        <td class=""><input type="text" value="" style="width:20px;" /></td>
                                        <td class=""><input class="font12" type="text" value="" style="width: 130px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 60px;" /></td>
                                        <td class=""><input type="text" value="" style="width:20px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 60px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 40px;" /></td>
                                        <td colspan="2" class=""><input type="text" value="" style="width: 80px;" /></td>
                                    </tr>
                                    <tr class="trClass">
                                        <td rowspan="2" class="">合计</td>
                                        <td colspan="2" class="">人数</td>
                                        <td class=""><input type="text" value="" style="width: 100px;" />人</td>
                                        <td class=""><input type="text" value="" style="width: 60px;" /></td>
                                        <td class=""><input type="text" value="" style="width:20px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 60px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 40px;" /></td>
                                        <td colspan="2" class=""><input type="text" value="" style="width: 80px;" /></td>
                                    </tr>
                                    <tr class="trClass">
                                        <td colspan="2" class="">金额</td>
                                        <td class=""><input type="text" value="" style="width: 120px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 60px;" /></td>
                                        <td class=""><input type="text" value="" style="width:20px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 60px;" /></td>
                                        <td class=""><input type="text" value="" style="width: 40px;" /></td>
                                        <td colspan="2" class=""><input type="text" value="" style="width: 80px;" /></td>
                                    </tr>
                                    <tr class="trClass">
                                        <td colspan="3" class="">支付金额合计(大写)</td>
                                        <td colspan="7" class=""><input type="text" value="亿" style="text-align: left;" /></td>
                                    </tr>
</table>

存入(把表格所有数据拼接成一个字符串存入数据库):

function setForm(){
		var str="";
			var num = $(".trClass").find("input").length;
		$(".trClass").find("input").each(function(e){
			var a = $(".trClass").find("input").eq(e).val();
			if(e+1 == num){
				str+= a;
			}else{
				str+= a+',';
			}
		});
		return str;
	}

读取(从数据库取出值,把字符串分割成一个个值依次放入表格的value):

function getForm(){
		var relativesFormStr = $("#relativesFormHidden").val(); //数据库获取的值
		var relativesFormArray = new Array();
		if(relativesFormStr !=null || relativesFormStr !=""){
			relativesFormArray = relativesFormStr.split(",");
			$(".trClass").find("input").each(function(e){
				var a = $(".trClass").find("input").eq(e).val(relativesFormArray[e]);
			});
		}
	}



猜你喜欢

转载自blog.csdn.net/zengguanlin/article/details/79410624