Hi; I have seen all the ajaxRequest threads here and I've tried all the suggestions of using the API call but I'm not getting anywhere with this sample code...
<body>
<div id="example" class="k-content">
<div id="vertical">
<div id="header-pane">
<div class="pane-content">
<h3>Header pane</h3>
</div>
</div>
<div id="menu-pane">
<div class="pane-content1">
<div id="topmenu">
<ul id="menu">
<li>
Products
</li>
<li>
Stores
</li>
<li>
Blog
</li>
<li>
Company
</li>
<li>
Events
</li>
<li> </li>
<li>Search combo box</li>
<li>Shopping Cart: $xxx.xx (Items)</li>
</ul>
</div>
</div>
</div>
<div id="center-pane">
<div id="horizontal" style="height: 100%; width: 100%">
<div id="left-pane">
<div class="pane-content">
<h3>Left pane</h3>
<p>Resizable and collapsible.</p>
</div>
</div>
<div id="middle-pane">
<div class="pane-content">
<h3>Center pane</h3>
<p>Resizable only.</p>
</div>
</div>
</div>
</div>
<div id="footer-pane">
<div class="pane-content">
<p>Copyright © <SCRIPT>
<!--
var year=new Date();
year=year.getYear();
if (year<1900) year+=1900;
document.write(year);
//-->
</SCRIPT> My Products, All Rights Reserved.</p>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(document).ready(function() {
$("#vertical").kendoSplitter({
orientation: "vertical",
panes: [
{ collapsible: false, resizable: false, size: "70px" },
{ collapsible: false, resizable: false, size: "55px" },
{ collapsible: false },
{ collapsible: false, resizable: false, size: "55px" }
]
});
$("#horizontal").kendoSplitter({
panes: [
{ collapsible: true, size: "100px" },
{ collapsible: false }
]
});
});
$("#menu").kendoMenu();
// get a reference to the splitter
var splitter = $("#horizontal").data("kendoSplitter");
// load content into the pane with ID, pane1
splitter.ajaxRequest("#middle-pane", "http://localhost/terms_conditions.html");
</script>
</body>
</html>
Would appreciate some suggestions.
Thanks
<body>
<div id="example" class="k-content">
<div id="vertical">
<div id="header-pane">
<div class="pane-content">
<h3>Header pane</h3>
</div>
</div>
<div id="menu-pane">
<div class="pane-content1">
<div id="topmenu">
<ul id="menu">
<li>
Products
</li>
<li>
Stores
</li>
<li>
Blog
</li>
<li>
Company
</li>
<li>
Events
</li>
<li> </li>
<li>Search combo box</li>
<li>Shopping Cart: $xxx.xx (Items)</li>
</ul>
</div>
</div>
</div>
<div id="center-pane">
<div id="horizontal" style="height: 100%; width: 100%">
<div id="left-pane">
<div class="pane-content">
<h3>Left pane</h3>
<p>Resizable and collapsible.</p>
</div>
</div>
<div id="middle-pane">
<div class="pane-content">
<h3>Center pane</h3>
<p>Resizable only.</p>
</div>
</div>
</div>
</div>
<div id="footer-pane">
<div class="pane-content">
<p>Copyright © <SCRIPT>
<!--
var year=new Date();
year=year.getYear();
if (year<1900) year+=1900;
document.write(year);
//-->
</SCRIPT> My Products, All Rights Reserved.</p>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(document).ready(function() {
$("#vertical").kendoSplitter({
orientation: "vertical",
panes: [
{ collapsible: false, resizable: false, size: "70px" },
{ collapsible: false, resizable: false, size: "55px" },
{ collapsible: false },
{ collapsible: false, resizable: false, size: "55px" }
]
});
$("#horizontal").kendoSplitter({
panes: [
{ collapsible: true, size: "100px" },
{ collapsible: false }
]
});
});
$("#menu").kendoMenu();
// get a reference to the splitter
var splitter = $("#horizontal").data("kendoSplitter");
// load content into the pane with ID, pane1
splitter.ajaxRequest("#middle-pane", "http://localhost/terms_conditions.html");
</script>
</body>
</html>
Would appreciate some suggestions.
Thanks
1 Answer, 1 is accepted
0
atlterry
Top achievements
Rank 1
Rank 1
answered on 24 Mar 2013, 05:04 PM
Newbie error!