大雀软件园

首页 软件下载 安卓市场 苹果市场 电脑游戏 安卓游戏 文章资讯 驱动下载
技术开发 网页设计 图形图象 数据库 网络媒体 网络安全 站长CLUB 操作系统 媒体动画 安卓相关
当前位置: 首页 -> 技术开发 -> NET专区 -> 如何在DataGrid里面产生滚动条而不滚动题头

如何在DataGrid里面产生滚动条而不滚动题头

时间: 2021-07-31 作者:daque

咱们在开拓的功夫确定遇到,运用datagrid的功夫因为不想分页(数据没有那么多)然而又表露不在一页内里,此时咱们蓄意在datagrid内里展示一个震动条,不妨左右震动datagrid内里的数据而不必左右震动页面,因为写正文的手段是为了证明怎样实行,以是对于详细性的题目读者群不妨本人推敲实行(比方:既要分页又要震动之类)。为了不妨震动datagrid咱们须要一个不妨让存户端的table震动js剧本(该js代码我是从codeproject上头载入的),但又不许震动table的题头(也即是第一条龙)。咱们都领会datagrid在证明到存户端此后将会天生一个table,然而这个table是由<tr><td>构成的,咱们的剧本内里是须要运用到table的thead和tbody的(在大普遍的存户端的运用中都要用到此功效比方:存户端的排序、以及列的托拽之类),所以咱们接下来的工作即是怎样为咱们存户端的这个datagrid增添<thead><tbody>了。即使你对用户的自设置控件以及asp.net页面包车型的士道理有所领会,咱们领会控件结果都是要表露(render)在页面上的,所以咱们不妨重写这个本领来实行datagrid的自设置表露。听一听真的有些吓人,那么搀杂的控件如何表露?不要焦躁,开始咱们创造一个自设置控件如次所示:public class powerdatagrid : system.web.ui.webcontrols.datagrid 由此不妨看出咱们的控件是接受于datagrid的,以是咱们此刻的这个控件在不必写一条龙代码的情景下咱们的这个控件仍旧具备datagrid的一切的功效。接下来咱们要将咱们筹备的js代码内嵌到咱们的控件里,好让放这个控件的页面上最后在存户端城市有这段js代码用来实行咱们震动的工作。为了实行这个处事咱们要重写预表露的本领: protected override void onprerender(system.eventargs e) { base.onprerender(e); resourcemanager manager = new resourcemanager( this.gettype() ); resourceset resources = manager.getresourceset(system.globalization.cultureinfo.currentculture, true, true); if( !page.isclientscriptblockregistered( "skysword.webcontrol.powerdatagrid library" ) ) { string script = resources.getstring("scrolltable"); this.page.registerclientscriptblock("skysword.webcontrol.powerdatagrid library", script ); this.page.registerstartupscript("skysword.webcontrols.powerdatagrid init", "<script>makescrollabletable('"+this.id+"',true,'auto');</script>" ); } } 在该本领中咱们考察了资源文献。哦!忘了说咱们还要创造一个资源文献,用来生存咱们的js代码。咱们开始将资源代码中对应scrolltable的数据(一段js剧本)备案到存户端的剧本块里。结果咱们为了不妨初始化,将<script>makescrollabletable('"+this.id+"',true,'auto');</script>段剧本备案到页面加载时发端实行(我想就该当和body内里onload的本领一律吧)。当你须要加载存户端剧本的功夫运用该本领是个不错的采用。好了,存户端剧本也有了,剩下的即是处置咱们的存户端datagrid了(也即是datagrid表露的存户端table)。为了不妨表露咱们本人的datagrid咱们须要重写表露本领如次所示:protected override void render(htmltextwriter output) { output.write(this.parsemarkup()); } 个中挪用了一个parsemarkup的因变量,改因变量将爆发一个输入的剧本(字符串),该剧本即是一个包括thead和tbody的table。因为此本领不过由该控件本人运用以是咱们将它树立成独占的代码如次: private string parsemarkup(){ // 插入thead标签和tbody标签 stringwriter writer = new stringwriter(); htmltextwriter buffer = new htmltextwriter(writer); base.render(buffer); string pmarkup = writer.tostring(); // 找到第一个table标签的结果也即是第一个>字符 pmarkup = pmarkup.insert(pmarkup.indexof(">") + ">".length, "<thead>"); // 将第一个tr闭区间用thead包起来,此刻第一个<thead>仍旧画出来了须要画 // 它的结果</thead>和</tbody>,同样找到第一个</tr>来插入</thead>和</tdoby> pmarkup = pmarkup.insert( pmarkup.indexof("</tr>") + "</tr>".length,"</thead><tbody>"); // 在结果一个的前方插入一个</tbody>就不妨了。 pmarkup = pmarkup.replace("", "</tbody>"); return pmarkup; } 在这个本领中咱们开始范例化了一个stringwriter的东西writer,又用该东西为参数范例了一个htmltextwriter东西buffer,最要害的是咱们挪用了基类的render用来将buffer内里填满要输入的货色(一堆剧本即是table,即使你是用监督器察看内里的实质就不妨看到)。好了剩下的处事即是领会这个剧本了,而后咱们在该剧本第一个展示<tr>的场合将这个<tr>替代成<thead>和<tr>反面的替代本领一致。结果咱们将这个被咱们替代和窜改的table输入到存户端,十足ok!提防:用到stringwriter的因为即是它不妨从buffer内里生存原始的字符比方:/t/n什么的。 资源文献的摆设本领:开始给你的工程增添一个资源文献,名字和你的控件一律,而后在该文献中增添一下末节 <data name="scrolltable"> <value><![cdata[ <script language = 'javascript'> var container = new array();var onresizehandler;function scrollbarwidth(){ var w; if (! document.body.currentstyle) document.body.currentstyle = document.body.style; if (document.body.currentstyle.overflowy == 'visible' || document.body.currentstyle.overflowy == 'scroll'){ w = document.body.offsetwidth - document.body.clientleft - document.body.clientwidth; }else{ win = window.open("about:blank", "_blank", "top=0,left=0,width=100,height=100,scrollbars=yes"); win.document.writeln('scrollbar'); w = win.document.body.offsetwidth - win.document.body.clientleft - win.document.body.clientwidth; win.close(); } return w;}function getactualwidth(e){ if (! e.currentstyle) e.currentstyle = e.style; return e.clientwidth - parseint(e.currentstyle.paddingleft) - parseint(e.currentstyle.paddingright);}function findrowwidth(r){ for (var i=0; i < r.length; i++){ r[i].actualwidth = getactualwidth(r[i]); }}function setrowwidth(r){ for (var i=0; i < r.length; i++){ r[i].width = r[i].actualwidth; r[i].innerhtml = '<span style="width:' + r[i].actualwidth + ';">' + r[i].innerhtml + '</span>'; }}function fixtablewidth(tbl){ for (var i=0; i < tbl.thead.rows.length; i++) findrowwidth(tbl.thead.rows[i].cells); findrowwidth(tbl.tbodies[0].rows[0].cells); if (tbl.tfoot) for (var i=0; i < tbl.tfoot.rows.length; i++) findrowwidth(tbl.tfoot.rows[i].cells); //tbl.width = ''; for (var i=0; i < tbl.thead.rows.length; i++) setrowwidth(tbl.thead.rows[i].cells); setrowwidth(tbl.tbodies[0].rows[0].cells); if (tbl.tfoot) for (var i=0; i < tbl.tfoot.rows.length; i++) setrowwidth(tbl.tfoot.rows[i].cells);}function makescrollabletable(tbl,scrollfooter,height){ var c, pnode, hdr, ftr, wrapper, rect; if (typeof tbl == 'string') tbl = document.getelementbyid(tbl); pnode = tbl.parentnode; fixtablewidth(tbl); c = container.length; container[c] = document.createelement('<span style="height: 100; overflow: auto;">'); container[c].id = tbl.id + "container"; pnode.insertbefore(container[c], tbl); container[c].appendchild(tbl); container[c].style.width = tbl.clientwidth + 2 * tbl.clientleft + scrollbarwidth(); hdr = tbl.clonenode(false); hdr.id += 'header'; hdr.appendchild(tbl.thead.clonenode(true)); tbl.thead.style.display = 'none'; if (!scrollfooter || !tbl.tfoot){ ftr = document.createelement('<span style="width:1;height:1;clip: rect(0 1 1 0);background-color:transparent;">'); ftr.id = tbl.id + 'footer'; ftr.style.border = tbl.style.border; ftr.style.width = getactualwidth(tbl) + 2 * tbl.clientleft; ftr.style.borderbottom = ftr.style.borderleft = ftr.style.borderright = 'none'; }else{ ftr = tbl.clonenode(false); ftr.id += 'footer'; ftr.appendchild(tbl.tfoot.clonenode(true)); ftr.style.bordertop = 'none'; tbl.tfoot.style.display = 'none'; } wrapper = document.createelement('<table border=0 cellspacing=0 cellpadding=0>'); wrapper.id = tbl.id + 'wrapper'; pnode.insertbefore(wrapper, container[c]); wrapper.insertrow(0).insertcell(0).appendchild(hdr); wrapper.insertrow(1).insertcell(0).appendchild(container[c]); wrapper.insertrow(2).insertcell(0).appendchild(ftr); wrapper.align = tbl.align; tbl.align = hdr.align = ftr.align = 'left'; hdr.style.borderbottom = 'none'; tbl.style.bordertop = tbl.style.borderbottom = 'none'; // adjust page size if (c == 0 && height == 'auto'){ onresizeadjusttable(); onresizehandler = window.onresize; window.onresize = onresizeadjusttable; }else{ container[c].style.height = height; }}function onresizeadjusttable(){ if (onresizehandler) onresizehandler(); var rect = container[0].getclientrects()(0); var h = document.body.clientheight - (rect.top + (document.body.scrollheight - rect.bottom)); container[0].style.height = (h > 0) ? h : 1;}function printpage(){ var tbs = document.getelementsbytagname('table'); var e; for (var i=0; i < container.length; i++) container[i].style.overflow = ''; window.print(); for (var i=0; i < container.length; i++) container[i].style.overflow = 'auto';} </script> ]]></value> </data> 好了,如许就不妨实行了。运用该本领不妨实行存户端的排序和托拽功效,只有你找到相映的js代码(大概本人写)而后运用本法领会你的存户端代码,结果将你的datagrid的输入定位成你想要的截止,十足就ok了!因为功夫联系该控件分页和震动不许同声,蓄意有爱好的网友不妨实行之。我在写此作品的手段旨在举一反三的效率,蓄意对大师的编制程序本领有所普及和扶助。感谢观赏!有什么题目大概好的倡导请

热门阅览

最新排行

Copyright © 2019-2021 大雀软件园(www.daque.cn) All Rights Reserved.