Mme graphiques :Le graphique en aires ne se charge pas parfois lors de l'utilisation de div.Load, méthode pour restituer un graphique

StackOverflow https://stackoverflow.com/questions/1653482

  •  11-09-2019
  •  | 
  •  

Question

J'essaie de charger MsChart dans ma page ASPX (SalesOverView.aspx) à l'aide de la méthode jQuery.load (), je charge une autre page ASPX (Charthandler.aspx) qui accepte les paramètres et rend le graphique.mais lorsque vous essayez d'exécuter, le graphique n'est parfois pas rendu. Au lieu de cela, je pouvais voir une sorte de support d'image dans la page (similaire à ce que nous voyons lorsque nous faisons référence à une URL d'image non valide en tant que valeur d'attribut src de balise d'image).

Le code que j'utilise est le suivant

<%@ 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>

$ (document) .ready (function () {var startDate = "10/10/2009" var enddate = "12/11/2009" var height = "150";var largeur = "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
});

});

Dans 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>

Dans ChartHandler.aspx.cs, lors du chargement de la page, je lis les valeurs de la chaîne de requête, je crée un graphique en aires et je l'ajoute au panneau.

Était-ce utile?

La solution

Quelques choses :

  1. Vous rendez une page entière en ajax, vous devez simplement restituer votre panneau
  2. Vous effectuez un POST sur votre page ChartHandler, cela devrait être un GET
  3. Vous demandez du texte/xml, mais vous ne faites rien avec XML
  4. Vous demandez une page Web.Utilisez simplement un gestionnaire générique (ashx) pour des choses comme celle-ci

Exemple de code

Page 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>

Créez un gestionnaire générique (ashx) avec le nom 'Chart.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;
    }
}
}

Ajoutez web.config sous httpHandlers:

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

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top