`
javatoyou
  • 浏览: 1077940 次
  • 性别: Icon_minigender_2
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

表格客户端实现全选以及模态窗传值

 
阅读更多

1.表格客户端全选

<!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>

<script language="javascript" type="text/javascript">
// <!CDATA[
//表格全选
function CheckAll(oCheckbox) {
var GridView1 = document.getElementById("<%=GridView1.ClientID %>");
for(i = 1;i < GridView1.rows.length; i++)
{
GridView1.rows[i].cells[1].getElementsByTagName("INPUT")[0].checked = oCheckbox.checked;
}
}
</script>

</head>
<body>
<form runat="server">
<div>
<asp:GridView runat="server" AllowPaging="True" AllowSorting="True"
DataSourceID="SqlDataSource1">
<Columns>
<asp:TemplateField HeaderText="序号">
<ItemTemplate>
<%# Container.DataItemIndex+1 %>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
<input type="checkbox" runat="server" /><label>全选</label>
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox runat="server" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
<HeaderStyle ForeColor="Black" HorizontalAlign="Center" />
</asp:GridView>

2.模态窗体传值

调用的页面,点击按钮执行此方法,最下面的为模态窗体返回值后刷新页面

function searchInfo()
{
var username=document.getElementById("txtName").value;
var windowDialog = window.showModalDialog("Default.aspx?UserName="+username,"","dialogWidth=500px; dialogHeight=300px");
window.location.reload();
}

用来承载aspx页面的html页面

<HTML>
<HEAD>
<script language="javascript">
function ResolveUrl()
{
var frm = window.frames[0];
frm.location = location.toString().replace("Default.htm","Default.aspx");
}
</script>
</HEAD>
<BODY style="margintop:0;marginleft:0;marginright:0;marginbottom:0" >
<table align="left" cellpadding="0" cellspacing="0" width="100%" height="100%" >
<tr>
<td valign="top" width="100%" height="100%"><iframe border="0" width="100%" height="100%"></iframe></td>
</tr>
</table>
</BODY>
</HTML>

再Default.aspx页面中就可以用Request.QueryString["UserName"].ToString();访问并辅值了
分享到:
评论

相关推荐

    CSS实现表格样式及全选功能

    本篇文章将深入探讨如何使用CSS来实现表格(TABLE)的样式美化以及添加全选功能。 一、表格样式的基本设置 1. 表格边框:通过`border`属性可以设置表格的整体边框,如`border: 1px solid #ccc;`。为了使表格中的每...

    DataGridView表头添加checkbox实现全选反选

    在Windows应用程序开发...总之,`DataGridView`表头添加`CheckBox`实现全选反选涉及了控件创建、事件处理、数据绑定以及用户交互等多个方面。理解这些知识点可以帮助开发者更有效地构建功能丰富的数据查看和编辑界面。

    checkbox实现全选和反选经典例子

    在开发过程中,确保对各种场景进行充分的测试,包括全选、反选、部分选中以及在数据动态加载或更新后的情况。 综上所述,"checkbox实现全选和反选经典例子"是一个关于如何在Web应用中利用Checkbox控件提高用户交互...

    JS实现全选、反选

    JS JS实现全选反选 全选 反选

    原生JS表格列表全选反选代码.zip

    在JavaScript(JS)编程中,实现表格...通过学习这个示例,开发者可以更好地理解和掌握如何使用原生JavaScript来处理表格数据,以及如何实现复选框的全选和反选功能。这对于构建交互性强的Web应用是非常有用的技能。

    javascript实现全选全不选

    在JavaScript编程中,“全选”和“全不选”功能是常见的用户交互设计,尤其在数据列表或表格中,用户通常需要快速选择或取消选择所有项目。这些功能可以通过简单的JavaScript代码实现,通常与HTML的复选框(checkbox...

    JS简单表格列表全选反选代码.zip

    本示例中的"JS简单表格列表全选反选代码"是一个使用原生JS编写的功能,它允许用户通过点击表头按钮来实现表格数据的全选和反选操作。这个功能在处理大量数据时特别有用,例如在用户需要批量操作表格项时。 1. **...

    三层架构实现全选、反选以及多项删除

    在本场景中,我们将讨论如何在三层架构中实现全选、反选和多项删除的功能,这些功能通常应用于数据表格或列表视图,如在网页中的表格操作。 1. 表示层(UI): 表示层是用户与应用交互的界面,负责接收用户的输入并...

    GridView客户端与服务器端全选方法合集

    本合集将详细探讨GridView在客户端和服务器端实现全选的两种方法。 ### 1. 客户端全选方法 客户端全选通常借助JavaScript或者jQuery实现,这种方式无需进行服务器端的往返,提高用户体验。以下是一种常见的实现...

    DataGridView行标题加复选框实现全选

    在Windows应用程序开发中,`DataGridView`控件是一个非常常见的组件,用于展示表格数据。它提供了丰富的功能,包括编辑、排序、分页等。在实际应用中,为了提高用户体验,我们经常需要在`DataGridView`的行标题中...

    纯Jquery表格全选+反选+增删查找

    纯Jquery表格全选+反选+增删查找,一个简陋版本,仅供参考,细节处理不周到处请评论,后期有空修改

    jquery实现全选和反选小功能

    很好用的使用jquery来实现的通用的全选反选功能

    Jquery实现全选和反选功能

    本教程将深入探讨如何使用jQuery实现全选和反选功能,这在多选列表或表格中非常常见,例如在批量处理数据时。 全选和反选功能的核心在于同步用户界面中的复选框状态。当用户点击一个主复选框(通常标记为“全选”)...

    表格中全选按钮的使用以及删除功能的实现

    综上所述,实现“表格中全选按钮的使用以及删除功能”涉及前端HTML、CSS、JavaScript与后端Java Web的结合,包括DOM操作、事件监听、Ajax通信以及数据库操作。通过这样的设计,我们可以创建一个功能丰富的表格应用,...

    Android实现全选、单选多选功能实例.rar

    Android实现全癣单选多选功能实例,这个功能对于手机管理来说,相当有用了,一般情况下长按屏幕就会出现全选框,可多选 也可单选,选择之后可进行下一步操作,本例子就是实现这种功能,算是一个简单实用的模块实例吧...

    QTableWidget表头添加复选框实现全选功能

    有时候,我们希望在表格的表头中添加复选框,以便实现全选或取消全选的功能,这在处理大量数据时尤其有用。本篇文章将详细解释如何在`QTableWidget`的表头中添加复选框并实现全选功能。 首先,我们需要了解`...

    jQuery表格行全选反选单选代码

    jQuery表格行全选反选单选代码,例子采用bootstrap格式,可以选择自定义。

    JSF中使用BooleanCheckbox实现全选功能

    在JavaServer Faces (JSF)框架中,实现全选功能通常是通过使用BooleanCheckbox组件来完成的。这篇博客文章“JSF中使用BooleanCheckbox实现全选功能”可能详细讲解了如何利用这种组件在用户界面中创建一个可以勾选的...

    在DataGrid中使用CheckBox,实现全选功能

    这篇博客“在DataGrid中使用CheckBox,实现全选功能”详细介绍了如何实现这一需求。 首先,我们需要在DataGrid的列定义中添加一个CheckBox列。在WPF中,可以使用DataGridTemplateColumn来自定义列模板,将CheckBox...

    checkbox选中 全选 传值

    除了技术实现,设计良好的全选和传值功能还需遵循用户体验(UX)原则,确保用户能直观地理解功能,并能方便地进行操作。例如,全选按钮的位置、视觉反馈(如选中状态的变化)和错误提示都应考虑在内。 综上所述,...

Global site tag (gtag.js) - Google Analytics