mvc渲染视图到字符串跨度

时间:2010-02-15 02:56:04

标签: asp.net-mvc

我之前从“Rendering a view to a string in MVC, then redirecting -- workarounds?”抓取了一些代码,现在下面是我用来将一个页面的html显示为电子邮件正文内容的代码,并使用“javascript:document.print; ”

问题在于我有一些基于他们的类转换成数字图像的Span。所以<div class="price black"><span class="dollar">$</span><span class="one"></span><span class="five"></span></div>

span类1显示为数字1的图像,因此只有一个。

问题在于它们在页面的javascript打印或电子邮件正文中都不起作用。

你能告诉我为什么吗?

以下是mvs和css的代码。

public virtual string RenderViewToString(ControllerContext controllerContext, string viewPath, string masterPath, ViewDataDictionary viewData, TempDataDictionary tempData, object Model)
        {
            if (tempData == null)
            {
                tempData = new TempDataDictionary();
            }
            Stream filter = null;
            ViewPage viewPage = new ViewPage();
            //Right, create our view    
            viewPage.ViewContext = new ViewContext(controllerContext, new WebFormView(viewPath, masterPath), viewData, tempData);
            //Get the response context, flush it and get the response filter.    
            var response = viewPage.ViewContext.HttpContext.Response;
            response.Flush();
            var oldFilter = response.Filter;
            try
            {
                //Put a new filter into the response    
                filter = new MemoryStream();
                response.Filter = filter;
                //Now render the view into the memorystream and flush the response    
                viewPage.ViewContext.ViewData.Model = Model;
                viewPage.ViewContext.View.Render(viewPage.ViewContext, viewPage.ViewContext.HttpContext.Response.Output);
                response.Flush();
                //Now read the rendered view.    
                filter.Position = 0;
                var reader = new StreamReader(filter, response.ContentEncoding);
                return reader.ReadToEnd();
            }
            finally
            {    //Clean up.    
                if (filter != null)
                {
                    filter.Dispose();
                }
                //Now replace the response filter    
                response.Filter = oldFilter;
            }
        }

的CSS:

.price-a {}
 .price-a span {}
