前后端协调处理checkbox
需求:页面属于一个弹出窗体,查询结果,用checkbox展示,选择后,把选中的结果传递给调用页面。
由于要取得后端写的checkbox控件的值,所以在后端处理最后的提交事件,用这个语句把结果传递到页面中的js代码,实现对上级页面的调用:
ClientScript.RegisterStartupScript(typeof(string), "LoadCID", "parent.finishcatalog('"+TextBox2.Text+"')", true);
不过发现IE8正常,360,ff,chrome都不行,只能重来。
方案1:后端提交时,把结果用绑定串的方式传到前端,失败。因为前端的代码比后端要先执行
方案2:用jquery读取checkbox,但发现aspx生成的input代码,很难访问,没有value
<input id="CheckBoxList1_0" type="checkbox" name="CheckBoxList1$0" /><label for="CheckBoxList1_0">A052118:汽车工业</label><br />
方案3:在后端不用控件,构造html代码,前端处理
后端:
for(int i=0;i<dt.Rows.Count;i++) //构造html代码,便于客户端访问
{
strCheckList += "<input type='checkbox' id='chk" + i.ToString() + "' value='" + dt.Rows[i]["f_Code"].ToString() + "' />";
strCheckList += "<label >" + dt.Rows[i]["f_Code"].ToString() + ":" + dt.Rows[i]["f_Name"].ToString() + "</label><br />";
}
前端:
function seled()
{
var vals = "";
$('input:checkbox:checked').each(function (index, item) {
vals+=(vals==""?"":"|")+$(this).val()
});
parent.finishcatalog(vals); //在后台调用
parent.wbox.close();
}
效果:

前后端协调处理checkbox的更多相关文章
- 架构设计:前后端分离之Web前端架构设计
在前面的文章里我谈到了前后端分离的一些看法,这个看法是从宏观的角度来思考的,没有具体的落地实现,今天我将延续上篇文章的主题,从纯前端的架构设计角度谈谈前后端分离的一种具体实现方案,该方案和我原来设想有 ...
- 淘宝玉伯引发Web前后端研发模式讨论
淘宝玉伯是是前端基础类库 Arale 的创始人,Arale 基于 SeaJS 和 jQuery.不久前,淘宝玉伯在 Github 的 Arale 讨论页面上抛出了自己对于Web 前后端研发模式的思考. ...
- 前后端分离之Web前端架构设计
架构设计:前后端分离之Web前端架构设计 在前面的文章里我谈到了前后端分离的一些看法,这个看法是从宏观的角度来思考的,没有具体的落地实现,今天我将延续上篇文章的主题,从纯前端的架构设计角度谈谈前后端分 ...
- node+vue进阶【课程学习系统项目实战详细讲解】打通前后端全栈开发(1):创建项目,完成登录功能
第一章 建议学习时间8小时·分两次学习 总项目预计10章 学习方式:详细阅读,并手动实现相关代码(如果没有node和vue基础,请学习前面的vue和node基础博客[共10章]) 视频教程地 ...
- 从壹开始前后端分离【 .NET Core2.0 +Vue2.0 】框架之六 || API项目整体搭建 6.1 仓储模式
前言 1.@LearningCoding 小伙伴关于用Sqlsugar在mysql数据库上的研究成果: sqlsugarcore支持mysql等数据库,在DbContext里面只需要设置dbtype为 ...
- 从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十四 ║ VUE 计划书 & 我的前后端开发简史
---新内容开始--- 番外 大家周一好呀,又是元气满满的一个周一呀!感谢大家在周一这个着急改Bug的黄金时期,抽出时间来看我的博文哈哈哈,时间真快,已经到第十四篇博文了,也很顺顺(跌跌)利利 (撞撞 ...
- Springboot + Vue + shiro 实现前后端分离、权限控制
本文总结自实习中对项目对重构.原先项目采用Springboot+freemarker模版,开发过程中觉得前端逻辑写的实在恶心,后端Controller层还必须返回Freemarker模版的ModelA ...
- ABP开发框架前后端开发系列---(2)框架的初步介绍
在前面随笔<ABP开发框架前后端开发系列---(1)框架的总体介绍>大概介绍了这个ABP框架的主要特点,以及介绍了我对这框架的Web API应用优先的一些看法,本篇继续探讨ABP框架的初步 ...
- ajax学习----json,前后端交互,ajax
json <script> var obj = {"name": "xiaopo","age": 18,"gender ...
随机推荐
- 关于 C 语言,我喜欢和讨厌的十件事
前言:最近有个家伙抱怨道“为什么我还要再用C?”-虽然我不同意他的说法,但至少他随口提到如果你“在一台拇指大小的电脑”上编程,或者为一门语言写引导程序,那么可以用C语言.要我说,写设备驱动,或者特定平 ...
- LPC-Link-II Rev C JTAG
- CRC 概述
Acquired from: ftp.adelaide.edu.au:/pub/rocksoft/crc_v3.txt or ftp://ftp.rocksoft.com/papers/crc_v3. ...
- 【Go命令教程】13. go tool cgo
cgo 也是一个 Go 语言自带的特殊工具.一般情况下,我们使用命令 go tool cgo 来运行它.这个工具可以使我们创建能够调用 C 语言代码的 Go 语言源码文件.这使得我们可以使用 Go 语 ...
- Android 关于“NetworkOnMainThreadException”出错提示的原因及解决办法
几乎每天都在论坛里面看到有网友问这个问题,代码是无误的,在低版本的API上都可以运行的,但在3.0以上的版本就会出现NetworkOnMainThreadException 出现android.os. ...
- fabric-ca-client
fabric-ca-client enroll -u http://admin:adminpw@localhost:7054 /root/.fabric-ca-client:总用量 12-rwxr-x ...
- Eclipse SDK Android Studio 下载地址
https://developer.android.com/sdk/index.html#download 这个网址可以下载需要的东西,FQ的话可以给 xifulinmen@gmail.com 发一个 ...
- 《图解CSS3:核心技术与案例实战》
<图解CSS3:核心技术与案例实战> 基本信息 作者: 大漠 丛书名: Web开发技术丛书 出版社:机械工业出版社 ISBN:9787111469209 上架时间:2014-7-2 出版日 ...
- Easyui dialog Y轴滚动条定位
使用Easyui dialog进行数据新增的时候,如果Y轴方向有滚动条,当关闭之前的时候,将滚动条拉到最下方,再次打开的时候,滚动条还是定位在最下方. 需求: 每次打开的时候dialog Y轴滚动条定 ...
- [Web 前端] React Router v4 入坑指南
cp from : https://www.jianshu.com/p/6a45e2dfc9d9 万恶的根源 距离React Router v4 正式发布也已经过去三个月了,这周把一个React的架子 ...