Use HTTP POST for loading content via Kendo tabstrip - kendo-ui

Question

Kendo tabstrip accepts content loading ContentUrl as ajax via HTTP GET, is there a way to load this content via POST?
A kendo tabstrip accepts a kendo.data.Datasource for loading content
See http://dojo.telerik.com/EmECoy
$("#tabstrip").kendoTabStrip({
dataTextField: "Name",
dataContentUrlField: "ContentUrl",
dataSource: [
{ Name: "Tab1", ContentUrl: "http://demos.telerik.com/kendo-ui/content/web/tabstrip/ajax/ajaxContent1.html" },
{ Name: "Tab2", ContentUrl: "http://demos.telerik.com/kendo-ui/content/web/tabstrip/ajax/ajaxContent2.html" }
]
});
kendo.data.DataSource has an available READ type of "POST" but i cannot grasp if it is possible to plug this mechanism into the content loading of the tabstrip.. or am i stuck with an AJAX GET call to retrieve this ?

Answer 1

Here is my solution to bypass the built in tab mechanisms for loading content: http://dojo.telerik.com/omOre
Empty content urls in the tab definition:
jQuery(function(){jQuery("#tabstrip").kendoTabStrip({"select":onselect,"activate":onactivate,"contentLoad":onContentLoad,"animation":false,"contentUrls":["","","",""]});});
//Track our content
var tabcontent = [{"contentloaded":true},{"url":"http://demos.telerik.com/kendo-ui/content/web/tabstrip/ajax/ajaxContent1.html"},{"url":"http://demos.telerik.com/kendo-ui/content/web/tabstrip/ajax/ajaxContent2.html"},{"url":"http://demos.telerik.com/kendo-ui/content/web/tabstrip/ajax/ajaxContent3.html"} ];
Implement the "select" event
- Determine if we should load the tab via AJAX (post)
- Track if tab already loaded
//When selected, if ajax and not not loaded - load the content
function onselect(e) {
console.log("select");
var index = $(e.item).index();
var taburl = tabcontent[index].url;
var contentloaded = tabcontent[index].contentloaded;
if(taburl !== "" && contentloaded !== true)
{
//get reference to the TabStrip widget
var ts = $("#tabstrip").data("kendoTabStrip");
//get the tab content
var item = ts.contentElement(index);
$.ajax({
type: "get",//simple change! "post",
url: taburl,
success: function (response) {
$(item).html(response);
tabcontent[index].contentloaded = true;
console.log("Tab Index: " + index + ", Url: " + taburl + " [[ajax success]]");
}
});
}
}