记录学习设计网站的过程_制作网站工作过程记录-CSDN博客

本文链接：https://blog.csdn.net/sqxyq/article/details/8517107

找一个现成的系统，根据需要进行修改。

一、修改文字信息

1、修改一些图片的信息和文字的信息，注意图片的路径，还有框架信息；

二、修改菜单

1、该类菜单的形式

2、文件：将所需的js文件放入文件夹jsxyq；将图片文件放入imgxyq；

3、利用js和css制作了菜单

4、发现并解决了菜单闪烁的问题；

5、掌握了菜单制作的方法。

三、设计查询页面

1、源文件有这个引用：<script type="text/javascript" src="../js/UART.js"></script> ，这里UART.js的意思大概是如下：

UART:Universal Asynchronous Receiver/Transmitter，通用异步接收/发送装置

2、注意一下页面放置图片的顶部和底部

3、先设计了使用gridview和 pagetemplate组合的分页显示，具体见文章《使用gridview和 pagetemplate组合的分页显示》，文件是：

/Reportxyq/showx.aspx

4、设计使用AspNetPage的分页显示，具体实现见文章：《AspNetPager的使用，分页显示》

文件是：/Reportxyq/showxaspnetpager.aspx

5、设计带Excel导出按钮的AspNetPage的分页显示页面ShowWithExcel.aspx

a、新建页面ShowWithExcel.aspx，把showxaspnetpager.aspx的页面内容复制进去，注意不要复制最上行（里面有cs文件信息，不适用），如下：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="showxAspNetPager.aspx.cs" Inherits="Reportxyq_showxAspNetPager" %>

b、再把现成的“excel导出”页面中的按钮复制到ShowWithExcel.aspx页面的合适位置，按钮代码是：

<asp:Button ID="Button1" runat="server" οnclick="Button1_Click" Text="导成excel" />

c、查看代码，把showxaspnetpager.aspx的背后代码页面内容、“excel导出”页面的背后代码内容小心合理的复制过去，最后别忘了using部分的内容，

自此，完成页面ShowWithExcel.aspx，但是经测试，只显示当前页的内容。

待进一步解决：

打算使用不可见的gridview来解决，但实际上是不行的：gridview将数据导出到excel宗旨是gridview的数据已经转换成页面的HTML代码再使用文件流写入到excel中的.

后google后发现需要重新写导出excel部分的代码，主要是数据源从gridview改为使用dataset变换成DataTable，然后逐行逐条写写入excel。

6、设计能够导出所有记录到excel的分页（使用AspNetPager）页面，详见：《设计能够导出所有记录到excel的分页（使用AspNetPager）页面，并解决excel文件名中文乱码问题》

a、新建页面ShowAllWithExcel.aspx，把ShowWithExcel.aspx的页面和背后代码都复制过去。

注意：页面的首行不复制，其他都复制；代码using都替换，public partial class行不动，其他都替换

b、修改写到excel部分的代码：主要是数据源从gridview改为使用dataset变换成DataTable，然后逐行逐条写写入excel。

完成后测试OK，满足分页和全部记录导出到excel的目的，但是excel的中文文件名乱码，解决方案：

//解决文件名乱码，重命名文件名
FileName = HttpUtility.UrlEncode(FileName, System.Text.Encoding.UTF8);

7、设计带进度条的ShowAllWithExcelProgress.aspx，详见《》

过程中几个问题：

a、在整个页面出来前，没有等待的显示，待查。：http://zhangxiaofei576342.blog.163.com/blog/static/2086199020100212332232/

b、经思考，使用UpdateProgress控件不能达到预期，因为是需要在页面加载前提示，而UpdateProgress只能实现页面内部部分更新是的提示。

搜索到：“页面加载给出提示 asp.net” http://shuikanshui.blog.163.com/blog/static/14823642011017103710381/

上面的是一个好的方法，但是页面格式受到影响，待解决。

c、后发现，不需要整个页面加载，使用UpdateProgress控件能够达到预期，加个Button可以解决问题。把上述文件另存为ShowLoading.aspx。

继续设计ShowAllWithExcelProgress.aspx

＝==================================

d、点击的Button控件一定要放在如下×××的位置，点击才能调用到UpdateProgress：

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional"> <ContentTemplate>××× </ContentTemplate> </asp:UpdatePanel>

e、<ContentTemplate> <UpdatePanel>出控件外，要放整个表格（部分单元格或行可能出错的）</ContentTemplate> </asp:UpdatePanel>

8、设计有加载提示的页面：ShowLoading.aspx（见上条）

9、设计带有时间等可选控件的的页面：ShowFinal.aspx

a、复制ShowAllWithExcelProgress.aspx的页面和cs到ShowFinal.aspx的页面和cs，注意：页面的首行不复制，其他都复制；代码using都替换，public partial class行不动，其他都替换

b、下载My97DatePicker，放入Web目录下，在页面的<head></head>之间插入代码：

c、使用方法一，html方法：

<input id="datebegin" type="text" onClick="WdatePicker()" />，暂时没找到引用值的方法；

使用方法二，TextBox控件方法：

<asp:TextBox ID="TextBox1" runat="server" onClick="WdatePicker()" ></asp:TextBox>，注意是onClick，而不是onfocus

另外注意要把My97DatePicker放到项目的解决方案里面！！！

本项目使用方法二！！

d、设置TextBox的只读属性，在页面中：ReadOnly="True"；后经测试，这个属性被删除，否则虽然页面上可以看到设定的日期，但是实际上TextBox.text没有被赋值。

设置97控件的日期格式，在页面中：onClick="WdatePicker({dateFmt:'yyyyMMdd'})

设置textBox的默认值：

protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
              DateBegin.Text = DateTime.Now.ToString("yyyyMMdd");
              DateEnd.Text   = DateTime.Now.ToString("yyyyMMdd");
        }
    }

四、DAL目录（与WEB同级）下的项目，包括用户认证的代码。

五、设计分析工具。

1、