Kendo ToolTip How to cache your ajax response?

Today I had a task to make ToolTip that cache the response from ajax request. But the problem is that KendoUI ToolTip doesn't supports option for enabling the cache. By default they set "false" value to "cache" property in $.ajax method. Also by default you can't chose the type of request (POST/GET). Now I'll show you how I resolved the problem.

You should to put this code after initializing your tooltip

kendo.ui.Tooltip.fn._ajaxRequest = function (options) {
    var that = this;
        jQuery.ajax($.extend({
            type: "POST", // I changed the type to POST
            dataType: "html",
            cache: true, // and cache to true
            error: function (xhr, status) {
            kendo.ui.progress(that.content, false);
            that.trigger(ERROR, {
                status: status,
                xhr: xhr
            });
        },
        success: $.proxy(function (data) {
        kendo.ui.progress(that.content, false);
        that.content.html(data);
        that.trigger("contentLoad");
        }, that)
    }, options));
};

Now I'll make my action to cache the response in controller.

[HttpPost]
[OutputCache(Duration=3600, Location=OutputCacheLocation.ServerAndClient, VaryByParam="myDynamicId")]
public ActionResult GetCarInfromation(int myDynamicId)
{
    var myQueryResult = db.Cars.Single(x => x.CarId == myDynamicId);
    return View("myPartialView", myQueryResult);
}

I set the duration to be 3600 seconds and cache location to be to the server side and to the client side. Also I set my dynamic parameter("myDynamicId") with "VaryByParam" attribute.

Now the response from action are cached for 1 hour. This should to improve your performance and usually makes time for response two times faster.

You can read more about caching and performance in asp.net mvc here.

• ajax
• JavaScript
• Kendo UI
• MVC