满分求解-关于GridView的行高亮问题

maozaiyipang 2009-12-02 09:31:05
GRIDVIEW

要实现的功能是

单击：单击某一行 高亮显示,单击另一行 之前一行取消高亮，当前行高亮

CTRL+单击：单击过的行都高亮显示

SHIFT+单击：单击过的两行 之间的所有行高亮显示



其实说穿了就是类似windows的文件操作那种的功能

哪位高手指点下怎么做？

当然有代码最好

小弟拜谢！
...全文
412 20 打赏 收藏 转发到动态 举报
写回复
用AI写文章
20 条回复
切换为时间正序
请发表友善的回复…
发表回复
l171147904 2009-12-04
  • 打赏
  • 举报
 回复
再 onclick 事件 的 写，，，取到所有高亮行的 ID！！！
protected void gv_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{

e.Row.Attributes.Add("onclick", "row_click(this)");

}

}

function row_click(Row)
{
这ROW是被你点击后 高亮的行！ row.cells[0].innerHTML //取 主键
}
这里还有一问题，你必须 编辑 GRIDVIEW的所有行，判断 是否高亮！（你用SHIFT拉的高亮）
高亮就取值，最后把值 串起来，赋值给隐藏控件，后台取值 删除就好！
tkscascor 2009-12-04
  • 打赏
  • 举报
 回复
学习!
sohighthesky 2009-12-04
  • 打赏
  • 举报
 回复
[Quote=引用 14 楼 maozaiyipang 的回复:]


我如何让两个GV的行同时都具有变色功能？


还有一点是 选中的高亮行将来客户可能需要做一个删除的操作 如何捕捉已经高亮行的ID？
[/Quote]
1.把那个写到一个方法里，传入gridview的id
2.遍历tb，获取className为hl的
maozaiyipang 2009-12-04
  • 打赏
  • 举报
 回复
但是客户是这么要求的。。

哎

我再自己试下好了

maozaiyipang 2009-12-04
  • 打赏
  • 举报
 回复
[Quote=引用 17 楼 sohighthesky 的回复:]
引用 14 楼 maozaiyipang 的回复:


我如何让两个GV的行同时都具有变色功能？


还有一点是 选中的高亮行将来客户可能需要做一个删除的操作 如何捕捉已经高亮行的ID？

1.把那个写到一个方法里，传入gridview的id
2.遍历tb，获取className为hl的
[/Quote]


1,写到一个方法里，那应该只能分别高亮的吧 由于两个gridview是放在一起的v,看起来好像是一个的，所以之前我也没注意到- -

2，我再试下
maozaiyipang 2009-12-03
  • 打赏
  • 举报
 回复
sohighthesky前辈的JS的确是能实现我要的功能的

但是稍稍两点不明白

由于我这边是两个GV

如图


我如何让两个GV的行同时都具有变色功能？



还有一点是 选中的高亮行将来客户可能需要做一个删除的操作 如何捕捉已经高亮行的ID？
rczjp 2009-12-03
  • 打赏
  • 举报
 回复
[Quote=引用 14 楼 maozaiyipang 的回复:]
sohighthesky前辈的JS的确是能实现我要的功能的

但是稍稍两点不明白

由于我这边是两个GV

如图


我如何让两个GV的行同时都具有变色功能？


还有一点是 选中的高亮行将来客户可能需要做一个删除的操作 如何捕捉已经高亮行的ID？
[/Quote]删除都是复选框选中删除哦
rczjp 2009-12-02
  • 打赏
  • 举报
 回复 
window.onload=function() {

    var lastIndex=-1;

    var tb=document.getElementById("setTbl");

    for(var i=1;i<tb.rows.length;i++) {//从1开始，假设有列头

        (function(row,i){

            row.onclick=function(e) {

                e=window.event ||e;

                e.cancelBubble = true;

                if(e.shiftKey) {

                    if(lastIndex==-1) {

                        this.className="hl";

                        lastIndex=this.rowIndex;

                    }else if(lastIndex==this.rowIndex) {

                        this.className="";lastIndex=-1;

                    } else {

                        var start=Math.min(this.rowIndex,lastIndex);

                        var end=Math.max(this.rowIndex,lastIndex);

                        for(var i=start;i<end;i++) {

                            tb.rows[i].className="hl";

                        }

                        lastIndex=this.rowIndex;

                    }

                }else if(e.ctrlKey) {

                    this.className="hl";

                } else  {

                    for(var i=0;i<tb.rows.length;i++) {

                            tb.rows[i].className="";

                    }

                    this.className="hl";

                    lastIndex=this.rowIndex;

                }

            }

        })(tb.rows[i],i);

    }    

}
呵呵我这样调用？
rczjp 2009-12-02
  • 打赏
  • 举报
 回复
