zoukankan      html  css  js  c++  java
  • 动态添加HTML表单控件,无(runat="server")

    JS部分
    <script> var allChildCount; //整个模块 allChildCount = 1; var sTxt = "<%=htmlselectName%>"; function addChildModel() { allChildCount++; var rown = filetb.rows.length; newRow = filetb.insertRow(rown); newRow.id = "mytdb" + allChildCount; newRow.name = "mytdb" + allChildCount; M1 = newRow.insertCell(0); var div = "<table>"; div += " <tr>"; div += " <td>名称</td>"; div += " <td>"; div += " <select id="ddl_name" + allChildCount + "" style=" 100px;" class="validate-selection" name="ddl_name" + allChildCount + "" onchange="GetModel('ddl_name" + allChildCount + "','ddl_model" + allChildCount + "','<%=projectId %>');"> <%=htmlselectName%> </select><font color="red">*</font>"; div += " </td>"; div += " <td>型号</td>"; div += " <td>"; div += " <select id="ddl_model" + allChildCount + "" style=" 100px;" class="validate-selection" name="ddl_model" + allChildCount + "" ><option></option></select><font color="red">*</font>"; div += " </td>"; div += " <td>采购数量</td>"; div += " <td>"; div += " <input id="tbC_Q" + allChildCount + "" name="tbC_Q" + allChildCount + "" class="required" type="text" style=" 100px;" /><font color="red">*</font>"; div += " </td>"; div += " <td>"; div += " 采购价格"; div += " </td>"; div += " <td>"; div += " <input id="tbP_P" + allChildCount + "" name="tbP_P" + allChildCount + "" class="required" type="text" style=" 100px;" />"; div += " </td>"; div += " <td>"; div += " 收货时间"; div += " </td>"; div += " <td>"; div += " <input id="tbD_D" + allChildCount + "" name="tbD_D" + allChildCount + "" class="required" type="text" onclick="WdatePicker()" style=" 100px;" /><font color="red">*</font>"; div += " <img src='images/del.gif' style='cursor: pointer;' width='15' height='15' onclick="removeModel(" + allChildCount + ")" alt='删除型号' />"; div += " </td>"; div += " </tr>"; div += "</table>"; M1.innerHTML = div; } </script>
    /*删除当前的索引行,从后往前删*/
            function removeModel(count) {
                var o = confirm("确认删除?");
                if (o) {
                    var i
                    var tdname
                    var tdln
                    var line = count;
                    if (line > 0) {
                        for (i = filetb.rows.length - 1; i >= 0; i--) {
                            tdname = filetb.rows[i].name;
                            tdln = tdname.substring(5, tdname.length);
                            if (tdln == line) {
                                filetb.deleteRow(i);
                            }
                        }
                    }
                }
            }
    /*清空第一项联系人*/
            function deleteLinkMan() {
                var o = confirm("确认删除?");
                if (o) {
                    var otable = document.getElementById("filetb");
                    otable.rows[0].style.display = "none";  //隐藏固定的第一行
                    //otable.rows[1].style.display = "none";  //隐藏固定的第二行
    
                    $("#ddl_name1").val(0);
                    $("#ddl_model1").val(0);
                    document.getElementById("tbC_Q1").value = "";
                    document.getElementById("tbP_P1").value = "";
                    document.getElementById("tbD_D1").value = "";
                }
            }
     for (var i = beginRow; i <= allChildCount; i++) {
                    if ($("#ddl_name" + i).length > 0) {   //存在控件
                    //根据I,所有控件验证
                     }
    }
    function GetModel(c1, c2, pid) {
                $.ajax({
                    url: "GetData.ashx",
                    cache: false,
                    data: { "type": "GetCModel", "name": $("#" + c1 + " option:selected ").text(), "pid": pid }, error: function () {
                        alert("数据加载出错!");
                    },
                    success: function (myData, status) {
                        $("#" + c2 + "").html(myData);
                    }
                });
            }
    HTML部分
    <
    tr> <td> 收货明细 </td> <td> <table id="filetb" style="font-size: 12px;"> <tr name="mytdb1"> <td> <table id="ctable"> <tr> <td> 名称 </td> <td> <select id="ddl_name1" style=" 100px;" class="validate-selection" name="ddl_name1" onchange="GetModel('ddl_name1','ddl_model1','<%=projectId %>');"> <%=htmlselectName%> </select><font color="red">*</font> </td> <td> 型号 </td> <td> <select id="ddl_model1" style=" 100px;" class="validate-selection" name="ddl_model1"> <option></option> </select><font color="red">*</font> </td> <td> 采购数量 </td> <td> <input id="tbC_Q1" name="tbC_Q1" class="required" type="text" style=" 100px;" /><font color="red">*</font> </td> <td> 采购价格 </td> <td> <input id="tbP_P1" name="tbP_P1" class="required" type="text" style=" 100px;" /> </td> <td> 收货时间 </td> <td> <input id="tbD_D1" name="tbD_D1" class="required" type="text" onclick="WdatePicker()" style=" 100px;" /><font color="red">*</font> <img src='images/del.gif' style='cursor: pointer;' width='15' height='15' onclick="deleteLinkMan()" alt='删除型号' /> </td> </tr> </table> </td> </tr> </table> </td> </tr> <tr> <td> </td> <td align="right"> <input type="button" class="buttoncss" value="增加型号" onclick="return addChildModel()" id="btnNew" /> </td> </tr>

    后台CS部分:

    public partial class IntegratedProject : BasePage
        {

    protected string htmlselectName = "";    //收货物品的名称

    //
    绑定HTML中select if (dt != null && dt.Rows.Count > 0) { htmlselectName += "<option value=0>请选择..</option>"; for (int i = 0; i < dt.Rows.Count; i++) { htmlselectName += "<option value=" + dt.Rows[i]["EquipmentName"].ToString() + ">" + dt.Rows[i]["EquipmentName"].ToString() + "</option>"; } }

    .ashx部分

    
    
        using System.Web.SessionState;
    ///
    <summary> /// GetData 的摘要说明 /// </summary> public class GetData : IHttpHandler, IRequiresSessionState {
    
    
     public void ProcessRequest(HttpContext context)
            {
                //context.Response.ContentType = "text/plain";
                //context.Response.Write("Hello World");
                if (context.Request.Params["type"] == "GetPartsModel")
                {
                    GetPartsModel(context.Request.Params["partsId"]);
                }

    public
    void GetCModel(string name, string pid) { IntegratedProjectBLL IPB = new IntegratedProjectBLL(); DataTable dt = IPB.GetEquipmentModel(name, pid); string html = ""; if (dt != null && dt.Rows.Count > 0) { html += "<option value=0>请选择..</option>"; for (int i = 0; i < dt.Rows.Count; i++) { html += "<option value=" + dt.Rows[i]["EquipmentModel"].ToString() + ">" + dt.Rows[i]["EquipmentModel"].ToString() + "</option>"; } } HttpContext.Current.Response.Write(html); }
  • 相关阅读:
    使用MulticastSocket实现多点广播(实现多人聊天室)
    双目相机标定以及立体测距原理及OpenCV实现
    opencv5-objdetect之级联分类器
    OpenCV人脸识别--detectMultiScale函数
    简单eclipse配置opencv的方法
    Struts2之Action的配置
    Struts2入门
    用户管理系统网站框架改进之MVC模式
    Tomcat中设置数据源和连接池
    JSP第一个实例之用户管理系统
  • 原文地址:https://www.cnblogs.com/PeaCode/p/3837661.html
Copyright © 2011-2022 走看看