Ms chart:使用div.Load,方法来渲染图表时,有时不会加载面积图

时间:2009-10-31 05:15:26

标签: asp.net .net-3.5 mschart

我正在尝试使用jQuery.load()方法在我的aspx页面(SalesOverview.aspx)中加载mschart, 我正在加载另一个aspx页面(ChartHandler.aspx),它接受参数并渲染图表。 但是在尝试执行时,图表有时不会被渲染。相反,我可以在页面中看到图像持有者的类型(类似于我们将无效图像url称为图像标记src属性值时所看到的)。 / p>

我使用的代码如下

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="SalesOverview.aspx.cs" Inherits="OmnexCRM_UI.SalesOverview" %>

<!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></head>
<body>
  <form id="frmPag1" runat="server">
     <div id="divGraph"> </div>

 </form>
</body>

   $(文件)。就绪(函数()    {    var startDate =“10/10/2009”     var endDate =“12/11/2009”     var height =“150”;     var width =“730”;

var strUrl = "ChartHandler.aspx?chartMode=salesOverview&startDate=" + startDate + "&endDate=" + endDate + "&height=" + height + "&width=" + width;

$("#divGraph").html("<div class='divLoadingProdReport'><img src='images/ajax-loader-gray.gif' alt='Loading...'/></div>").fadeIn(10, function() {

    jQuery.ajax({
        url: strUrl,
        type: "POST",
        processData: false,
        contentType: "text/xml",
        data: null,
        success: function(data) {

        $("#divGraph").fadeOut(200, function() {
                $(this).html(data).fadeIn(100);

            });

        }
    });  //ajax
});

});    

在ChartHandler.aspx中

   
<!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 runat="server">
<title></title>
</head>
<body>
 <form id="form1" runat="server">
 <div>
<asp:Panel ID="pnlSalesChart" CssClass="pnlSalesChart" Visible="false" runat="server">       
</asp:Panel> 
</div>
</form>

在ChartHandler.aspx.cs中,在页面加载中,我正在读取查询字符串值并构建面积图并将其添加到面板中。

1 个答案:

答案 0 :(得分:2)

一些事情:

  1. 您将整个页面渲染为ajax,您应该只渲染面板
  2. 您正在对ChartHandler页面进行POST,这应该是GET
  3. 您正在请求text / xml,但您没有使用xml
  4. 您正在申请网页。只需使用通用处理程序(ashx)来处理这样的事情
  5. 示例代码

    HTML页面

    <form id="form1" runat="server">
    <div>
        <p>Test page</p>
        <div id="renderPanel">
        </div>
    </div>
    </form>
    
    <script type="text/javascript">
        $(document).ready(function() {
            $.get("chart.ashx?propertyA=1&propertyB=2", function(data, textStatus) {
                $("#renderPanel").html(data);
            });
        });
    </script>
    

    使用名称“Chart.ashx”创建一个通用处理程序(ashx)

    public class ChartHandler : IHttpHandler {
    
    public void ProcessRequest (HttpContext context) {
        //process querystring, which is in 'context.Request.QueryString'
    
        context.Response.ContentType = "text/html";
    
        PlaceHolder wrapperPanel = new PlaceHolder();
        //add your chart here
        wrapperPanel.Controls.Add(
            new Image() { ImageUrl = "http://www.geenstijl.nl/archives/images/niekijkenw.png" });
    
        //render control to HTML
        StringBuilder stringBuilder = new StringBuilder();
        StringWriter stringWriter = new StringWriter(stringBuilder);
        HtmlTextWriter htmlWriter = new HtmlTextWriter(stringWriter);
    
        wrapperPanel.RenderControl(htmlWriter);
    
        context.Response.Write(wrapperPanel);
    }
    
    public bool IsReusable {
        get {
            return false;
        }
    }
    }
    

    httpHandlers下添加web.config:

    <add verb="*" path="~/Chart.ashx" validate="false" type="ChartHandler"/>