Response title
This is preview!
Conflict with Jquery UI tabs and Jquery datepicker
in Using jQuery UI
•
11 years ago
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Reporting</title>
<link href="style.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="tabs.css" type="text/css" media="screen, projection"/>
<!-- MAKE INPUT BOX BLANK -->
<script src="js/multifile_compressed.js"></script>
<!-- word count -->
<SCRIPT LANGUAGE="JavaScript">
function textCounter(field, countfield, maxlimit) {
if (field.value.length > maxlimit) // if too long...trim it!
field.value = field.value.substring(0, maxlimit);
else
countfield.value = maxlimit - field.value.length;
}
</script>
<script type="text/javascript">
function usePage(frm,nm){
for (var i_tem = 0, bobs=frm.elements; i_tem < bobs.length; i_tem++)
if(bobs[i_tem].name==nm&&bobs[i_tem].checked)
frm.action=bobs[i_tem].value;
}
</script>
<script type="text/javascript" src="js/csspopup.js"></script>
<script type="text/javascript" src="js/csspopup1.js"></script>
<script type="text/javascript" src="js/csspopup2.js"></script>
<!-- SHOW HIDE AND JAVASCRIPT ATTACHED HERE -->
<script type="text/javascript" src="js/showhide.js"></script>
<!-- TAB VIEW SCRIPTS-->
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.7.custom.min.js"></script>
<script type="text/javascript">
$(function() {
var $tabs = $('#tabs').tabs();
$(".ui-tabs-panel").each(function(i){
var totalSize = $(".ui-tabs-panel").size() - 1;
if (i != totalSize) {
next = i + 2;
$(this).append("<a href='#' class='next-tab mover' rel='" + next + "'>Next Page »</a>");
}
if (i != 0) {
prev = i;
$(this).append("<a href='#' class='prev-tab mover' rel='" + prev + "'>« Prev Page</a>");
}
});
$('.next-tab, .prev-tab').click(function() {
$tabs.tabs('select', $(this).attr("rel"));
return false;
});
});
</script>
<!--Date picker-->
<link rel="stylesheet" href="js/development-bundle/themes/base/jquery.ui.all.css">
<script src="js/development-bundle/jquery-1.4.4.js"></script>
<script src="js/development-bundle/ui/jquery.ui.core.js"></script>
<script src="js/development-bundle/ui/jquery.ui.widget.js"></script>
<script src="js/development-bundle/ui/jquery.ui.datepicker.js"></script>
<script>
$(function() {
$( "#settlementDateSD" ).datepicker({
showOn: "button",
buttonImage: "Images/cal.gif",
buttonImageOnly: true
});
});
$(function() {
$( "#settlementDateED" ).datepicker({
showOn: "button",
buttonImage: "Images/cal.gif",
buttonImageOnly: true
});
});
</script>
</head>
<body>
<div id="wrapper">
<div id="header">
<div id="top-bar">
<div class="left-col-tb">
<img src="Images/in_tresury_logo.gif"/>
</div><!-- left col tb ends here -->
<div id="logged"><strong>Admin:</strong></div><!-- User Logged details here -->
<div class="clear"></div>
</div><!-- top bar ends -->
<div id="logo">
<div class="left-col-logo">
<span class="company">GE</span> <span class="caption">Debt</span>
</div><!-- left col logo ends here -->
<dir class="right-col-logo">
<a href="User_management.html">Admin</a> | <a href="#">Help</a> | <a href="#">Logout</a>
</dir><!-- right col logo ends here -->
<div class="mid-col-logo">
<div id="main-menu">
<ul id="nav">
<li><a href="Debt_Inbox.html" title="My Inbox">My Inbox</a></li>
<li><a href="Reporting.html" title="Reporting">Reporting</a></li>
<li><a href="Contact.html" title="Contact Us">Contact Us</a></li>
</ul>
</div><!-- main menu ends here -->
</div><!-- mid col ends here -->
<div class="clear"></div>
</div><!-- logo ends here -->
</div><!-- header ends here -->
<div id="container">
<div id="breadcrums">
<a href="#">Home</a> >Reporting
</div>
<div class="left-col"><form action="#" method="post" onsubmit="usePage(this, 'bob');">
<div class="container_tab"><div class="required"><span class="red">*</span> Required fields</div>
<div id="tabs">
<ul id="tabs">
<li><a href="#fragment-1">Reporting</a></li>
<li><a href="#fragment-1" style="display:none;">Reporting</a></li>
</ul>
<div id="fragment-1" class="ui-tabs-panel">
<div id="content-border">
<table border="0" cellpadding="0" cellspacing="0" align="center" id="inner-table">
<tr>
<td colspan="2">
<table width="90%" cellpadding="3" cellspacing="0" border="0" align="center">
<tr>
<td width="15%" align="right"><span class="red">*</span> Settlement Payment Start Date</td>
<td width="1%"></td>
<td width="15%"><input type="Text" id="settlementDateSD" maxlength="25" size="25" style="margin:0px 10px 0px 0px;"></td>
<td width="35%"> </td>
</tr>
<tr>
<td width="15%" align="right"><span class="red">*</span> Settlement Payment End Date</td>
<td width="1%"></td>
<td width="15%"><input type="Text" id="settlementDateED" maxlength="25" size="25"></td>
<td width="35%"> </td>
</tr>
<tr>
<td width="15%" align="right"> Counterparty</td>
<td width="1%"></td>
<td width="15%">
<select multiple="" size="4" name="selectName"><option>International Bank</option><option>Overseas Bank</option><option>AMRO Bank</option></select>
</td>
<td width="35%"><input type="button" value="" onclick="javascript:divHideShow('divA');" class="viewreport-btn"></td>
</tr>
</table>
</td>
</tr>
</table>
</div>
<!--show/hide div starts here-->
<div id="divA" style="display: none;">
<!-- search result starts here -->
<dir id="search-results">
<div id="search-results-table-detail" >
<table cellspacing="0" cellpadding="0" border="0" id="inner-table">
<tbody>
<tr>
<colgroup width="20%"></colgroup>
<colgroup width="20%"></colgroup>
<colgroup width="25%"></colgroup>
</tr>
<tr>
<th rowspan="2" >Counterparty Code </th>
<th rowspan="2" >Counterparty Name </th>
<th colspan="3">Number of Settlements </th>
</tr>
<tr>
<th width="1%">Pending status </th>
<th width="20%">Approved status </th>
<th width="25%">Rejected status</th></tr>
<tr onmouseout="style.backgroundColor='#FFFFFF'"
onmouseover="style.backgroundColor='#ffffdb'" class="srtr1" >
<td>B123</td>
<td>International Bank</td>
<td><a href="Debt_Inbox_Pendingstatus.html">125</a></td>
<td><a href="Debt_Inbox_Approvedstatus.html">125</a></td>
<td><a href="Debt_Inbox_Rejecteddstatus.html">125</a></td>
</tr>
<tr onmouseout="style.backgroundColor='#f4f5f7'"
onmouseover="style.backgroundColor='#ffffdb'" class="srtr2" >
<td>B124</td>
<td>Bank Of America</td>
<td><a href="Debt_Inbox_Pendingstatus.html">125</a></td>
<td><a href="Debt_Inbox_Approvedstatus.html">125</a></td>
<td><a href="Debt_Inbox_Rejecteddstatus.html">125</a></td>
</tr>
<tr onmouseout="style.backgroundColor='#FFFFFF'"
onmouseover="style.backgroundColor='#ffffdb'" class="srtr1" >
<td>B125</td>
<td>Overseas Bank</td>
<td><a href="Debt_Inbox_Pendingstatus.html">125</a></td>
<td><a href="Debt_Inbox_Approvedstatus.html">125</a></td>
<td><a href="Debt_Inbox_Rejecteddstatus.html">125</a></td>
</tr>
<tr onmouseout="style.backgroundColor='#f4f5f7'"
onmouseover="style.backgroundColor='#ffffdb'" class="srtr2" >
<td>B126</td>
<td>AMRO Bank</td>
<td><a href="Debt_Inbox_Pendingstatus.html">125</a></td>
<td><a href="Debt_Inbox_Approvedstatus.html">125</a></td>
<td><a href="Debt_Inbox_Rejecteddstatus.html">125</a></td>
</tr>
<tr onmouseout="style.backgroundColor='#FFFFFF'"
onmouseover="style.backgroundColor='#ffffdb'" class="srtr1" >
<td>B127</td>
<td>Bank of Newyork</td>
<td><a href="Debt_Inbox_Pendingstatus.html">125</a></td>
<td><a href="Debt_Inbox_Approvedstatus.html">125</a></td>
<td><a href="Debt_Inbox_Rejecteddstatus.html">125</a></td>
</tr>
</tbody></table>
</div>
</dir><!-- search result ends here -->
</div><!--Show/hide div ends here-->
</div>
</div><!--tabs ends here-->
</div><!--container_tab ends here-->
</div><!-- left col ends -->
<div class="clear"></div>
</div><!-- container ends here -->
<div id="footer">
<div id="footer-menu">
<div class="left-col-fm">
<span class="caption-f">This Application is</span> <span class="company-f">GE Confidential</span>
</div><!-- left col logo ends here -->
<dir class="right-col-fm">
<a href="User_management.html">Admin</a> | <a href="#">Help</a>
</dir><!-- right col logo ends here -->
<div class="mid-col-fm">
<div id="main-menu-fm">
<ul id="nav">
<li><a href="Debt_Inbox.html" title="My Inbox">My Inbox</a></li>
<li><a href="Reporting.html" title="Reporting">Reporting</a></li>
<li><a href="Contact.html" title="Contact Us">Contact Us</a></li>
</ul>
</div><!-- main menu ends here -->
</div><!-- mid col ends here -->
<div class="clear"></div>
</div>
<div id="footer-credits">
<div class="left-col-fc"></div>
<div class="right-col-fc">
<a href="#">in:treasury Home</a> | <a href="#">My Profile</a> | <a href="#">Sitemap</a> | <a href="#">Help</a>
</div><!-- right col fc ends here -->
<div class="clear"></div>
</div><!-- footer credits ends here -->
</div><!-- footer ends here -->
</div><!-- wrapper ends here -->
</body>
</html>
<html>
<head>
<title>Reporting</title>
<link href="style.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="tabs.css" type="text/css" media="screen, projection"/>
<!-- MAKE INPUT BOX BLANK -->
<script src="js/multifile_compressed.js"></script>
<!-- word count -->
<SCRIPT LANGUAGE="JavaScript">
function textCounter(field, countfield, maxlimit) {
if (field.value.length > maxlimit) // if too long...trim it!
field.value = field.value.substring(0, maxlimit);
else
countfield.value = maxlimit - field.value.length;
}
</script>
<script type="text/javascript">
function usePage(frm,nm){
for (var i_tem = 0, bobs=frm.elements; i_tem < bobs.length; i_tem++)
if(bobs[i_tem].name==nm&&bobs[i_tem].checked)
frm.action=bobs[i_tem].value;
}
</script>
<script type="text/javascript" src="js/csspopup.js"></script>
<script type="text/javascript" src="js/csspopup1.js"></script>
<script type="text/javascript" src="js/csspopup2.js"></script>
<!-- SHOW HIDE AND JAVASCRIPT ATTACHED HERE -->
<script type="text/javascript" src="js/showhide.js"></script>
<!-- TAB VIEW SCRIPTS-->
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.7.custom.min.js"></script>
<script type="text/javascript">
$(function() {
var $tabs = $('#tabs').tabs();
$(".ui-tabs-panel").each(function(i){
var totalSize = $(".ui-tabs-panel").size() - 1;
if (i != totalSize) {
next = i + 2;
$(this).append("<a href='#' class='next-tab mover' rel='" + next + "'>Next Page »</a>");
}
if (i != 0) {
prev = i;
$(this).append("<a href='#' class='prev-tab mover' rel='" + prev + "'>« Prev Page</a>");
}
});
$('.next-tab, .prev-tab').click(function() {
$tabs.tabs('select', $(this).attr("rel"));
return false;
});
});
</script>
<!--Date picker-->
<link rel="stylesheet" href="js/development-bundle/themes/base/jquery.ui.all.css">
<script src="js/development-bundle/jquery-1.4.4.js"></script>
<script src="js/development-bundle/ui/jquery.ui.core.js"></script>
<script src="js/development-bundle/ui/jquery.ui.widget.js"></script>
<script src="js/development-bundle/ui/jquery.ui.datepicker.js"></script>
<script>
$(function() {
$( "#settlementDateSD" ).datepicker({
showOn: "button",
buttonImage: "Images/cal.gif",
buttonImageOnly: true
});
});
$(function() {
$( "#settlementDateED" ).datepicker({
showOn: "button",
buttonImage: "Images/cal.gif",
buttonImageOnly: true
});
});
</script>
</head>
<body>
<div id="wrapper">
<div id="header">
<div id="top-bar">
<div class="left-col-tb">
<img src="Images/in_tresury_logo.gif"/>
</div><!-- left col tb ends here -->
<div id="logged"><strong>Admin:</strong></div><!-- User Logged details here -->
<div class="clear"></div>
</div><!-- top bar ends -->
<div id="logo">
<div class="left-col-logo">
<span class="company">GE</span> <span class="caption">Debt</span>
</div><!-- left col logo ends here -->
<dir class="right-col-logo">
<a href="User_management.html">Admin</a> | <a href="#">Help</a> | <a href="#">Logout</a>
</dir><!-- right col logo ends here -->
<div class="mid-col-logo">
<div id="main-menu">
<ul id="nav">
<li><a href="Debt_Inbox.html" title="My Inbox">My Inbox</a></li>
<li><a href="Reporting.html" title="Reporting">Reporting</a></li>
<li><a href="Contact.html" title="Contact Us">Contact Us</a></li>
</ul>
</div><!-- main menu ends here -->
</div><!-- mid col ends here -->
<div class="clear"></div>
</div><!-- logo ends here -->
</div><!-- header ends here -->
<div id="container">
<div id="breadcrums">
<a href="#">Home</a> >Reporting
</div>
<div class="left-col"><form action="#" method="post" onsubmit="usePage(this, 'bob');">
<div class="container_tab"><div class="required"><span class="red">*</span> Required fields</div>
<div id="tabs">
<ul id="tabs">
<li><a href="#fragment-1">Reporting</a></li>
<li><a href="#fragment-1" style="display:none;">Reporting</a></li>
</ul>
<div id="fragment-1" class="ui-tabs-panel">
<div id="content-border">
<table border="0" cellpadding="0" cellspacing="0" align="center" id="inner-table">
<tr>
<td colspan="2">
<table width="90%" cellpadding="3" cellspacing="0" border="0" align="center">
<tr>
<td width="15%" align="right"><span class="red">*</span> Settlement Payment Start Date</td>
<td width="1%"></td>
<td width="15%"><input type="Text" id="settlementDateSD" maxlength="25" size="25" style="margin:0px 10px 0px 0px;"></td>
<td width="35%"> </td>
</tr>
<tr>
<td width="15%" align="right"><span class="red">*</span> Settlement Payment End Date</td>
<td width="1%"></td>
<td width="15%"><input type="Text" id="settlementDateED" maxlength="25" size="25"></td>
<td width="35%"> </td>
</tr>
<tr>
<td width="15%" align="right"> Counterparty</td>
<td width="1%"></td>
<td width="15%">
<select multiple="" size="4" name="selectName"><option>International Bank</option><option>Overseas Bank</option><option>AMRO Bank</option></select>
</td>
<td width="35%"><input type="button" value="" onclick="javascript:divHideShow('divA');" class="viewreport-btn"></td>
</tr>
</table>
</td>
</tr>
</table>
</div>
<!--show/hide div starts here-->
<div id="divA" style="display: none;">
<!-- search result starts here -->
<dir id="search-results">
<div id="search-results-table-detail" >
<table cellspacing="0" cellpadding="0" border="0" id="inner-table">
<tbody>
<tr>
<colgroup width="20%"></colgroup>
<colgroup width="20%"></colgroup>
<colgroup width="25%"></colgroup>
</tr>
<tr>
<th rowspan="2" >Counterparty Code </th>
<th rowspan="2" >Counterparty Name </th>
<th colspan="3">Number of Settlements </th>
</tr>
<tr>
<th width="1%">Pending status </th>
<th width="20%">Approved status </th>
<th width="25%">Rejected status</th></tr>
<tr onmouseout="style.backgroundColor='#FFFFFF'"
onmouseover="style.backgroundColor='#ffffdb'" class="srtr1" >
<td>B123</td>
<td>International Bank</td>
<td><a href="Debt_Inbox_Pendingstatus.html">125</a></td>
<td><a href="Debt_Inbox_Approvedstatus.html">125</a></td>
<td><a href="Debt_Inbox_Rejecteddstatus.html">125</a></td>
</tr>
<tr onmouseout="style.backgroundColor='#f4f5f7'"
onmouseover="style.backgroundColor='#ffffdb'" class="srtr2" >
<td>B124</td>
<td>Bank Of America</td>
<td><a href="Debt_Inbox_Pendingstatus.html">125</a></td>
<td><a href="Debt_Inbox_Approvedstatus.html">125</a></td>
<td><a href="Debt_Inbox_Rejecteddstatus.html">125</a></td>
</tr>
<tr onmouseout="style.backgroundColor='#FFFFFF'"
onmouseover="style.backgroundColor='#ffffdb'" class="srtr1" >
<td>B125</td>
<td>Overseas Bank</td>
<td><a href="Debt_Inbox_Pendingstatus.html">125</a></td>
<td><a href="Debt_Inbox_Approvedstatus.html">125</a></td>
<td><a href="Debt_Inbox_Rejecteddstatus.html">125</a></td>
</tr>
<tr onmouseout="style.backgroundColor='#f4f5f7'"
onmouseover="style.backgroundColor='#ffffdb'" class="srtr2" >
<td>B126</td>
<td>AMRO Bank</td>
<td><a href="Debt_Inbox_Pendingstatus.html">125</a></td>
<td><a href="Debt_Inbox_Approvedstatus.html">125</a></td>
<td><a href="Debt_Inbox_Rejecteddstatus.html">125</a></td>
</tr>
<tr onmouseout="style.backgroundColor='#FFFFFF'"
onmouseover="style.backgroundColor='#ffffdb'" class="srtr1" >
<td>B127</td>
<td>Bank of Newyork</td>
<td><a href="Debt_Inbox_Pendingstatus.html">125</a></td>
<td><a href="Debt_Inbox_Approvedstatus.html">125</a></td>
<td><a href="Debt_Inbox_Rejecteddstatus.html">125</a></td>
</tr>
</tbody></table>
</div>
</dir><!-- search result ends here -->
</div><!--Show/hide div ends here-->
</div>
</div><!--tabs ends here-->
</div><!--container_tab ends here-->
</div><!-- left col ends -->
<div class="clear"></div>
</div><!-- container ends here -->
<div id="footer">
<div id="footer-menu">
<div class="left-col-fm">
<span class="caption-f">This Application is</span> <span class="company-f">GE Confidential</span>
</div><!-- left col logo ends here -->
<dir class="right-col-fm">
<a href="User_management.html">Admin</a> | <a href="#">Help</a>
</dir><!-- right col logo ends here -->
<div class="mid-col-fm">
<div id="main-menu-fm">
<ul id="nav">
<li><a href="Debt_Inbox.html" title="My Inbox">My Inbox</a></li>
<li><a href="Reporting.html" title="Reporting">Reporting</a></li>
<li><a href="Contact.html" title="Contact Us">Contact Us</a></li>
</ul>
</div><!-- main menu ends here -->
</div><!-- mid col ends here -->
<div class="clear"></div>
</div>
<div id="footer-credits">
<div class="left-col-fc"></div>
<div class="right-col-fc">
<a href="#">in:treasury Home</a> | <a href="#">My Profile</a> | <a href="#">Sitemap</a> | <a href="#">Help</a>
</div><!-- right col fc ends here -->
<div class="clear"></div>
</div><!-- footer credits ends here -->
</div><!-- footer ends here -->
</div><!-- wrapper ends here -->
</body>
</html>
2