iT邦幫忙

1

[jQuery]ASP.NET GridView 凍結窗格

  • 分享至 

  • xImage
  •  

透過 jQuery特效,將 GridView的標題欄位「凍結窗格」

有位學員找到這個很棒的範例
http://gridviewscroll.aspcity.idv.tw/

感謝原作者無私分享,非常實用的好範例!
原作的網站 http://gridviewscroll.aspcity.idv.tw/

因為原作網站只提供HTML檔(執行後的原始碼)
所以我提供兩種作法,可以搭配 ASP.NET (Web Form) GridView

方法一:透過RowDataBound事件來處理

方法二:直接把CSS加入表頭(標題)欄位&資料列的「CssClass」屬性

不過,我們都需要事先觀察原作的範例是怎麼做的?
才能把必要的元素,加入自己的ASP.NET控制項裡面

可以看見表格的「表頭」加上了這一段 class="GridviewScrollHeader"
資料列裡面放入這一段 class="GridviewScrollItem"

<table cellspacing="0" id="GridView1" style="width:100%;border-collapse:collapse;">
<tr class="GridviewScrollHeader">
<td colspan="2">Product</td><td rowspan="2">ListPrice</td><td rowspan="2">StandardCost</td><td colspan="2">Package</td><td rowspan="2">SafetyStockLevel</td><td rowspan="2">ReorderPoint</td><td rowspan="2">SellStartDate</td>
</tr><tr class="GridviewScrollHeader">
<td>Name</td><td>Number</td><td>Weight</td><td>Size</td>
 
</tr><tr  class="GridviewScrollItem">
&lt;td style="background-color:#EFEFEF;">HL Mountain Frame - Black, 38&lt;/td>&lt;td style="background-color:#EFEFEF;">FR-M94B-38&lt;/td><td>1349.6000</td><td>739.0410</td><td>2.68</td><td>38</td><td>500</td><td>375</td><td>7/1/2005 12:00:00 AM</td> 
</tr><tr  class="GridviewScrollItem">
&lt;td style="background-color:#EFEFEF;">HL Mountain Frame - Silver, 38&lt;/td>&lt;td style="background-color:#EFEFEF;">FR-M94S-38&lt;/td><td>1364.5000</td><td>747.2002</td><td>2.68</td><td>38</td><td>500</td><td>375</td><td>7/1/2005 12:00:00 AM</td>
</tr><tr class="GridviewScrollItem">
<td........>
</table>

文章較長,詳見全文:
[jQuery]將您的表格或GridView固定標題列與凍結欄位 (gridviewscroll.aspcity.idv.tw)

http://www.dotblogs.com.tw/mis2000lab/archive/2015/09/30/153463.aspx


圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中
0
mis2000lab
iT邦好手 1 級 ‧ 2015-10-01 15:13:55

原PO提供的範例,只有HTML(執行後的原始碼)

因為讀者不會套用到 .aspx檔裡面
所以我提供了兩種作法給他參考

我甚至沒有公開範例給大家下載,要大家去原作者下載「原作提供的CSS與JS檔」

這樣也是「抄」喔???
這樣也是「抄」喔???
這樣也是「抄」喔???
這樣也是「抄」喔???
這樣也是「抄」喔???

我敢打賭,您看都不看就開罵了對吧

0
mis2000lab
iT邦好手 1 級 ‧ 2015-10-01 15:39:04

謝謝您的指證。

但我在原作網站上看見的超連結
為什麼沒有看見您的畫面(有.aspx.cs)

我在這兩個網址,或是下載,都只有 .htm檔而已
http://gridviewscroll.aspcity.idv.tw/
https://github.com/twlikol/GridViewScroll

所以我是從他的HTML結果檔,搭配我的書籍講到的技巧
把這功能放進GridView

如果原作真的有提供 .aspx的作法,我願意在文章中補充出來
也會感謝您的提醒 :-)

至於MVP是否得「獨創」,這點我就不清楚了,達不到您的希望,實在不好意思

我看見了,在「案例展示」裡面,的確有。
謝謝您。

我會在文章中提及這件事,也會感謝您的指證。

0
mis2000lab
iT邦好手 1 級 ‧ 2015-10-02 13:56:26

謝謝網友的指證
如果您有"明白"的建議與說明,我都虛心受教

關於「抄襲」這樣的指控,我也發信給原作者請教,
如下圖:

希望為這件事做一個完結。
謝謝

我要留言

立即登入留言