本文将介绍ashx和html的联合使用方法,尽管目前流行mvc,但handler一般处理程序还是ASP.NET的基础知识,结合html页面,做出来的网页绝对比WebForm的简洁和效率高。

首先,概要说明一下:

html是过去非常老的一种网页格式,属于静态网页,要想在html上呈现SQL Server上的数据,只能依靠ashx了。

大概的方法是,利用html作为模板,使用ashx读取数据库,替换html中的部分内容,最终显示已替换的html内容。

先给个效果图:

下面开始上代码:

首先做用visual studio,新建一个项目,项目下再新建有footer.htm,header.htm,Index.ashx,Index.htm

另外我已做了一个简单的选取表格信息,显示在input标签中的功能,所以我也用到了jquery.min.js

(屏蔽部分请忽略,是我做的另一个静态页面,与本例无关)

1、首先看的是Index.htm的静态网页代码:

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>首页</title>
<style type="text/css">
body
{
width: 1000px;
}
table
{
width: 300px;
text-align: center;
}
table th
{
text-align: center;
}
button
{
background-color: Transparent;
}
</style> <script src="jquery-1.8.2.min.js" type="text/javascript"></script> <script>
function select(obj){
var $btn=$(obj);
$("#col1").val($btn.parent().prev().prev().html());
$("#col2").val($btn.parent().prev().html());
}
</script> </head>
<body>
$header
<table class="table table-hover" border="1" cellpadding="0px" cellspacing="0px">
<tr>
<th>
col1
</th>
<th>
col2
</th>
<th>
col3
</th>
</tr>
$content
</table>
<br />
<input id="col1" type="text" />
<input id="col2" type="text" />
$footer
</body>
</html>

上图中,第5行至23行<style>是简单样式,

第27行至33行<script>是javascript代码,用于把table中选中的内容填入到input中,
第37行$header和第55行$footer是页头和页尾的标记,后续会使用另外2个html网页替换之,

中间的table创建了3个列头,分别是col1,col2,col3,$content是table的主体部分,后续会在Index.ashx中替换之。

2、接着是header.htm:

 <h2>
Title
</h2>

footer.htm:

 <hr />
CopyRight &copy; XXX

非常的简单,就是标题和版权信息。

3、最后是Index.ashx:

 using System;
using System.Collections;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Xml.Linq;
using System.IO; namespace AshxTest
{
/// <summary>
/// $codebehindclassname$ 的摘要说明
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
public class Index : IHttpHandler
{ public void ProcessRequest(HttpContext context)
{
//定义最终响应的文本内容的显示方式,这里使用html,所以是"text/html"
context.Response.ContentType = "text/html"; //分别把Index.htm,header.htm,footer.htm中的文本内容赋值给3个string变量,是完整的文本内容
//AppDomain.CurrentDomain.BaseDirectory则是指项目的根目录,由于本例的网页都放在根目录下,没有文件夹
string html = File.ReadAllText(AppDomain.CurrentDomain.BaseDirectory + "Index.htm");
string header = File.ReadAllText(AppDomain.CurrentDomain.BaseDirectory + "header.htm");
string footer = File.ReadAllText(AppDomain.CurrentDomain.BaseDirectory + "footer.htm"); //定义table主体内容的string变量为content
string content = "";
//简单的for循环10次,把i与abc组合,填入到table的tr td标签中
for (int i = 1; i <; i++)
{
content += string.Format("<tr><td>{0}</td><td>{1}</td><td><button value='select' onclick='select(this);'>选择</button></td></tr>", "a" + i, "b" + i);
} //以Index.htm的文本内容为基础,根据标记$header,$content,$footer分别替换上面的3个变量
html = html.Replace("$header", header).Replace("$content", content).Replace("$footer", footer); //最终得到的html是完整的html前端代码,通过context.Response.Write输出到浏览器中
context.Response.Write(html);
} public bool IsReusable
{
get
{
return false;
}
}
}
}

注释都已经加上了,下面看一下运行的效果。

调试Index.htm:

打开后,只有模板的内容:

此时,修改地址栏的后缀名,改为Index.ashx,就会显示本文开篇时的效果图了。

(图中点击了a8、b8行末端的“选择”按钮,在下方的input标签中显示"a8"和"b8")

结语:

这种制作网页的方法是最原生态的,是编程人员必须掌握的。

本文只是介绍一个简单的案例,实际上,在ashx中,可以编写平常我们写的C#代码(包括SQL的操作),在html中也能编写javascript,也能使用css样式,结合form提交和页面的跳转,可以完成大部分的网页功能,本人还没有学会mvc,所以只能介绍这种方法了,欢迎各位交流。

