mvc2.0 html样式输出,在MVC2.0使用Lodop为WEB打印提出完美解决方案

通过好友

具体的实现步骤如下：

一、准备工作

1.MVC2.0 + jQuery1.4.1 开发环境。

2.Lodop web 打印控件，官方地址：http://mtsoftware.v053.gokao.net/download.html  (注：国人开发，免费软件)。

3.StringTemplate，C#开源模板引擎。官方地址：http://www.stringtemplate.org。

本文主要给出WEB下打印步骤实现方案，具体的技术实现细节，请查看官方API。lodop,stringtemplate 官方已给出了详尽的文档说明。

二、MVC2.0使用StringTemplate构造打印模板

StringTemplate 文中简称st。网络上有相关文档介绍st效率还不错。本文将st作为报表打印模板。在实际项目开发中将繁杂的报表打印工作内容，部分分配给美工来处理。而开发人员只需提供数据源接口。使用st可以减轻开发人员的工作量。并将报表开发任务分工更细致。给项目带来的好处就不多论了。具体实现如下：

1.在MVC2.0项目中引用st核心dll：

2.建立st的模板文件，template.st(st模板专用文件)：

也可以认为st文件就是一个普通的html文件。该部分主要由美工负责处理，比如CSS。

3.在MVC2.0 controller 内建立提供数据源的 JsonResult：

public JsonResult Print()

{

//构造打印数据

List list = new List();

for (int i = 0; i < 100; i++)

{

list.Add(new CustomerTest { CustomerName = "candy" + i, CustomerAddress = "思明区" + i, CustomerPhone = "13148484855" + i });

list.Add(new CustomerTest { CustomerName = "linda" + i, CustomerAddress = "湖里区" + i, CustomerPhone = "13847487545" + i });

list.Add(new CustomerTest { CustomerName = "ellie" + i, CustomerAddress = "海昌区" + i, CustomerPhone = "1359984665" + i });

}

//StringTemplate 打印模板文件，实际项目中为提高程序效率，应将打印模板文件缓存。

string serverPath = System.Web.HttpContext.Current.Server.MapPath("~");

string path = Path.Combine(serverPath, @"PrintTemplate\");

StringTemplateGroup group = new StringTemplateGroup("myGroup", path, typeof(TemplateLexer));

StringTemplate st = group.GetInstanceOf("template");

st.SetAttribute("customer", list);

//为打印提供html相关超文本内容。

StringBuilder sb = new StringBuilder();

sb.Append(@"");

sb.Append("

");

sb.Append(@"");

sb.Append(@"");

string cssContent = System.IO.File.ReadAllText(Path.Combine(serverPath, @"Content\CSS\CSSForPrint.css"));

sb.Append(@"

sb.Append(cssContent);

sb.Append(@"");

sb.Append("");

sb.Append("

");

sb.Append(st.ToString());

sb.Append(" ");

sb.Append("");

sb.Append("");

return Json(new { success = true, data = sb.ToString() }, JsonRequestBehavior.AllowGet);

}

其中CustomerTest是自定义数据类，已经给出详细的注释了。仔细阅读不难理解。

4.MVC2.0 view html head 内加入js 代码:

height="0">

function prn1_preview(data) {

LODOP.PRINT_INIT("打印控件功能演示_Lodop功能_打印表格");

//报表标题

LODOP.ADD_PRINT_HTM(50, 300, 330, 300,

"客户列表(制表人：张三)");

//报表内容打印。

LODOP.ADD_PRINT_TABLE(100, 150, 760, 900, data);

LODOP.PREVIEW();

};

$(function () {

$("#btnPrint").click(function () {

var url = '';

$.ajax({

type: "POST",

url: url,

cache: false,

dataType: 'json',

success: function (result) {

if (result.success) {

prn1_preview(result.data);

}

}

});

});

})

三、运行截图

最后一页打印预览：

打印机横向打印：

四、注意事项

本文给出的web打印方案需要读者对MVC2.0 、jQuery 、StringTemplate 有一定的了解。另外本例只是在IE下实现了WEB打印，如果需要Firefox或其他浏览器下支持web打印请联系

希望本篇文章可以给您带来帮助，如有不足之处欢迎指出，谢谢！

原文链接：

http://www.cnblogs.com/ryanding/archive/2010/12/26/1915915.html