前后端协调处理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 ...
随机推荐
- 群晖NAS简介(转)
Synology 群晖科技(Synology )创立于 2000 年,自始便专注于打造高效能.可靠.功能丰富且绿色环保的 NAS 服务器,是全球少数几家以单纯的提供网络存储解决方案获得世界认同的华人企 ...
- CRC32 Source Code
/* The Quest Operating System * Copyright (C) 2005-2010 Richard West, Boston University * * This pro ...
- PGXZ-腾讯全功能分布式关系数据集群
PGXZ-腾讯全功能分布式关系数据集群
- bat如何批量删除指定部分文件夹名的文件夹
@echo offfor /f "delims=" %%i in ('dir /s/b/ad 123*') do ( rd /s/q "%%~i")exit
- SNK 与PFX
snk 1用来证明这个生成的程序集是你发布的: 2如果你写的程序集要用在多个应用程序上的话,那么这个程序集必须要拥有唯一的名称,这个强名称是程序集唯一名称的一部分. 3只要你保护好你的snk文件不要公 ...
- 快速打开 Mac OS X 隐藏的用户资源库文件夹
在较高版本的 Mac OS X 中,用户的资源库文件夹(/Users/username/Library)默认被系统隐藏了,从 Finder 窗口中不能直接打开. 下面介绍一个非常简单的方法来快速打开用 ...
- 为什么MacBook装Windows这么火?
Mac到底要不要装Windows?一直以来这都是个很有争议性的话题.只要你经常浏览国内一些知名Mac论坛,就会发现那里不仅有各种Mac装Windows教学贴.讨论区,而且时不时还会冒出关于“Mac装不 ...
- firedac连接linux的oracle
firedac连接linux的oracle 首先要下载并安装 oci for linux.OCI的版本要和ORACLE数据库的版本一致. centos7环境下安装OCI:https://blog.cs ...
- Android实现对HOME键的捕获和屏蔽
1.1. 在AndroidManifest.xml中加上权限,禁止HOME键. <uses-permission android:name="android.permission.DI ...
- python测试开发django-15.查询结果转json(serializers)
前言 django查询数据库返回的是可迭代的queryset序列,如果不太习惯这种数据的话,可以用serializers方法转成json数据,更直观 返回json数据,需要用到JsonResponse ...