While using iframe within splitter, is giving problem to resize splitter PANE by dragging. it is very slow. In my case I don’t need to resize the content of the splitter.
1. In My case I have spitted entire window into six PANES by kendo splitter. In every PANE we have one one iframe. Now while trying to drag, it is trying to resize the Iframe for that reason dragging of splitter is very slow.
2. We have tried contentURL which is refreshing entire page.
For above two problems I can not use splitter in web page.
Can anyone tell me what I have to do to refresh particular PANE
Is it possible to refresh particular splitter pane?
Followings are my code.
<%@ page session="true"%>
<%@page import="com.MATE.actions.DashBoard_MorC" %>
<%@page import="java.sql.*"%>
<%@page import="java.util.*"%>
<%@ page session="true"%>
<%@page import="java.io.*"%>
<%@page import="java.net.*"%>
<%@page import="javax.servlet.*"%>
<%@page import="com.MATE.connectionpool.*" %>
<%
String clientcode = "DEMO001";//(String) session.getAttribute("CLIENTCODE");
String sessionNo = "123456";//(String) session.getAttribute("SESSIONNO");
session.setAttribute("CLIENTCODE", clientcode.toUpperCase());
session.setAttribute("SESSIONNO", sessionNo);
java.util.TreeMap ScriptPool = new java.util.TreeMap();
java.util.Vector SeriesVector = new java.util.Vector();
//out.print(clientcode);
%>
<%
//if (request.getParameter("OrdCancelParam") != null) {
// out.print(request.getAttribute("OrdCancelParam"));
//out.print("ssz " +(String) request.getParameter("msg"));
DashBoard_MorC MCO = new DashBoard_MorC();
//MCO.setSessionNo(sessionNo.toUpperCase());
MCO.doPost(request, response);
// }
%>
<html>
<head>
<title>DashBoard</title>
<link href="./addi/styles/kendo.common.css" rel="stylesheet">
<link href="./addi/styles/kendo.kendo.css" rel="stylesheet">
<script src="./addi/js/jquery.js"></script>
<script src="./addi/js/kendo.core.js"></script>
<script src="./addi/js/kendo.data.odata.js"></script>
<script src="./addi/js/kendo.data.js"></script>
<script src="./addi/js/kendo.pageable.js"></script>
<script src="./addi/js/kendo.sortable.js"></script>
<script src="./addi/js/kendo.grid.js"></script>
<!script src="./addi/js/kendo.splitter.js"><!/script>
<script src="./addi/js/kendo.tabstrip.js"></script>
<script src="./addi/js/kendo.fx.js"></script>
<script src="./addi/js/kendo.window.js"></script>
<!New added for splitter get resize automatically>
<link href=".addi/styles/kendo.common.min.css" rel="stylesheet" />
<link href=".addi/styles/kendo.kendo.min.css" rel="Stylesheet"/>
<script src=".addi/js/jquery.min.js"></script>
<script src="http://cdn.kendostatic.com/2011.2.804/js/kendo.all.min.js" ></script>
<!script src="http://cdn.kendostatic.com/2011.3.1007/js/kendo.all.min.js"><!/script>
<!New added end>
<!import for button>
<link href="http://cdn.kendostatic.com/2011.3.1007/styles/examples.min.css" rel="stylesheet"/>
<link href="http://cdn.kendostatic.com/2011.3.1007/styles/kendo.common.min.css" rel="stylesheet"/>
<link href="http://cdn.kendostatic.com/2011.3.1007/styles/kendo.kendo.min.css" rel="stylesheet"/>
<!script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"><!/script>
<!end import>
<script src="./js/date.format.js" ></script>
<style>
iframe{ height: 100%; width: 100%; margin: 0px; border: 0 ; }
/* body { font-size: 11px; color: #000000; font-family: tahoma; }
select { font-size: 11px; color: #333333; font-family: tahoma; }
td,th { font-size: 11px; color: #000000; font-family: tahoma; }
html, body { overflow:hidden} /* for horizontal scrollbar */
</style>
<style type="text/css">
/* A:link { text-decoration: underline; color: aqua }
A:visited { text-decoration: underline; color: aqua }*/
/* a.t-link.t-state-hover { background-color: #FCBA95}*/
</style>
<script language="javascript">
document.onkeydown = keyhandler;
function keyhandler(e)
{
document.onhelp = function() {return(false);}
window.onhelp = function() {return(false);}
var Key = (window.event) ? event.keyCode : e.keyCode;
if (Key == 112 ||Key == 113 ||Key == 115 ||Key == 116 ||Key == 117 || Key == 123)
{
event.keyCode = 0;
event.returnValue = false;
}
if (Key == 114)
{
document.onhelp = function() {return(false);}
window.onhelp = function() {return(false);}
event.keyCode = 0;
window.open("pending_order.jsp",'','height=400,width='+screen.width+',left=0,top=180,location=no,menubar=no,status=no,scrollbars=no,resizable=yes,location=no');
return false;
}
if (Key == 119)
{
document.onhelp = function() {return(false);}
window.onhelp = function() {return(false);}
//event.keyCode = 0;
window.open("DashBoard_Tradelog.jsp",'','height=400,width='+screen.width+',left=0,top=180,location=no,menubar=no,status=no,scrollbars=no,resizable=yes,location=no');
return false;
}
if (Key == 27)
{
//alert("zz");
//document.getElementById("window").style.display="none";
var wnd = $("#window").data("kendoWindow");
// visible: false
wnd.close;
return false;
}
}
function changeBg(){
document.getElementById("cnfBtn").style.background="#f17946";
}
function changeBg1(){
document.getElementById("cnfBtn").style.background="#B0B9C2";
}
</script>
<script>
function send(){
//if($("#cnfBtn").html()=="<b>Cancelled</b>")
//{
//alert("You have already cancelled order.");
//$('#msg').html("");
//}
//else{
// alert("zz");
//document.forms["DashBoardForm"].submit();
//document.getElementById("OrdCancelParam").value = "ok";
var rows = $("#Pending tr"); // skip the header row
//alert(rows.length);
rows.each(function() {
// var rate_input = $("td:nth-child(2) input", this);
//$(this).children("#Pending td").each(function() {
var first = $("#Pending td").eq(0).html();
var second = $("#Pending td").eq(1).html();
// alert(first+" "+second);
});
$("#cnfBtn").html("<b>Cancelled</b>");
$("#cnfBtn").css('background-color','#F5F4EA');
$("#cnfBtn").attr('disabled', 'disabled');
// });
//document.forms["DashBoardForm"].submit();
$.post('DashBoard.jsp?msg="hi"', $("#DashBoardForm").serialize(), function(data) {
$('#msg').html("Message successfuly sent to RMS");
$('OrdCancelParam').value = "OrderCancel";
});
//alert("Message successfuly sent to RMS");
//$("#window").data("kendoWindow").close();
// }
}
</script>
</head>
<body onload="clockTick();">
<form id="DashBoardForm" name="DashBoardForm" action="DashBoard.jsp" method="post" style="margin: 0px;" border="0">
<div>
<table border="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="100%" id="AutoNumber2" cellpadding="0">
<tr>
<!td valign="top" width="8%" align="left">
<td valign="top" width="3%" align="left">
<!img id="" border="0" src="images/Wellknowmtech_logo2.jpg" width="251" height="70" alt="logo">
<img id="" border="0" src="images/WIPL_logo.jpg" width="80" height="70" alt="logo"></td>
<td valign="bottom" width="15%">
<img src="images/IPad Icon/Letter-B-lg-icon.png" height="25" width="25">
<img src="images/IPad Icon/Letter-S-red-icon.png" height="25" width="25">
<img src="images/IPad Icon/Letter-P-grey-icon.png" height="25" width="25">
<img src="images/IPad Icon/Letter-T-dg-icon.png" height="25" width="25">
<img src="images/IPad Icon/Letter-N-violet-icon.png" height="25" width="25">
<img src="images/IPad Icon/Letter-D-pink-icon.png" height="25" width="25">
<img src="images/IPad Icon/Letter-E-blue-icon.png" height="25" width="25">
</td>
<td width="20%">
<table>
Gross Exp
Gross Exp used
Available Exp
M2M
</table>
</td>
<td valign="top" width="31%">
<table border="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="100%" id="AutoNumber3" cellpadding="0">
<tr>
<td height="28" align="right" style="color: blue;font-size: small">
<label id="clock1">CurrentTime</label>
</td>
</tr>
<tr>
<td align="right"><span class="welcometext">Welcome </span><span class="greentext"><%=clientcode%></span></td>
</tr>
<tr>
<td colspan="100" >
<ul id="sddm">
<li >View
<ul><div style="z-index: 30">
<li ><a href="#" onclick="OpenReport('DashBoard_Exposure.jsp')">Exposure</a></li>
<li><a href="#" onclick="OpenReport('DashBoard_PO.jsp')">Order Book (F3)</a></li>
<li><a href="#" onclick="OpenReport('DashBoard_Tradelog.jsp')">Trade Book (F8)</a></li>
<li><a href="#" onclick="OpenReport('DashBoard_Netposition_new.jsp')">Net Position (ALT+F6)</a></li>
<li><a href="#" onclick="OpenReport('clientactivity.jsp')">Client Activity</a></li>
<li><a href="#" onclick="OpenReport('obligation.jsp')">Obligation</a></li>
<li><a href="#" onclick="OpenReport('DeliveryReport.jsp')">Delivery Report</a></li>
<li><a href="#" onclick="OpenReport('assetsreport.jsp')">ASSET Report</a></li>
</div></ul>
</li>
<li>Risk Watch
<ul>
<li><a href="#" onclick="OpenReport('DashBoard_Exposure.jsp')">Exposure Details</a></li>
<li><a href="#" onclick="OpenReport('spandetails.jsp')">Span Details</a></li>
<li><a href="#" onclick="OpenReport('initialreport.jsp')">Initial Margin</a></li>
</ul>
</li>
<li>Ex.
<ul>
<li><a href="#" onclick="OpenReport('exercise.jsp')">Excercise</a></li>
<li><a href="#" onclick="OpenReport('excercisebook.jsp')">Exercise Book</a></li>
</ul>
</li>
<li>Calculator
<ul>
<li><a href="#" onclick="OpenReport('calculator.jsp')">Normal Calculator</a></li>
<li><a href="#" onclick="OpenReport('futurecalculator.jsp')">Future Calculator</a></li>
<li><a href="#" onclick="OpenReport('optioncal.jsp')">Option Calculator</a></li>
</ul>
</li>
<li>Tools
<ul>
<li><a href="#" onclick="OpenReport('preferences_1.jsp')">Preferences</a></li>
<li><a href="#" onclick="OpenReport('BhavCopy.jsp')">Bhav Copy</a></li>
<li><a href="#" onclick="OpenReport('login.jsp?msg=logout')">Log Out</a></li>
</ul>
</li>
</ul>
</td>
</tr>
</table>
</td>
</tr>
</table>
<div id="tabstrip" style="height: 100%">
<ul>
<li>Market Watch</li>
<li>M2M</li>
</ul>
<div>
<div id="marketwatch">
<iframe src="DashBoard_MW.jsp" scrolling="yes" ></iframe>
</div>
</div>
<div>
<div id="vertical" style="height: 100%;">
<div>
<div id="horizontal1" style="height: 100%; width: 100%; border: 0; vertical-align: top">
<div><iframe src="DashBoard_Tradelog.jsp" style=" width: 100%" scrolling="no" ></iframe></div>
<div><iframe src="DashBoard_Tradelog.jsp" style=" width: 100%" scrolling="no"></iframe></div>
</div>
</div>
<div>
<div id="horizontal2" style="height: 100%; width: 100%; border: 0; ">
<div></div>
<div></div>
<div></div>
</div>
</div>
</div>
</div>
</div>
<div id="window"></div>
<div id="window1"></div>
<div id="window2"></div>
<div id="window3"></div>
<div id="window4"></div>
<div id="window5"></div>
<div id="window6"></div>
<div id="window7"></div>
<div id="window8"></div>
<div id="window9"></div>
<div id="window10"></div>
<div id="window11"></div>
<div id="window12"></div>
<div id="window13"></div>
<div id="window14"></div>
<div id="window15"></div>
<div id="window16"></div>
<div id="window17"></div>
<script type="text/javascript">
var ua = navigator.userAgent;
if(ua == "Mozilla/5.0 (Windows; U; en-US) AppleWebKit/533.19.4 (KHTML, like Gecko) AdobeAIR/3.0")
//alert("true");
heightValue= screen.height*1.5;
else
// alert("false");
heightValue= screen.height*.75;
function onSelect(e) {
setTimeout( function () {
$(e.contentElement).find(".t-splitter").each( function () {
// $(this).data("kendoSplitter")._resize();
});
}, 410 );
}
$(document).ready(function() {
$("#tabstrip").kendoTabStrip();
$("#marketwatch").css({
height: heightValue,
border: 1
});
$("#vertical").kendoSplitter({
orientation: "horizontal",
panes: [
{ collapsible: true },
{ collapsible: true },
{ collapsible: true }
]
}).css({
height: heightValue,
// height: device-height,
border: 1
});
$("#horizontal1").kendoSplitter({
orientation: "vertical",
panes: [
{ collapsible: true , resizable: true},
{ collapsible: true,resizable: true }
]
//panes: [ {collapsible: true, size: "50%"}, {} ]
//panes: [
// { collapsible: true },
// { collapsible: false },
//{ collapsible: true }
//]
}).css({
height: '100%',
border: 0
});
$("#horizontal2").kendoSplitter({
orientation: "vertical",
//panes: [ {collapsible: true, size: "60%"}, {} ]
//panes: [ {collapsible: true, size: "50%"}, {} ]
panes: [
{ collapsible: false,size: "30%"},
{ collapsible: false,size: "30%" },
{contentUrl: 'TradeLog_test_control.jsp', collapsible: true ,resizable: true}
]
}).css({
// height: '100%',
border: 0
});
$("#sddm").kendoMenu({
animation: {
hoverDelay: 500
}
}).css({
Zindex: 0
});
$("#window").kendoWindow({
draggable: true,
resizable: false,
width: screen.width *.80,
height:"230px" ,
title: "Modal Window",
modal: true,
visible: false
//actions: ["Refresh", "Maximize", "Close"]
});
$("#window1,#window2,#window3,#window4,#window5,#window6,#window7,#window8,\n\
#window9,#window10,#window11,#window12,#window16,#window17").kendoWindow({
draggable: true,
resizable: true,
width: screen.width *.80,
height:"230px" ,
//setIcon: "http://www.fstoke.me/favicon.ico",
//title: "Window 1",
modal: false,
visible: false
//actions: ["Refresh", "Maximize", "Close"]
});
$("#window13,#window14,#window15").kendoWindow({
draggable: true,
resizable: true,
width: screen.width *.20,
height:"230px" ,
//title: "Window 1",
modal: false,
visible: false
//actions: ["Refresh", "Maximize", "Close"]
});
});
//var isiPad = /iPad/i.test(ua) || /iPhone OS 3_1_2/i.test(ua) || /iPhone OS 3_2_2/i.test(ua);
//var ss = /Mozila/i.test(ua);
//alert(ua);
</script>
<script language="javascript">
openWins = new Array();
curWin = 0;
function OpenReport(report)
{
if(report=='DashBoard_PO.jsp')
{
var window1 = $("#window1").data("kendoWindow");
window1.center();
window1.title("PENDING ORDER");
window1.content('<iframe src="DashBoard_PO.jsp" scrolling="yes" ></iframe>');
window1.open();
}
else if(report=='DashBoard_Exposure.jsp')
{
var window2 = $("#window2").data("kendoWindow");
window2.center();
window2.title("EXPOSURE");
window2.content('<iframe src="DashBoard_Exposure.jsp" scrolling="yes" ></iframe>');
window2.open();
}
else if(report=='DashBoard_Tradelog.jsp')
{
var window3 = $("#window3").data("kendoWindow");
window3.center();
window3.title("TRADE LOG");
window3.content('<iframe src="DashBoard_Tradelog.jsp" scrolling="yes" ></iframe>');
window3.open();
}
else if(report=='DashBoard_Netposition_new.jsp')
{
var window4 = $("#window4").data("kendoWindow");
window4.center();
window4.title("NET POSITION");
window4.content('<iframe src="DashBoard_Netposition_new.jsp" scrolling="no" ></iframe>');
window4.open();
}
else if(report=='clientactivity.jsp')
{
var window5 = $("#window5").data("kendoWindow");
window5.center();
window5.title("CLIENT ACTIVITY");
window5.content('<iframe src="clientactivity.jsp" scrolling="yes" ></iframe>');
window5.open();
}
else if(report=='obligation.jsp')
{
var window6 = $("#window6").data("kendoWindow");
window6.center();
window6.title("OBLIGATION REPORT");
window6.content('<iframe src="obligation.jsp" scrolling="yes" ></iframe>');
window6.open();
}
else if(report=='DeliveryReport.jsp')
{
var window7 = $("#window7").data("kendoWindow");
window7.center();
window7.title("DELIVERY REPORT");
$("#window7").ready(function() {
window7.content('<iframe src="DeliveryReport.jsp" scrolling="yes" ></iframe>');
});
// window7.content('<iframe src="DeliveryReport.jsp" scrolling="yes" ></iframe>');
window7.open();
}
else if(report=='assetsreport.jsp')
{
var window8 = $("#window8").data("kendoWindow");
window8.center();
window8.title("ALL ASSETS REPORT");
window8.content('<iframe src="assetsreport.jsp" scrolling="yes" ></iframe>');
window8.open();
}
else if(report=='spandetails.jsp')
{
var window9 = $("#window9").data("kendoWindow");
window9.center();
window9.title("SPAN DETAILS");
window9.content('<iframe src="spandetails.jsp" scrolling="yes" ></iframe>');
window9.open();
}
else if(report=='initialreport.jsp')
{
var window10 = $("#window10").data("kendoWindow");
window10.center();
window10.title("INITIAL REPORT");
window10.content('<iframe src="initialreport.jsp" scrolling="yes" ></iframe>');
window10.open();
}
else if(report=='exercise.jsp')
{
var window11 = $("#window11").data("kendoWindow");
window11.center();
window11.content('<iframe src="exercise.jsp" scrolling="yes" ></iframe>');
window11.open();
}
else if(report=='excercisebook.jsp')
{
var window12 = $("#window12").data("kendoWindow");
window12.center();
window12.content('<iframe src="excercisebook.jsp" scrolling="yes" ></iframe>');
window12.open();
}
else if(report=='calculator.jsp')
{
var window13 = $("#window13").data("kendoWindow");
window13.center();
window13.content('<iframe src="calculator.jsp" scrolling="yes" ></iframe>');
window13.open();
}
else if(report=='futurecalculator.jsp')
{
var window14 = $("#window14").data("kendoWindow");
window14.center();
window14.content('<iframe src="futurecalculator.jsp" scrolling="yes" ></iframe>');
window14.open();
}
else if(report=='optioncal.jsp')
{
var window15 = $("#window15").data("kendoWindow");
window15.center();
window15.content('<iframe src="optioncal.jsp" scrolling="yes" ></iframe>');
window15.open();
}
else if(report=='preferences_1.jsp')
{
var window16 = $("#window16").data("kendoWindow");
window16.center();
window16.content('<iframe src="preferences_1.jsp" scrolling="yes" ></iframe>');
window16.open();
}
else if(report=='BhavCopy.jsp')
{
var window17 = $("#window17").data("kendoWindow");
window17.center();
// $("#window17").ready(function() {
window17.content('<iframe src="BhavCopy.jsp" scrolling="yes" ></iframe>');
// });
window17.open();
}
/*
if(report=='preferences_1.jsp')
{
openWins[curWin++] =window.open(report,'','height=590,width='+screen.width+',left=10,top=20,location=no,menubar=no,status=no,scrollbars=no,resizable=no,location=no');
}
else if(report=='login.jsp?msg=logout')
{
openWins[curWin++] =window.open(report,'','height='+screen.height+',width='+screen.width+',left=0,top=0,location=no,menubar=no,status=no,scrollbars=no,resizable=no,location=no');window.close();
}
else if(report=='calculator.jsp')
{
openWins[curWin++] =window.open(report,'','height=250,width=260,left=50,top=180,location=no,menubar=no,status=no,scrollbars=no,resizable=no,location=no');
}
else if(report=='futurecalculator.jsp')
{
openWins[curWin++] =window.open(report,'','height=180,width=100,left=50,top=180,location=no,menubar=no,status=no,scrollbars=no,resizable=no,location=no');
}
else if(report=='optioncal.jsp')
{
openWins[curWin++] =window.open(report,'','height=240,width=380,left=50,top=180,location=no,menubar=no,status=no,scrollbars=no,resizable=no,location=no');
}
else
{
openWins[curWin++] =window.open(report,'','height=400,width='+screen.width+',left=0,top=180,location=no,menubar=no,status=no,scrollbars=yes,resizable=yes,location=no');
}
*/
}
function clockTick()
{
currentTime = new Date();
// document.getElementById('clock').value = " "+currentTime;
// document.getElementById('clock').blur();
var time = currentTime.getHours()+":" + currentTime.getMinutes() +":" +currentTime.getSeconds();
var date = currentTime.getDate() +"/" + (currentTime.getMonth() +1) +"/" +currentTime.getFullYear();
//document.getElementById('clock1').innerHTML = currentTime.getTime();
document.getElementById('clock1').innerHTML = date +" - " + time;
//document.getElementById('clock1').innerHTML = dateFormat(currentTime,"dd-MM-yyyy h:mm:ss tt");
setTimeout("clockTick()", 1000);
}
</script>
</div>
</form>
</body>
</html>