Voll Young 9 gadi atpakaļ
vecāks
revīzija
dee10e1644
10 mainītis faili ar 6109 papildinājumiem un 0 dzēšanām
  1. 245 0
      .gitignore
  2. 139 0
      App_Code/ScrollerTable.cs
  3. 40 0
      Default.aspx
  4. 51 0
      Default.aspx.cs
  5. 40 0
      StyleSheet.css
  6. 31 0
      Web.Debug.config
  7. 15 0
      Web.config
  8. 1812 0
      demo.html
  9. 19 0
      script/jquery-1.8.2.min.js
  10. 3717 0
      script/jquery.nicescroll.js

+ 245 - 0
.gitignore

@@ -0,0 +1,245 @@
+## Ignore Visual Studio temporary files, build results, and
+## files generated by popular Visual Studio add-ons.
+
+# User-specific files
+*.suo
+*.user
+*.userosscache
+*.sln.docstates
+
+# User-specific files (MonoDevelop/Xamarin Studio)
+*.userprefs
+
+# Build results
+[Dd]ebug/
+[Dd]ebugPublic/
+[Rr]elease/
+[Rr]eleases/
+[Xx]64/
+[Xx]86/
+[Bb]uild/
+bld/
+[Bb]in/
+[Oo]bj/
+
+# Visual Studio 2015 cache/options directory
+.vs/
+# Uncomment if you have tasks that create the project's static files in wwwroot
+#wwwroot/
+
+# MSTest test Results
+[Tt]est[Rr]esult*/
+[Bb]uild[Ll]og.*
+
+# NUNIT
+*.VisualState.xml
+TestResult.xml
+
+# Build Results of an ATL Project
+[Dd]ebugPS/
+[Rr]eleasePS/
+dlldata.c
+
+# DNX
+project.lock.json
+artifacts/
+
+*_i.c
+*_p.c
+*_i.h
+*.ilk
+*.meta
+*.obj
+*.pch
+*.pdb
+*.pgc
+*.pgd
+*.rsp
+*.sbr
+*.tlb
+*.tli
+*.tlh
+*.tmp
+*.tmp_proj
+*.log
+*.vspscc
+*.vssscc
+.builds
+*.pidb
+*.svclog
+*.scc
+
+# Chutzpah Test files
+_Chutzpah*
+
+# Visual C++ cache files
+ipch/
+*.aps
+*.ncb
+*.opendb
+*.opensdf
+*.sdf
+*.cachefile
+*.VC.db
+
+# Visual Studio profiler
+*.psess
+*.vsp
+*.vspx
+*.sap
+
+# TFS 2012 Local Workspace
+$tf/
+
+# Guidance Automation Toolkit
+*.gpState
+
+# ReSharper is a .NET coding add-in
+_ReSharper*/
+*.[Rr]e[Ss]harper
+*.DotSettings.user
+
+# JustCode is a .NET coding add-in
+.JustCode
+
+# TeamCity is a build add-in
+_TeamCity*
+
+# DotCover is a Code Coverage Tool
+*.dotCover
+
+# NCrunch
+_NCrunch_*
+.*crunch*.local.xml
+nCrunchTemp_*
+
+# MightyMoose
+*.mm.*
+AutoTest.Net/
+
+# Web workbench (sass)
+.sass-cache/
+
+# Installshield output folder
+[Ee]xpress/
+
+# DocProject is a documentation generator add-in
+DocProject/buildhelp/
+DocProject/Help/*.HxT
+DocProject/Help/*.HxC
+DocProject/Help/*.hhc
+DocProject/Help/*.hhk
+DocProject/Help/*.hhp
+DocProject/Help/Html2
+DocProject/Help/html
+
+# Click-Once directory
+publish/
+
+# Publish Web Output
+*.[Pp]ublish.xml
+*.azurePubxml
+
+# TODO: Un-comment the next line if you do not want to checkin 
+# your web deploy settings because they may include unencrypted
+# passwords
+#*.pubxml
+*.publishproj
+
+# NuGet Packages
+*.nupkg
+# The packages folder can be ignored because of Package Restore
+**/packages/*
+# except build/, which is used as an MSBuild target.
+!**/packages/build/
+# Uncomment if necessary however generally it will be regenerated when needed
+#!**/packages/repositories.config
+# NuGet v3's project.json files produces more ignoreable files
+*.nuget.props
+*.nuget.targets
+
+# Microsoft Azure Build Output
+csx/
+*.build.csdef
+
+# Microsoft Azure Emulator
+ecf/
+rcf/
+
+# Microsoft Azure ApplicationInsights config file
+ApplicationInsights.config
+
+# Windows Store app package directory
+AppPackages/
+BundleArtifacts/
+
+# Visual Studio cache files
+# files ending in .cache can be ignored
+*.[Cc]ache
+# but keep track of directories ending in .cache
+!*.[Cc]ache/
+
+# Others
+ClientBin/
+[Ss]tyle[Cc]op.*
+~$*
+*~
+*.dbmdl
+*.dbproj.schemaview
+*.pfx
+*.publishsettings
+node_modules/
+orleans.codegen.cs
+
+# RIA/Silverlight projects
+Generated_Code/
+
+# Backup & report files from converting an old project file
+# to a newer Visual Studio version. Backup files are not needed,
+# because we have git ;-)
+_UpgradeReport_Files/
+Backup*/
+UpgradeLog*.XML
+UpgradeLog*.htm
+
+# SQL Server files
+*.mdf
+*.ldf
+
+# Business Intelligence projects
+*.rdl.data
+*.bim.layout
+*.bim_*.settings
+
+# Microsoft Fakes
+FakesAssemblies/
+
+# GhostDoc plugin setting file
+*.GhostDoc.xml
+
+# Node.js Tools for Visual Studio
+.ntvs_analysis.dat
+
+# Visual Studio 6 build log
+*.plg
+
+# Visual Studio 6 workspace options file
+*.opt
+
+# Visual Studio LightSwitch build output
+**/*.HTMLClient/GeneratedArtifacts
+**/*.DesktopClient/GeneratedArtifacts
+**/*.DesktopClient/ModelManifest.xml
+**/*.Server/GeneratedArtifacts
+**/*.Server/ModelManifest.xml
+_Pvt_Extensions
+
+# LightSwitch generated files
+GeneratedArtifacts/
+ModelManifest.xml
+
+# Paket dependency manager
+.paket/paket.exe
+
+# FAKE - F# Make
+.fake/

+ 139 - 0
App_Code/ScrollerTable.cs

@@ -0,0 +1,139 @@
+using System;
+using System.Collections.Generic;
+using System.Data;
+using System.Linq;
+using System.Text;
+using System.Web;
+
+/// <summary>
+/// Summary description for ScrollerTable
+/// </summary>
+public class ScrollerTable
+{
+    public ScrollerTable()
+    {
+    }
+
+    /// <summary>
+    /// 构造固定表头和固定列的table
+    /// </summary>
+    /// <param name="obj">数据表</param>
+    /// <param name="staticColCount">固定列数(需要固定的列要放在左边)</param>
+    /// <param name="widthPerCol">每列宽度</param>
+    /// <returns></returns>
+    public string GetScrollerTable(DataTable obj, int staticColCount, List<string> widthPerCol, int tableWidth, int tableHeight)
+    {
+        //活动表宽
+        string scrollerTableWidth = GetScrollerTbaleWidth(staticColCount, widthPerCol);
+        //活动div占屏幕宽度
+        string scrollerDivWidth = GetScrollerDivWidth(staticColCount, widthPerCol, tableWidth);
+
+        StringBuilder table = new StringBuilder();
+        table.Append("<div id='ScrollerTable'>");
+
+        #region 构造表头
+
+        table.Append("<div id='thead' style='display: flex;'>");
+
+        #region 构造固定列
+
+        if (staticColCount > 0)
+        {
+            table.Append("<div id='headLeft' style='display: inline-flex;'> <table cellpadding='0' cellspacing='0'> <tr>");
+            for (int i = 0; i < staticColCount; i++)
+            {
+                table.Append("<td style='width:" + widthPerCol[i] + "px;'>" + obj.Columns[i].ColumnName + "</td>");
+            }
+            table.Append("</tr></table></div>");
+        }
+
+        #endregion
+
+        #region 构造活动列
+
+        table.Append(" <div id='headRight' style='overflow: hidden; display: inline-flex;width:" + scrollerDivWidth + "px;'>");
+        table.Append(" <table cellpadding='0' cellspacing='0' style='width: " + scrollerTableWidth + "px; '><tr>");
+        for (int i = staticColCount; i < obj.Columns.Count; i++)
+        {
+            table.Append("<td style='width:" + widthPerCol[i] + "px;'>" + obj.Columns[i].ColumnName + "</td>");
+        }
+        table.Append(" </tr></table ></div> ");
+
+        #endregion
+
+        table.Append("</div>");
+
+        #endregion
+
+        #region 构造表主体
+
+        table.Append("<div id='tbody'>");
+
+        #region 构造固定列内容
+        if (staticColCount > 0)
+        {
+            table.Append("<div id='bodyLeft' style='display: inline-flex;overflow: hidden;height:" + tableHeight + "px;'> <table cellpadding='0' cellspacing='0'>");
+            foreach (DataRow row in obj.Rows)
+            {
+                table.Append("<tr>");
+                for (int i = 0; i < staticColCount; i++)
+                {
+                    table.Append("<td style='width:" + widthPerCol[i] + "px;'>" + row[i] + "</td>");
+                }
+                table.Append("</tr>");
+            }
+            table.Append("</table></div>");
+        }
+        #endregion
+
+        #region 构造活动列内容
+
+        table.Append("<div id='bodyRight' style='display: inline-flex;overflow: auto;height:" + tableHeight + "px;width:"+ scrollerDivWidth + "px; '>");
+        table.Append(" <table cellpadding='0' cellspacing='0' style='width: " + scrollerTableWidth + "px; '>");
+        foreach (DataRow row in obj.Rows)
+        {
+            table.Append("<tr>");
+            for (int i = staticColCount; i < obj.Columns.Count; i++)
+            {
+                table.Append("<td style='width:"+ widthPerCol[i] + "px;'>"+ row[i] + "</td>");
+            }
+            table.Append("</tr>");
+        }
+        table.Append("</table></div>");
+
+        #endregion
+
+        table.Append("</div>");
+
+        #endregion
+
+        table.Append("</div>");
+        return table.ToString();
+    }
+
+    /// <summary>
+    /// 获取活动表宽
+    /// </summary>
+    /// <param name="staticColCount"></param>
+    /// <param name="widthPerCol"></param>
+    /// <returns></returns>
+    private string GetScrollerTbaleWidth(int staticColCount, List<string> widthPerCol)
+    {
+        int width = 0;
+        for (int i = staticColCount; i < widthPerCol.Count; i++)
+        {
+            width += Convert.ToInt32(widthPerCol[i]);
+        }
+        return width.ToString();
+    }
+
+    private string GetScrollerDivWidth(int staticColCount, List<string> widthPerCol, int tableWidth)
+    {
+        int width = 0;
+        for (int i = 0; i < staticColCount; i++)
+        {
+            width += Convert.ToInt32(widthPerCol[i]);
+        }
+        return (tableWidth - width).ToString();
+    }
+}

+ 40 - 0
Default.aspx

@@ -0,0 +1,40 @@
+<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
+
+<!DOCTYPE html>
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head runat="server">
+    <title></title>
+    <script src="script/jquery-1.8.2.min.js"></script>
+    <script src="script/jquery.nicescroll.js"></script>
+    <style>
+        td {
+            border: 1px solid red;
+        }
+    </style>
+    <script type="text/javascript" language="javascript">
+
+        $(document).ready(function () {
+            $("#bodyRight").scroll(function (data) {
+                $("#headRight").scrollLeft($("#bodyRight").scrollLeft());
+                $("#bodyLeft").scrollTop($("#bodyRight").scrollTop());
+            });
+
+            $("#bodyRight").niceScroll({
+                cursorcolor: "#E62020",
+                cursoropacitymax: 1,
+                touchbehavior: false,
+                cursorwidth: "10px",
+                cursorborder: "0",
+                cursorborderradius: "5px"
+            });
+        });
+
+    </script>
+</head>
+<body>
+<div id="divTable" runat="server">
+    
+</div>
+</body>
+</html>

+ 51 - 0
Default.aspx.cs

@@ -0,0 +1,51 @@
+using System;
+using System.Collections.Generic;
+using System.Data;
+using System.Linq;
+using System.Web;
+using System.Web.UI;
+using System.Web.UI.WebControls;
+
+public partial class _Default : System.Web.UI.Page
+{
+    protected void Page_Load(object sender, EventArgs e)
+    {
+        DataTable dt = testTable();
+
+        List<string> colPerWidth=new List<string>();
+        for (int i = 0; i < 10; i++)
+        {
+            colPerWidth.Add("150");
+        }
+
+        ScrollerTable table = new ScrollerTable();
+        string html= table.GetScrollerTable(dt,1, colPerWidth,1000,600);
+
+        divTable.InnerHtml = html;
+    }
+
+
+    private DataTable testTable()
+    {
+        int colsCount = 10;
+        int rowsCount = 40;
+
+        DataTable dt =new DataTable();
+
+        for (int i = 0; i < colsCount; i++)
+        {
+            dt.Columns.Add("表头" + i);
+        }
+
+        for (int i = 0; i < rowsCount; i++)
+        {
+            DataRow row = dt.NewRow();
+            for (int j = 0; j < colsCount; j++)
+            {
+                row[j] = "第"+i+"行,内容" + j;
+            }
+            dt.Rows.Add(row);
+        }
+        return dt;
+    }
+}

+ 40 - 0
StyleSheet.css

@@ -0,0 +1,40 @@
+#scrollTable {
+  width:701px;
+  border: 1px solid #EB8;/*table没有外围的border,只有内部的td或th有border*/
+  background: #FF8C00;
+}
+ 
+ 
+#scrollTable table {
+  border-collapse:collapse; /*统一设置两个table为细线表格*/
+}
+ 
+#scrollTable table.thead{ /*表头*/
+  /*div的第一个子元素*/
+  width:100%;
+}
+ 
+#scrollTable table.thead th{/*表头*/
+  border: 1px solid #EB8;
+  border-right:#C96;
+  color:#fff;
+  background: #FF8C00;/*亮桔黄色*/
+}
+ 
+#scrollTable div{/*能带滚动条的表身*/
+  /*div的第二个子元素*/
+  width:100%;
+  height:200px;
+  overflow:auto;/*必需*/
+}
+ 
+#scrollTable table.tbody{/*能带滚动条的表身的正体*/
+  width:100%;
+  border: 1px solid #C96;
+  border-right:#B74;
+  color:#666666;
+  background: #ECE9D8;
+}
+#scrollTable table.tbody td{/*能带滚动条的表身的格子*/
+  border:1px solid #C96;
+}