.price-b {padding: 0 0 0 20px; background: url(../images/icon-price-b.gif) 0 0 no-repeat; color: #00a3a1;}/*cleared*/
 .price-b span {display: block; height: 42px; padding-right: 2px; float: left; background: url(../images/numbering-b.gif) 0 0 no-repeat; text-indent: -9999em;}
 .price-b span.one {width: 19px; background-position: 0 0;}
 .price-b span.two {width: 31px; background-position: 0 -42px;} 
 .price-b span.three {width: 32px; background-position: 0 -84px;} 
 .price-b span.four {width: 36px; background-position: 0 -126px;} 
 .price-b span.five {width: 32px; background-position: 0 -168px;} 
 .price-b span.six {width: 35px; background-position: 0 -210px;} 
 .price-b span.seven {width: 32px; background-position: 0 -252px;} 
 .price-b span.eight {width: 34px; background-position: 0 -294px;} 
 .price-b span.nine {width: 34px; background-position: 0 -336px;}
 .price-b span.zero {width: 36px; background-position: 0 -378px;}
.price-c {padding: 0 0 0 20px; background: url(../images/icon-price-c.gif) 0 0 no-repeat; color: #ad0974;}/*cleared*/
 .price-c span {display: block; float: left; padding-right: 2px; background: url(../images/numbering-c.gif) 0 0 no-repeat; text-indent: -9999em; height: 42px; width: 35px;}
 .price-c span.one {width: 19px; background-position: 0 0;}
 .price-c span.two {width: 31px; background-position: 0 -42px;} 
 .price-c span.three {width: 32px; background-position: 0 -84px;} 
 .price-c span.four {width: 36px; background-position: 0 -126px;} 
 .price-c span.five {width: 32px; background-position: 0 -168px;} 
 .price-c span.six {width: 35px; background-position: 0 -210px;} 
 .price-c span.seven {width: 32px; background-position: 0 -252px;} 
 .price-c span.eight {width: 34px; background-position: 0 -294px;} 
 .price-c span.nine {width: 34px; background-position: 0 -336px;}
 .price-c span.zero {width: 36px; background-position: 0 -378px;}
 .price-c strong {padding: 24px 0 0 4px; display: block; float: left;}
.price-d {padding: 0 0 0 20px; background: url(../images/icon-price-d.gif) 0 0 no-repeat; color: #48104a;}/*cleared*/
 .price-d span {display: block; float: left; padding-right: 2px; background: url(../images/numbering-d.gif) 0 0 no-repeat; text-indent: -9999em; height: 42px; width: 35px;}
 .price-d span.one {width: 19px; background-position: 0 0;}
 .price-d span.two {width: 31px; background-position: 0 -42px;} 
 .price-d span.three {width: 32px; background-position: 0 -84px;} 
 .price-d span.four {width: 36px; background-position: 0 -126px;} 
 .price-d span.five {width: 32px; background-position: 0 -168px;} 
 .price-d span.six {width: 35px; background-position: 0 -210px;} 
 .price-d span.seven {width: 32px; background-position: 0 -252px;} 
 .price-d span.eight {width: 34px; background-position: 0 -294px;} 
 .price-d span.nine {width: 34px; background-position: 0 -336px;}
 .price-d span.zero {width: 36px; background-position: 0 -378px;}





.price.black span{background: url(../images/numbering_blackonwhite.png) 0 0 no-repeat;}
.price.black .dollar{background: url("../images/icon_dollar_black.gif") 0 0 no-repeat;}

/*.price.black span.small{background: url(../images/numbering_blackonwhite_small.png) 0 0 no-repeat;}*/

.price.white span{background: url(../images/numbering_whiteonblack.png) 0 0 no-repeat;}
.price.white .dollar{background: url("../images/icon_dollar_greyondark.gif") 0 0 no-repeat;}

.price.blackOnGrey span{background: url(../images/numbering_blackongrey.png) 0 0 no-repeat; }
.price.blackOnGrey .dollar{background: url("../images/icon_dollar_black.gif") 0 0 no-repeat;}

/* global price style colour specific styles must be placed abover this for them to work */
.price {display:inline;clear:both;border:0px!important;}
    .price .dollar{font-size:0px;width:11px;height:11px;}
    .price.noDollar .dollar{display:none;position:absolute;}
    .price span {display: block; float: left; padding-right: 2px; text-indent: -9999em; height: 19px; width: 15px;}
 .price span.one {width: 9px; background-position: 0 0;}
 .price span.two {width: 13px; background-position: 0 -19px;} 
 .price span.three {width: 14px; background-position: 0 -38px;} 
 .price span.four {width: 15px; background-position: 0 -57px;} 
 .price span.five {width: 14px; background-position: 0 -76px;} 
 .price span.six {width: 17px; background-position: 0 -95px;} 
 .price span.seven {width: 14px; background-position: 0 -114px;} 
 .price span.eight {width: 16px; background-position: 0 -133px;} 
 .price span.nine {width: 16px; background-position: 0 -152px;}
 .price span.zero {width: 16px; background-position: 0 -171px;}
 .price span.dot {width: 6px; background-position: 0 -190px;}
 .price span.mb {width: 18px; background-image:url("../images/icon_mb_dark.gif"); background-position:bottom;}
 .price span.gb {width: 18px; background-image:url("../images/icon_gb_dark.gif"); background-position:bottom;}
 .price span.na {width: 50px;height:29px; background-image:url("../images/na.gif");position:relative;top:3px;}
 .price span.yes {width: 18px; background-image:url("../images/Yes.gif");width:43px; background-position:bottom;}
 .price span.no {width: 18px; background-image:url("../images/Yes.gif");width:43px; background-position:bottom;}
 .price span.Topless{width:74px;background:url("../images/txt_topless.png") 0 0 no-repeat;background-position:bottom;}
 /*.price span.small{height:14px;}

 .price .one.small {width: 10px; background-position: 0 0;}
 .price .two.small {width: 10px; background-position: 0 -13px;} 
 .price .three.small {width: 10px; background-position: 0 -26px;} 
 .price .four.small {width: 10px; background-position: 0 -39px;} 
 .price .five.small {width: 10px; background-position: 0 -52px;} 
 .price .six.small {width: 10px; background-position: 0 -65px;} 
 .price .seven.small {width: 10px; background-position: 0 -78px;} 
 .price .eight.small {width: 10px; background-position: 0 -91px;} 
 .price .nine.small {width: 10px; background-position: 0 -104px;}
 .price .zero.small {width: 10px; background-position: 0 -117px;}
 .price .dot.small {width: 6px; background-position: 0 -130px;}*/

1 个答案:

答案 0 :(得分:0)

您遇到麻烦的一些可能原因:

  1. 您确定样式表引用是通过电子邮件发送的内容的一部分吗? (例如,如果您使用外部样式表,则<link>标记包含在电子邮件正文中)

  2. 如果正确发送样式表,您确定用于阅读电子邮件的程序/浏览器/服务是否支持您正在使用的CSS功能?

  3. 您使用的CSS规则声明了相对图片路径,例如'../images/icon-price-a.gif'。当您将输出捕获为字符串并通过电子邮件发送时,这将不起作用,因为相对路径将不再解析为您的服务器。您是否尝试过将完全限定的网址放入其中? (例如url(http://www.mysite.com/images/icon-price-a.gif)