日期:2014-05-17  浏览次数:20581 次

GridView动态删除行
搜了一大堆,没我想要的。我想实现在gridview中点击一行,按住shift,再点击任意一行,再点击删除按钮,整个范围的行都将被删除,我不是要全选删除那种。

谢谢。

------解决方案--------------------
探讨
这个实现起来还比较麻烦,需要用结合到JS与数据的保存(选中的行),以其这么麻烦还不如直接在每一行前面加上一个CheckBox来的实在

------解决方案--------------------
探讨
已经实现CheckBox,希望能做得更方便一点。

------解决方案--------------------
探讨
因为数据比较多,CheckBox还需要一个个点击,有点麻烦。

------解决方案--------------------
探讨
引用:
因为数据比较多,CheckBox还需要一个个点击,有点麻烦。

你可以做个全选与反选功能。
即使可以使用SHift键,但是如果数据不在一起,一样需要一个个点。

------解决方案--------------------
SHift+鼠标 你还不是一个一个点的,
------解决方案--------------------
探讨
因为数据比较多,CheckBox还需要一个个点击,有点麻烦。

------解决方案--------------------
探讨

引用:
已经实现CheckBox,希望能做得更方便一点。

出发点是好的,但是一般用户习惯是在Winform下使用Shift健,而Web中,CheckBox是比较实用的

------解决方案--------------------
用js取行标识: 
[1]先保存单独click的行标,
[2]如果shift + click (判断shift键的keycode), 取到这次click的行标.
[3]2个行标对比,判断区间方向, 遍历区间行,保存选中的行标, 点[删除]时在后台删除
------解决方案--------------------

JS实现shift + click
JScript code
<html>
<head>
    <script type="text/javascript" src="http://localhost/mycenter/js/jquery-1.4.min.js"></script>
    <script type="text/javascript">
        // 单选
        function single_click(){
            $("body *").click(function(e){        
                $(".selected").removeClass("selected");
                $(e.target).addClass("selected");
            });
        }
        // 多选
        function shift_click(){
            // 这里怎么写?只要按shift 再左键单击就能多选一个.selected
        }
        $(function(){
            single_click();
            shift_click();
        });
    </script>
    <style type="text/css">
        .selected{background:green;}
    </style>
</head>
<body>
    <p>I am p</p>
    <span>I am span</span>
    <div> I am div</div>
</body>
</html>

------解决方案--------------------
HTML code

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<style type="text/css">
    tr.selected { background: blue; color: white} /* 选中的行用蓝底白字显示 */
</style>

<asp:GridView ID="GridView1" runat="server">
</asp:GridView>

<!-- 隐藏域存放选中的行号,用逗号隔开 -->
<asp:HiddenField ID="SelectedRows" runat="server" EnableViewState="false" />

<script type="text/javascript">
    $(function() {
        var $gv = $('#GridView1'), $rows = $('#SelectedRows'); // GridView和SelectedRows控件
        var headerRows = <%= GridView1.ShowHeader? 1 : 0 %>; // 标题行数
        $gv.find('tr').click(function(evt) {
            $gv.find('tr').removeClass('selected');
            if (!evt.shiftKey || !$rows.val()) {
                $(this).addClass('selected');
                $rows.val(this.rowIndex - headerRows);
            }
            else {
                var first = Number($rows.val().split(',')[0])+headerRows, last = this.rowIndex, rows = [];
                for (var i = 0, index = first; i <= Math.abs(first - last); i++) {
                    $gv.find('tr:eq(' + index + ')').addClass('selected');