C# ashx与html的联合使用的更多相关文章

  1. Visual Studio 2013 添加一般应用程序(.ashx)文件到SharePoint项目

    默认,在用vs2013开发SharePoint项目时,vs没有提供一般应用程序(.ashx)的项目模板,本文解决此问题. 以管理员身份启动vs2013,创建一个"SharePoint 201 ...

  2. Dynamics CRM 之ADFS 使用 WID 的独立联合服务器

    ADFS 的使用 WID 的独立联合服务器适用于自己的测试环境,常用的就是在虚机中使用. 拓扑图如下: wID:联合身份验证服务配置为使用 Windows 内部数据库

  3. Dynamics CRM 之ADFS 使用 WID 的联合服务器场

    使用 WID 的联合服务器场 默认拓扑 Active Directory 联合身份验证服务 (AD FS) 是联合服务器场,使用 Windows 内部数据库 (WID). 在这种拓扑, AD FS 使 ...

  4. ashx中Response.ContentType的常用类型

    ashx中Response.ContentType的常用类型: text/plaintext/htmltext/xmlapplication/jsonimage/GIFapplication/x-cd ...

  5. Hibernate(5)—— 联合主键 、一对一关联关系映射(xml和注解) 和 领域驱动设计

    俗话说,自己写的代码,6个月后也是别人的代码……复习!复习!复习!涉及的知识点总结如下: One to One 映射关系 一对一单向外键(XML/Annotation) 一对一双向外键关联(XML/A ...

  6. Federated Identity Pattern 联合身份模式

    Delegate authentication to an external identity provider. This pattern can simplify development, min ...

  7. 一种开发模式:ajax + ashx + UserControl

    一.ajax+ashx模式的缺点     在web开发过程中,为了提高网站的用户体验,或多或少都会用到ajax技术,甚至有的网站全部采用ajax来实现,大量使用ajax在增强用户体验的同时会带来一些负 ...

  8. [占位-未完成]scikit-learn一般实例之十一:异构数据源的特征联合

    [占位-未完成]scikit-learn一般实例之十一:异构数据源的特征联合 Datasets can often contain components of that require differe ...

  9. SQL联合查询:子表任一记录与主表联合查询

    今天有网友群里提了这样一个关于SQL联合查询的需求: 一.有热心网友的方案: 二.我的方案: select * from ( select a.*,(select top 1 Id from B as ...

随机推荐

  1. Octopress 之 Mac 版环境配置

    前提条件: 1.安装了 Git2.用 rbenv 或 RVM 安装了 Ruby 1.9.3 以上版本3.安装了 ExecJS 的一种支持 JavaScript 运行环境 一.安装 Octopress ...

  2. 随着visual studio 2013 发布.带来的一些变化

    1.asp.net a.在2013中, asp.net走向了统一.使用不同的asp.net 框架搭(web forms ,api, mvc )建混合应用 b.身份验证 无身份验证 个人用户账户 (窗体 ...

  3. 试试Navicat和Axere RP Pro吧

    感觉在作头作起和沟通方面,这些东东真是提高不好效率呢~~~ 由于敏感,只作载图.

  4. Git fork指令

    ​ork并且更新一个仓库 现在有这样一种情形:有一个叫做Joe的程序猿写了一个游戏程序,而你可能要去改进它.并且Joe将他的代码放在了GitHub仓库上.下面是你要做的事情: fork并且更新GitH ...

  5. Bluetooth LE(低功耗蓝牙) - 第五部分

    回顾: 在本系列前面的文章中我们完成了发现BLE传感器并与之建立连接.现在只剩下从其中获取数据了,但是这并没有看起来那么简单.在这篇文章中我们将讨论GATT的特点以及如何促进主机与传感器之间的数据交换 ...

  6. 【HDOJ】2414 Chessboard Dance

    简单DFS. /* 2414 */ #include <cstdio> #include <cstring> #include <cstdlib> ; ][]; i ...

  7. poj3709

    首先我们发现将一段数变为同一个数比间隔着搞肯定优,因为数列是升序的,然后不难得到方程式f[i]=min(f[j]+sum[i]-sum[j]-(i-j)*a[j+1]) (i-j>=m)简单的斜 ...

  8. 用Delphi实现WinSocket高级应用

    用Delphi实现WinSocket高级应用 默认分类   2009-12-19 16:48   阅读6   评论0   字号: 大大  中中  小小 Socket通信在Windows 中是排队的形式 ...

  9. 【转】 U3D DrawCall优化手记 - 夜阑卧听风吹雨

     原文  http://www.cnblogs.com/ybgame/p/3588795.html 在最近,使用U3D开发的游戏核心部分功能即将完成,中间由于各种历史原因,导致项目存在比较大的问题,这 ...

  10. UVA 11762 Race to 1(记忆化+期望)

    题目链接:http://acm.hust.edu.cn/vjudge/problem/viewProblem.action?id=20869 [思路] DP+期望. 设f[x]表示从x转移到1的期望操 ...