[Quote=引用 9 楼 sohighthesky 的回复:]
去吃了会饭，终于ok
CSS code
.hl,.hl a{background-color:#326496;color:#FFFFFF;}
将下面的代码放在body后面,注意gridview的id
JScript code
(function() {var lastIndex=-1;var tb=document.getElementById("tb1");//表格的id可以写成"<%=GridView1.ClientID%>"for(var i=1;i<tb.rows.length;i++) {//从1开始，假设有列头 (function(row,i){
row.onclick=function(e) {
e=window.event||e;
e.cancelBubble=true;if(e.shiftKey) {if(lastIndex==-1) {this.className="hl";
lastIndex=this.rowIndex;
}elseif(lastIndex==this.rowIndex) {this.className="";lastIndex=-1;
}else {var start=Math.min(this.rowIndex,lastIndex);var end=Math.max(this.rowIndex,lastIndex);for(var i=start;i<end;i++) {
tb.rows[i].className="hl";
}
lastIndex=this.rowIndex;
}
}elseif(e.ctrlKey) {this.className="hl";
}else {for(var i=0;i<tb.rows.length;i++) {
tb.rows[i].className="";
}this.className="hl";
lastIndex=this.rowIndex;
}
}
})(tb.rows[i],i);
}
})();
[/Quote]嗯 高手呵呵，不过怎么调用，我试了好像不行
maozaiyipang 2009-12-02
  • 打赏
  • 举报
 回复
谢谢楼上前辈

明天上班试下 先睡觉.

sohighthesky 2009-12-02
  • 打赏
  • 举报
 回复
去吃了会饭，终于ok


	.hl,.hl a {background-color:#326496;color:#FFFFFF;}

将下面的代码放在body后面,注意gridview的id


(function() {

    var lastIndex=-1;

    var tb=document.getElementById("tb1");//表格的id可以写成"<%=GridView1.ClientID%>"

    for(var i=1;i<tb.rows.length;i++) {//从1开始，假设有列头

        (function(row,i){

            row.onclick=function(e) {

                e=window.event ||e;

                e.cancelBubble = true;

                if(e.shiftKey) {

                    if(lastIndex==-1) {

                        this.className="hl";

                        lastIndex=this.rowIndex;

                    }else if(lastIndex==this.rowIndex) {

                        this.className="";lastIndex=-1;

                    } else {

                        var start=Math.min(this.rowIndex,lastIndex);

                        var end=Math.max(this.rowIndex,lastIndex);

                        for(var i=start;i<end;i++) {

                            tb.rows[i].className="hl";

                        }

                        lastIndex=this.rowIndex;

                    }

                }else if(e.ctrlKey) {

                    this.className="hl";

                } else  {

                    for(var i=0;i<tb.rows.length;i++) {

                            tb.rows[i].className="";

                    }

                    this.className="hl";

                    lastIndex=this.rowIndex;

                }

            }

        })(tb.rows[i],i);

    }    

})();
rczjp 2009-12-02
  • 打赏
  • 举报
 回复 
var currTR=this;

    function overTR(){

    var trs = document.getElementById("setTbl").getElementsByTagName("tr");

    for(var i in trs){

        trs[i].onmouseover = function(){

        var oldBgColor=this.bgColor;

        var oldFontColor=this.style.color;

        this.bgColor = "#0000FF";

        this.style.color="#FFFFFF";

        if(currTR != this&&currTR.tagName=="TR"){currTR.bgColor = oldBgColor; currTR.style.color=oldFontColor;}

        currTR = this;

            }

        }

    }

    window.onload = function(){overTR();}
JS的行高亮
CTRL+单击
不是有个什么 ctrlkey&click 调用函数就可以了 呵呵 没有试过 我去试试
diandian82 2009-12-02
  • 打赏
  • 举报
 回复
Jquery简单，定义好css只要几句话
<script type="text/javascript">
$(function() {
$("#tblName tr:gt(0):odd").attr("class", "odd");
$("#tblName tr:gt(0):even").attr("class", "even");


$("#tblName tr:gt(0)").hover(function() {
$(this).addClass('mouseover');
}, function() {
$(this).removeClass('mouseover');
});
})
</script>
sohighthesky 2009-12-02
  • 打赏
  • 举报
 回复
[Quote=引用 5 楼 maozaiyipang 的回复:]
恩 其实第一个我也会..

就是后两个..实在有点麻烦.
[/Quote]
wait，80分我接下了
maozaiyipang 2009-12-02
  • 打赏
  • 举报
 回复
恩 其实第一个我也会..

就是后两个..实在有点麻烦.
njlywy 2009-12-02
  • 打赏
  • 举报
 回复
学习下
koukoujiayi 2009-12-02
  • 打赏
  • 举报
 回复
第一的个问题还是简单的,关键是后两个问题:

CTRL+单击：单击过的行都高亮显示
SHIFT+单击：单击过的两行 之间的所有行高亮显示

这两个问题有难度,楼上答的都是第一个问题!!!!
lijing3333 2009-12-02
  • 打赏
  • 举报
 回复
protected void gv_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
e.Row.Attributes.Add("OnMouseOut", "this.style.backgroundColor='';this.style.color=''");
e.Row.Attributes.Add("OnMouseOver", "this.style.backgroundColor='#50638D';this.style.color='#FFFFFF'");

这个比较简单咯。。 也好理解
wuyq11 2009-12-02
  • 打赏
  • 举报
 回复
protected void gv_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
e.Row.Attributes.Add("OnMouseOut", "this.style.backgroundColor='';this.style.color=''");
e.Row.Attributes.Add("OnMouseOver", "this.style.backgroundColor='#50638D';this.style.color='#FFFFFF'");
e.Row.Attributes.Add("onclick", "style.backgroundColor='red");

}

}

