为什么JS动态生成的input标签在后台有时候没法获取到
最近在做一个产品添加的功能，需求有点奇葩，所以在添加的时候免不了要用到动态生成控件，然后我就使用了JS去动态生成一些 checkbox类型的input标签，在以前用asp.net在后台生成的input标签都可以用request["name属性"]这样的方式在后台 获取，但是在获取JS生成的标签时，就会发生有时候可以获取到，有时候又获取不到，到现在才发现，原来是我的JS写法有问题，所以才导致这样的问题。之前 这样的问题也遇到过好几次，苦于没找到解决方法，之前都是换别的方法去完成的，如今再次遇到，倒也觉得还是想办法解决的好，下面贴出代码
前台代码：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<script type="text/javascript">
function InsertProduct() {
for (var i = 0; i < 5; i++) {
var tb = document.getElementById("productTable");
var refRow = tb.rows.length - 1;
var newRefRow = tb.insertRow(refRow);
var checkboxid = document.createElement("input");
checkboxid.setAttribute("type", "checkbox");
checkboxid.setAttribute("id", "checkboxid");
checkboxid.setAttribute("name", "chkallID");
checkboxid.setAttribute("value", i.toString() + "InsertProduct");
newRefRow.insertCell(0).appendChild(checkboxid);
newRefRow.insertCell(1).innerHTML = "<span class=\"color4\">" + document.getElementById("t_name").value + "</span>";
newRefRow.insertCell(2).innerHTML = document.getElementById("t_gkj").value;
newRefRow.insertCell(3).innerHTML = document.getElementById("t_sl").value;
newRefRow.insertCell(4).innerHTML = document.getElementById("t_zk").value;
newRefRow.insertCell(5).innerHTML = document.getElementById("t_zhj").value;
newRefRow.insertCell(6).innerHTML = document.getElementById("t_xj").value;
}
}
function Addrows() {
for (var i = 0; i < 5; i++) {
var tb = document.getElementById("tableadd");
var refRow = tb.rows.length - 1;
var newRefRow = tb.insertRow(refRow);
newRefRow.insertCell(0).innerHTML = "<input type=\"checkbox\" id=\"chkold\" name=\"chkold \" value=\"" + i + "addrows\" />";
newRefRow.insertCell(1).innerHTML = "<span class=\"color4\">" + document.getElementById("t_name1").value + "</span>";
newRefRow.insertCell(2).innerHTML = document.getElementById("t_gkj1").value;
newRefRow.insertCell(3).innerHTML = document.getElementById("t_sl1").value;
newRefRow.insertCell(4).innerHTML = document.getElementById("t_zk1").value;
newRefRow.insertCell(5).innerHTML = document.getElementById("t_zhj1").value;
newRefRow.insertCell(6).innerHTML = document.getElementById("t_xj1").value;
}
}
</script>
<h1>方案一</h1>
<table width="100%" id="productTable">
<tr>
<td class="title-bg">
选择
</td>
<td class="title-bg">
产品名称
</td>
<td class="title-bg">
公开价
</td>
<td class="title-bg">
数量
</td>
<td class="title-bg">
折扣（X/10）
</td>
<td class="title-bg">
折后价
</td>
<td class="title-bg">
小计
</td>
</tr>
<tr>
<td>
<a class="clickcss" onclick="InsertProduct()">添加</a>
</td>
<td>
<input type="text" id="t_name" name="" />
</td>
<td>
<input type="text" id="t_gkj" name="" value="0" />
</td>
<td>
<input type="text" id="t_sl" name="" value="0" />
</td>
<td>
<input type="text" id="t_zk" name="" value="10" />
</td>
<td>
<input type="text" id="t_zhj" name="" value="0" />
</td>
<td>
<input type="text" id="t_xj" name="" value="0" />
</td>
</tr>
</table> <asp:Button ID="Button1" runat="server" Text="接收方案一参数"
onclick="Button1_Click" /> <br />
<h1>方案二</h1>
<table width="100%" id="tableadd">
<tr>
<td class="title-bg">
选择
</td>
<td class="title-bg">
产品名称
</td>
<td class="title-bg">
公开价
</td>
<td class="title-bg">
数量
</td>
<td class="title-bg">
折扣（X/10）
</td>
<td class="title-bg">
折后价
</td>
<td class="title-bg">
小计
</td>
</tr>
<tr>
<td>
<a class="clickcss" onclick="Addrows()">添加</a>
</td>
<td>
<input type="text" id="t_name1" name="" />
</td>
<td>
<input type="text" id="t_gkj1" name="" value="0" />
</td>
<td>
<input type="text" id="t_sl1" name="" value="0" />
</td>
<td>
<input type="text" id="t_zk1" name="" value="10" />
</td>
<td>
<input type="text" id="t_zhj1" name="" value="0" />
</td>
<td>
<input type="text" id="t_xj1" name="" value="0" />
</td>
</tr>
</table>
</div>
<asp:Button ID="Button2" runat="server" Text="接收方案二参数"
onclick="Button2_Click" />
</form>
</body>
</html>
后台代码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls; public partial class Default2 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{ }
/// <summary>
/// 接收方案一参数
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void Button1_Click(object sender, EventArgs e)
{
if (string.IsNullOrEmpty(Request["chkallID"]) == false)
{
Response.Write(Request["chkallID"].ToString());
Response.End();
}
}
/// <summary>
/// 接收方案二参数
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void Button2_Click(object sender, EventArgs e)
{
if (string.IsNullOrEmpty(Request["chkold"]) == false)
{
Response.Write(Request["chkold"].ToString());
Response.End();
}
}
}
方案一的写法，生成checkbox类型的input后，在后台可以接收到选中的checkbox的value，接收的时候会自动的在每个checkbox的value后面加上,逗号隔开，
方案二的写法，在后台是无法获取到动态生成的checkbox类型的input，并且，如果直接获取，还会发生异常。
为什么JS动态生成的input标签在后台有时候没法获取到的更多相关文章
- js动态新增组合Input标签
var x = 1; function addlink() { var linkdiv = document.getElementById("add1_0"); if (linkd ...
- js动态生成数据列表
我们通常会使用table标签来展示数据内容,由于需要展示的数据内容是随时更换的,所以不可能将展示的数据列表写死在html写死在页面中,而是需要我们根据后台传来的数据随时更换,这个时候就需要我们使用js ...
- JS动态生成表格后 合并单元格
JS动态生成表格后 合并单元格 最近做项目碰到表格中的单元格合并的问题,需求是这样的,首先发ajax请求 请求回来后的数据 动态生成表格数据,但是生成后如果编号或者(根据其他的内容)有相同时,要合并单 ...
- js动态生成canvas
最近看代码发现一个小现象,就是用js动态生成的canvas在浏览器审查元素的时候,发现它没有结束标签,但是不会影响canvas上图形的绘制,同时还有一点就是在动态设置canvas宽度和高度的时候,不要 ...
- JS动态生成的元素，其对应的方法不响应（比如单击事件，鼠标移动事件等）
主要原因:在页面给元素注册点击事件的时候[ $(function () { XXX }); ],JS动态生成的元素还尚未生成,所以click事件就没有生效 解决方法: 方案一:js动态生成元素后再给 ...
- 抓取Js动态生成数据且以滚动页面方式分页的网页
代码也可以从我的开源项目HtmlExtractor中获取. 当我们在进行数据抓取的时候,如果目标网站是以Js的方式动态生成数据且以滚动页面的方式进行分页,那么我们该如何抓取呢? 如类似今日头条这样的网 ...
- 2）JS动态生成HTML元素的爬取
2)JS动态生成HTML元素的爬取 import java.util.List; import org.openqa.selenium.By; import org.openqa.selenium.W ...
- qrcode.js 动态生成二维码
用qrcode.js动态生成二维码图片非常简单,只需要引入qrcode.js即可使用,而且可以自定义图片大小.背景色等信息. 1.jsp代码---页面头部引入qrcode.js,jquery文件可选 ...
- js 动态生成html 触发事件传参字符转义
通常,在使用 JS 动态生成 html 的过程中,会嵌入相应的样式.事件等属性元素,而这时经常会出现所谓的 “单.双引号不够用” 的情况,别急,这时可以利用 html 语言中的转义字符来解决.下面就来 ...
随机推荐
- linux命令中，执行一个程序，后面加上&, 代表的意思是什么？
后台执行.也就是执行这个程序的同时,你的终端同时还能够做其他的事情,如果不加这个符号,那么你执行这个程序后,你的终端只能等这个程序执行完成才能够继续执行其他的操作 . 如:启动etcd: ./etcd ...
- oracle命中率模型计算
命中率模型是在owi之前比较常用的一种诊断性能问题的方法,通过命中率的计算,发现系统中的一些设置是否合理,当命中率不高的时候,通过调整一些参数和设置,提高命中率,有效的提高系统的性能和吞吐量.但当系统 ...
- HDU-1339 A Simple Task
http://acm.hdu.edu.cn/showproblem.php?pid=1339 正常做法超时,要有点小技巧存在. A Simple Task Time Limit: 2000/1000 ...
- [App]Taste VS2015 && Android Studio
逆水飞 尝试进行各种Android开发工具的安装以及大致流程对比 几个疑惑的地方 1)根据SDK的描述,应该是一个新版本的推出就有对应的包里面包含多个文件那么对于:SDK Platform.APIs. ...
- DevExpress 用户控件 分页（上）
说明:使用用户控件分页,完成后,使用时非常简单,数据绑定,调用自己写的一个事件就OK了 前期准备工作: (1)添加一个用户控件 命名PageCtrl (2)打开代码: [csharp] view ...
- hibernate sql查询
如果你跟我一样比较熟悉SQL,同时不想学习一门新的语言.那么在hibernate中使用Native SQL 查询也是一种不错的方式. 一方面,Native SQL在效率方面有天生的优势: 另一方面,S ...
- mac下教你如何开源项目托管GitHub
自从google code关闭了下载服务了之后,GitHub作为了目前最好用的免费开源项目托管站点,众多开源项目都托管在github,其中不乏著名的播放器MPC-HC. 这里教大家如何把代码库上传到G ...
- mysql 配置参数
mysql JDBC Driver 常用的有两个,一个是gjt(Giant Java Tree)组织提供的mysql驱动,其JDBC Driver名称(JAVA类名)为:org.gjt.mm.mysq ...
- 关于Ajax&初见Ajax
Ajax实现的效果 究竟Ajax能实现什么功能呢?今天下午学习了一下Ajax,现在跟大家分享一下我的学习心得.Ajax是什么?工作机制又是什么?可能不大准确,只是我个人看了视频学习后的一点点看法. A ...
- Can't connect to MySQL server on localhost (10061)解决方法
出现这种错误的原因是由于MySQL的服务被关闭的原因,重新启动一下服务就可以了,启动服务的操作如下: 右键[计算机]-[管理]