通过js根据后台数据动态生成一个页面
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ExportSelField.aspx.cs" Inherits="GDAS.Web.DocManage.Library.ExportSelField" %>
<!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>test</title>
<link href="../../CSS/SubPage.css" rel="Stylesheet" type="text/css" />
<script language="javascript" type="text/javascript">
function CloneTr() {
var newRow;
var table = document.getElementById("tbField");
if (table.rows[0]) {
newRow = table.rows[1].cloneNode(true);
}
else {
newRow = document.createElement("tr");
newRow.appendChild(document.getElementById("td"));
}
newRow.style.display = "block";
table.rows[0].parentElement.appendChild(newRow);
var maxLength = table.rows.length;
table.rows[maxLength - 1].cells[0].innerHTML = "<input type='checkbox' style='cursor:hand'/>";
table.rows[maxLength - 1].cells[1].firstChild.value = "";
table.rows[maxLength - 1].cells[2].innerHTML = " ";
table.rows[maxLength - 1].cells[3].innerHTML = " ";
}
//删除最后一行，如果是只有一行记录则清空行
function DeleteTr() {
var table = document.getElementById("tbField");
var index = event.srcElement.parentNode.parentNode.rowIndex;
var result = window.confirm("您确认删除此记录？");
if (result) {
table.deleteRow(index);
return;
}
}
function LoadData() {
var type = "FILE";
var DocTypeID = "<%=this.DocTypeID%>";
var response = ExportSelField.GetExportField(type,DocTypeID);
if (response.error != null) {
alert(response.error);
return;
}
var dt = response.value;
var table = document.getElementById("tbField");
CreateTable(dt, table);
}
function CreateTable(dt, table) {
for (var i = 0; i < dt.Rows.length; i++) {
var row_count;
CloneTr(table);
row_count = table.rows.length - 1;
table.rows[row_count].cells[0].innerHTML = "<input type='checkbox' style='cursor:hand' checked='true'/>";
table.rows[row_count].cells[1].firstChild.value = (dt.Rows[i].Name == "") ? " " : dt.Rows[i].Name;
table.rows[row_count].cells[2].innerHTML = (dt.Rows[i].DBColumnName == "") ? " " : dt.Rows[i].DBColumnName;
table.rows[row_count].cells[3].innerHTML = (dt.Rows[i].DBColumnType == "") ? " " : dt.Rows[i].DBColumnType;
}
}
function SelectAll(obj) {
var table = document.getElementById("tbField");
for (i = 1; i < table.rows.length; i++) {
table.rows[i].childNodes[0].childNodes[0].checked = obj.checked;
}
}
function Export() {
window.returnValue = GetValue();
window.close();
}
function GetValue() {
var result = "";
var iCount = 0;
var table = document.getElementById("tbField");
document.getElementById("hdfFieldString").value = "";
for (var i = 2; i < table.rows.length; i++) {
if (table.rows[i].childNodes[0].childNodes[0].checked == true) {
var field0 = field1 = field2 = "";
field0 = table.rows[i].cells[1].firstChild.value;
field1 = table.rows[i].cells[2].innerHTML;
field2 = table.rows[i].cells[3].innerHTML;
result += GetFieldString(field0, field1, field2) + ",";
iCount++;
}
}
if (iCount == 0)
result = "*";
return result;
}
function GetFieldString(cField, eField, FieldType) {
var result = "";
switch (FieldType) {
case "date":
case "datetime": {
result = "convert(varchar, " + eField + ", 23) as '" + cField + "'";
break;
}
default:
{
result = eField + " as '" + cField + "'";
break;
}
}
return result;
}
</script>
</head>
<body onload="LoadData()">
<form id="form1" runat="server">
<div id="main" style="width:95%">
<fieldset>
<legend>选择导出字段</legend>
<table id="tbField" class="grid">
<tr>
<th style="width:60px">
<input type='checkbox' id="chkall" style='cursor: hand' title="全选" onclick="SelectAll(this)"
checked="checked" />
</th>
<th>
字段名
</th>
<th style="display: none">
fieldname
</th>
<th style="display: none">
数据类型
</th>
</tr>
<tr style="display: none">
<td align="center">
<input type='checkbox' />
</td>
<td align="center">
<asp:TextBox ID="TextBox1" runat="server" Width="95%"></asp:TextBox>
</td>
<td style="display: none">
</td>
<td style="display: none">
</td>
</tr>
</table>
</fieldset>
<fieldset style="text-align: center; margin-top: 10px">
<input type="button" id="btnExport" class="btnS" value="导出" style="width: 60px;
height: 24px" onclick="Export();" />
<input type="button" class="btnS" style="width: 60px; height: 24px" value="关闭"
onclick="javascript:window.close();" />
</fieldset>
</div>
<asp:HiddenField ID="hdfFieldString" runat="server" />
</form>
</body>
</html>
通过js根据后台数据动态生成一个页面的更多相关文章
- js将json数据动态生成表格
今天开发中遇到需要展示动态数据的问题, 具体要求是后端传来的json字符串,要在前端页面以table表格的形式展示, 其实没啥难的,就是拼接table标签,纯属体力活,于是自己写了个呆萌,保存起来,以 ...
- 初探原生js根据json数据动态创建table
初探原生js根据json数据动态创建table 小生以实习生的职位进入了一家非纯软件的公司做asp.net开发,大半个月下来发现公司里居然没有前端工程师,这令我很诧异,跟着公司做项目,发现前端后台没有 ...
- 在Vue中由后台数据循环生成多选框CheckBox时的注意事项
多选框是一种非常常见的功能,有时候我们会根据后台返回的数据进行多选框渲染,之前做项目时遇到循环生成多选框时,v-model绑定的值会随着选中与取消改变,但页面却不会变化 的情况,后来测试了一下,发现多 ...
- 动态生成一个设定好特殊样式的Tlabel，快速生成代码
动态生成一个设定好特殊样式的Tlabel,快速生成代码: 1.自己先在可视化界面设定一个Label,像这样: 2.选择label,快捷键ctrl+C 复制,粘贴带代码编辑器去,会生成一段这样的窗体代码 ...
- 如何用asp.net MVC框架、highChart库从sql server数据库获取数据动态生成柱状图
如何用asp.net MVC框架.highChart库从sql server数据库获取数据动态生成柱状图?效果大概是这样的,如图: 请问大侠这个这么实现呢?
- cglib根据数据动态生成对象
最近有个任务:根据查询SQL直接导出报表 实现关键是,怎么根据sql查询的数据动态生成对象列表,想到Cglib动态代理实现 废话少说,上代码: 定义动态生成Java Bean类: import jav ...
- 根据html页面模板动态生成html页面(c#类)
本文转载自:http://www.cnblogs.com/yuanbao/archive/2008/01/06/1027985.html点击打开链接 一直以为动态生成静态页面不好做,昨天在网上找了下, ...
- Js 日期选择，可以的一个页面中重复使用本JS日历，兼容IE及火狐等主流浏览器，而且界面简洁、美观，操作体验也不错。
<html> <head> <title>Js日期选择器并自动加入到输入框中</title> <meta http-equiv="con ...
- angular js根据json文件动态生成路由状态
项目上有一个新需求,就是需要根据json文件动态生成路由状态,查阅了一下资料,现在总结一下发出来: 首先项目用到的是angular的UI-路由,所以必须引入angular.js和angular-ui- ...
随机推荐
- TCP/IP协议栈及OSI参考模型详解
OSI参考模型 OSI RM:开放系统互连参考模型(open systeminterconnection reference model) OSI参考模型具有以下优点: 简化了相关的网络操作: 提供设 ...
- passport.js
$(function(){ function isPlaceholder(){ var input = document.createElement('input'); return 'placeho ...
- C#实现异步编程的两个简单机制（异步委托&定时器）及Thread实现多线程
创建线程的常用方法:异步委托.定时器.Thread类 理解程序.进程.线程三者之间的区别:简而言之,一个程序至少有一个进程,一个进程至少有一个线程进程就是在内存中运行的程序(即运行着的程序):一个进程 ...
- APP上架详细流程-2016最新
注:文章为博主原创,转载请注明出处 由于新项目要上架,并且发现了与以往不同的地方特此总结 原料: 0.MAC一台 1.可用的开发者账号 2.AppID 3.发布证书 4.描述性文件 上架步骤: 一.在 ...
- The Sorrows of Young Werther
The Sorrows of Young Werther J.W. von Goethe Thomas Carlyle and R.D. Boylan Edited by Nathen Haskell ...
- linux下Memcached安装以及PHP的调用
一:安装libevent 由于memcached安装时,需要使用libevent类库,所以先安装libevent 1.官网下载:http://libevent.org/ #wget https:/ ...
- python 闭包(closure)
闭包的定义: 闭包就是一个函数,这个函数可以记住封闭作用域里的值,而不管封闭作用域是否还在内存中. 来一个例子: def happy_add(a): print 'id(a): %x' % id(a) ...
- Swipe2.1更新——移动Web内容滑块
Swipe JS 是一个轻量级(3.7 kb) mobile slider,支持 1:1 触摸移动(基于精确的触摸位置的内容滑动). 但是我使用一段时间后发现两个bug,所以在官方2.0(官网http ...
- android自动填充短信验证码
自动拦截短信实际上就是在系统注册一个BroadcastReceiver,然后通过设置拦截短信的: filter.addAction("android.provider.Telephony.S ...
- ios开发——实用技术篇&网络音频播放
网络音频播放 在日常的iOS开发中,我们通常会遇到媒体播放的问题,XCode中已经为我们提供了功能非常强大的AVFoundation框架和 MediaPlayer框架.其中AVFoundation框架 ...