+ 31 - 0
Web.Debug.config

@@ -0,0 +1,31 @@
+<?xml version="1.0" encoding="utf-8"?>
+
+<!-- For more information on using web.config transformation visit http://go.microsoft.com/fwlink/?LinkId=125889 -->
+
+<configuration xmlns:xdt="http://schemas.microsoft.com/XML-Document-Transform">
+  <!--
+    In the example below, the "SetAttributes" transform will change the value of 
+    "connectionString" to use "ReleaseSQLServer" only when the "Match" locator 
+    finds an attribute "name" that has a value of "MyDB".
+    
+    <connectionStrings>
+      <add name="MyDB" 
+        connectionString="Data Source=ReleaseSQLServer;Initial Catalog=MyReleaseDB;Integrated Security=True" 
+        xdt:Transform="SetAttributes" xdt:Locator="Match(name)"/>
+    </connectionStrings>
+  -->
+  <system.web>
+    <compilation xdt:Transform="RemoveAttributes(debug)" />
+    <!--
+      In the example below, the "Replace" transform will replace the entire 
+      <customErrors> section of your web.config file.
+      Note that because there is only one customErrors section under the 
+      <system.web> node, there is no need to use the "xdt:Locator" attribute.
+      
+      <customErrors defaultRedirect="GenericError.htm"
+        mode="RemoteOnly" xdt:Transform="Replace">
+        <error statusCode="500" redirect="InternalError.htm"/>
+      </customErrors>
+    -->
+  </system.web>
+</configuration>

+ 15 - 0
Web.config

@@ -0,0 +1,15 @@
+<?xml version="1.0"?>
+
+<!--
+  For more information on how to configure your ASP.NET application, please visit
+  http://go.microsoft.com/fwlink/?LinkId=169433
+  -->
+
+<configuration>
+
+    <system.web>
+      <compilation debug="true" targetFramework="4.5.2" />
+      <httpRuntime targetFramework="4.5.2" />
+    </system.web>
+
+</configuration>

Failā izmaiņas netiks attēlotas, jo tās ir par lielu
+ 1812 - 0
demo.html


Failā izmaiņas netiks attēlotas, jo tās ir par lielu
+ 19 - 0
script/jquery-1.8.2.min.js


Failā izmaiņas netiks attēlotas, jo tās ir par lielu
+ 3717 - 0
script/jquery.nicescroll.js