或
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
e.Row.Attributes.Add("onMouseOver", "SetNewColor(this);");
e.Row.Attributes.Add("onMouseOut", "SetOldColor(this);");
}
}
var _oldColor;
function SetNewColor(source)
{
_oldColor=source.style.backgroundColor;
source.style.backgroundColor='#E8F4FF';
}
function SetOldColor(source)
{
source.style.backgroundColor=_oldColor;
}

.Row.Attributes.Add("onclick", "tog(this,'#00A9FF');
var tgs;
function tog(n,flags)
{
if(tgs)
{
tgs.style.background='';
}
n.style.background='';
tgs=n;
}
GriView设置行高
间接的给GridView设置行高,这样就可以把显示的内容全部显示出来,不需要考虑覆盖不覆盖的问题.
android Gridview分页实现
android Gridview分页实现的一个小例子
flutter仿抖音首页面效果
本课程将使用 flutter 实现类似抖音首页面效果 通过 TabBar 与 TabBarView 结合使用 实现仿抖音APP首页面 关注 与推荐 页面左右滑动ui构建通过 PageView 来实现上下整屏切换效果使用 VideoPlayer组件实现视频播放功能通过 CircularProgressIndicator实现 有圆形背景样式的按钮浮在视频列表上方来实现控制视频的播放与暂停，并会综述一个 Align 在手机坐标系中的对齐方式通过 ClipOval、CachedNetworkImage 实现圆形头像通过 showModalBottomSheet 实现从页面底部上滑的弹框，结合 ListView 实现弹框显示评论列表功能通过 showModalBottomSheet 实现从页面底部上滑的弹框，结合 GridView 实现弹框显示九宫格列表功能
RecyclerView实现可拖拽的GridView
ItemTouchHelper实现： 使用RecyclerView打造可拖拽的GridView
Android 打造万能的ListView GridView 适配器
代码为博客示例代码：http://blog.csdn.net/lmj623565791/article/details/38902805 有问题请博客留言
.NET社区

62,067

社区成员

669,038

社区内容

发帖
与我相关
我的任务
社区描述
.NET技术交流专区
javascript云原生 企业社区
社区管理员
  • ASP.NET
  • .Net开发者社区
  • R小R
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告

.NET 社区是一个围绕开源 .NET 的开放、热情、创新、包容的技术社区。社区致力于为广大 .NET 爱好者提供一个良好的知识共享、协同互助的 .NET 技术交流环境。我们尊重不同意见，支持健康理性的辩论和互动，反对歧视和攻击。

希望和大家一起共同营造一个活跃、友好的社区氛围。

试试用AI创作助手写篇文章吧

+ 用AI写文章