Input 多记录添加

先看要添加的效果图；

 

增加一行的按钮可以一直增加下去，没有限制，这里主要用到了js的.innerHTML属性，现给出“增加一行”按钮的程序代码。

<input id="Button1" type="button" value="增加一行" onclick="AddRecorder()"/>

var i = 0;
var j = 1;
function AddRecorder() {
    // alert();
    ++i;
    ++j;
    document.getElementById("sample" + i).innerHTML = '<table width="100%" border="0" cellpadding="0" cellspacing="0" class="childsample" bgcolor="#BBD3EB"><tr>                        <td height="26"  bgcolor="#FFFFFF">      <input name="samplespecification' + i + '" type="text" /></td>          <td height="26"  bgcolor="#FFFFFF">     <input name="quantity' + i + '" type="text" /></td>          <td height="26"  bgcolor="#FFFFFF">      <input name="colour' + i + '" type="text" /></td>          <td height="26"  bgcolor="#FFFFFF">      <input name="itemnumber' + i + '" type="text" /></td>          <td height="26"  bgcolor="#FFFFFF">      <input name="esdeliverytime' + i + '" type="text" /></td>         <td height="26"  bgcolor="#FFFFFF">      <select name="urgentsample' + i + '">                <option value="一般">一般</option>                                <option value="缓慢">缓慢</option>              <option value="紧急">紧急</option>                               <option value="最急">最急</option> </select>  </td>  </tr>  </table> <div id="sample' + j + '">&nbsp;</div>  ';
    document.getElementById('ContentPlaceHolder2_hidCount').value = j;  // 这里加了个隐藏的<asp:HiddenField ID="hidCount" Value="0" runat="server"/>用来获取得到的个数   }

 

 

再看提交，接收值（因为不是服务器控件，所以要用form的post方法来接收）；

        public string _samplespecification = null;
        public string _quantity=null;
        public string _colour=null;
        public string _itemnumber=null;
        public string _esdeliverytime=null;
        public string _urgentsample = null;

//接收规格，数量，颜色
            DBUtility.StringToInt toInt = new DBUtility.StringToInt(); //这个是转换成整形int
            int number =toInt.ToInt(hidCount.Value); //得到添加的数量
            if (number != 0)
            {
                for(int i=0;i<number;i++){
                    _samplespecification += Request.Form["samplespecification"+i]+"|";
                    _quantity += Request.Form["quantity" + i] + "|";
                    _colour += Request.Form["colour" + i] + "|";
                    _itemnumber += Request.Form["itemnumber" + i] + "|";
                    _esdeliverytime += Request.Form["esdeliverytime" + i] + "|";
                    _urgentsample += Request.Form["urgentsample" + i] + "|";                   
                }

这个接收，下章讲分解出来。