• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

JS调用C#后台代码---JS实现DataGrid“全选”、“反选”、调用后台代码批量删除数据 ...

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

以前做web,基本没用过啥JS,这短时间,公司里面接触到的JS蛮多的,他们叫我在DataGrid里面的CheckBox弄个“全选”,要用JS来实现,来实现批量删除,这个功能,直接用C#是很好实现的,直接遍历就可以把选中的ID全部取出来。JS,那就只能用Html的CheckBox,这个不是服务器控件,C#后台代码是无法访问了,所以,再网上找了点资料,实现了。

首先,先定义一个DataGrid控件,先添加一个模板列,里面放一个Html的CheckBox,属性name=ChoessAll,(name,JS代码后面要用到)ID=chkChoessAll,绑定数据的唯一标识,这里是ID。

html(.aspx)代码如下:

<asp:GridView ID="gvUint" runat="server" AutoGenerateColumns="False" Width="100%">
            
<Columns>
                
<asp:TemplateField HeaderText="选择">
                    
<ItemTemplate>
                        
<input id="chkChoessAll" name="ChoessAll" value='<%# DataBinder.Eval(Container.DataItem, "ID")%>' type="checkbox" />
                    
</ItemTemplate>
                
</asp:TemplateField>
                
<asp:BoundField DataField="ID" HeaderText="楼盘名" />
                
<asp:BoundField DataField="address" HeaderText="地址" />
            
</Columns>
        
</asp:GridView>

添加一个HiddenField控件(Html控件)属性ID=hfId,(ID,JS代码后面要用到);选中的Check里面的数据的ID号。

现在实现JS代码:

<script type="text/javascript">
        
//选择全部
        function CheckAll_Click()
>

 

这里,随便弄个控件来触法“全选”和“反选”JS函数

 <a href="#" onclick="CheckAll_Click();">全选</a>
 
<a href="#" onclick="CheckReChange_Click();">反选</a>

到这里,已经可以实现了“全选”和“反选”功能了(看看,是不是无刷新)。

最后,实现,批量删除,这里,利用JS触法后台事件,添加一个服务器控件Button,ID=btnShowID(JS代码要使用),把他设置为隐藏,添加一句Html代码,来激发这个按钮的点击事件。

<a href="#" onclick="Delete_Click();">删除</a>

实现Button的后台事件:

protected void btnShowID_Click(object sender, EventArgs e)
}

功能到这里就完结了,下面给出全部实现代码:

aspx:

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!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 type="text/javascript">
        
//选择全部
        function CheckAll_Click()

 

cs:

using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Data.SqlClient;

public partial class _Default : System.Web.UI.Page 


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
c#调用WebService发布时间:2022-07-13
下一篇:
C#处理大量数据的技巧发布时间:2022-07-13
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap