Hi Team,

I have query on adding ajax loading panels on Custom selection of nevron chart.
On page_Load am creating default charts and after custom selection of values to nevron chart i have to put loading panel while creating chart at backend

How can i achieve this
Please provide some samples if available

Thanks
Sharath RR

Hi Sharath,

Most likely you mean how to update a chart based on some user input in a web page - for this purpose you can use the custom requests to the server. Check out the ThinWeb - Custom Request example, which shows how to achieve that (you don't need to use MS update panels to achieve this btw.).

Best Regards,
Nevron Support Team

Hi Team,


Thank you for the reply.

My query is different, i,e Am updating a chart based on some user input in a web page, am using the custom requests to the server, and this consuming time i,e around 4 or 5 seconds, so in the mean time is it possible to show the loading image to notify user that image is generating..

or else user may not understand what is happening in the server side.

please help me how do i achieve this..?

Hi Sharath,

You can obtain the div element containing the control using:

NClientNode.GetFromId("Chart1").HtmlElement;

(Chart1 is the state id of the control - check out custom requests example). Later you can use this element to position a loader gif image at the center. This is how its done in the control when it shows loader images in tiled rendering:

// shows the loader
NTiledImageCell.prototype.ShowLoader = function () {
    var loaderUrl = this.Parent.LoaderUrl;

    if (this.LoaderDiv != null || loaderUrl == null || loaderUrl.length == 0) {
        return;
    }

    var jHtmlElement = $(this.HtmlElement);
    var rect = this.GetRect();

    var loaderDiv = document.createElement("div");
    this.LoaderDiv = loaderDiv;
    var jLoaderDiv = $(loaderDiv);

    jLoaderDiv.css("position", "absolute");
    jLoaderDiv.css("left", rect.X + "px");
    jLoaderDiv.css("top", rect.Y + "px");
    jLoaderDiv.css("width", rect.Width + "px");
    jLoaderDiv.css("height", rect.Height + "px");
    jLoaderDiv.css("margin", 0);
    jLoaderDiv.css("padding", 0);
    jLoaderDiv.css("border-width", 0);
    jLoaderDiv.css("background-repeat", "no-repeat");
    jLoaderDiv.css("background-image", "url('" + this.Parent.LoaderUrl + "')");
    jLoaderDiv.css("background-position", "center");

    $(this.Parent.HtmlElement).append(loaderDiv);
}

// hides the loader
NTiledImageCell.prototype.HideLoader = function () {
    if (this.LoaderDiv != null) {
        $(this.LoaderDiv).remove();
        this.LoaderDiv = null;
    }
}

 

Best Regards,
Nevron Support Team