First, I appreciate you responding. Thank you so much. It has been very helpful. But I am still having problems. My search page has two dates and I used <div> for each one with a name. I also have a calendar.gif that the user clicks on and the calendar will pop-up. That's a requirement.
I modified your coding to reflect their names and still experience the same problem.
I commented out one of the dates and used your coding but same problem.
I have posted both pages. I also really like the examples you posted. I am so new to jQuery.
This is my menu.php :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="jquery-ui-1.12.1.custom/jquery-ui.min.css">
<script type="text/javascript" src="jquery-ui-1.12.1.custom/external/jquery/jquery.js"></script>
<script type="text/javascript" src="jquery-ui-1.12.1.custom/jquery-ui.min.js"></script>
</head>
<title>Search</title>
<body>
<script>
$( function() {
$( "#tabs" ).tabs();
} );
</script>
<script>
$( "#tabs" ).tabs({
beforeLoad: function( event, ui ) {
$(ui.panel).find(".#txtbegdate").datepicker(); }
});
</script>
<script>
$( "#tabs" ).tabs({
beforeLoad: function( event, ui ) {
$(ui.panel).find(".#txtenddate").datepicker(); }
});
</script>
<script>
$(function() {
$( "#tabs" ).tabs({
active: 0 //opens the 2d tab, since its a 0 based count
});
</script>
</table>
<div id="tabs">
<ul>
<li><a href="searchonly.php">Search Only</a></li>
<li><a href="test.php">test date</a></li>
<li><a href="notavailableyet.php">NA Yet</a></li>
<li><a href="notavailableyet.php">NA Yet</a></li>
<li><a href="notavailableyet.php">NA Yet</a></li>
<li><a href="notavailableyet.php">NA Yet</a></li>
</ul>
</div>
</body>
</html>
This is my searchonly.php
<?php
// next line for development
error_reporting(E_ERROR | E_WARNING | E_PARSE | E_NOTICE);
//next line for production
// error_reporting(0);
header ("cache-Control: no-cache");
$baderr= "";
if ((!isset($_POST['reset'])) and (!isset($_POST['search'])) and (!isset($_POST['cancel'])))
{
// echo "begin";
}
if (isset($_POST['exit']))
{
// header ("Location: "); NOT CREATED YET
// REMOVE SESSION DATA
$_SESSION = array();
// REMOVE SESSION COOKIE
setcookie(session_name(), '', time()-3600, '/');
// DESTROY SESSION
session_destroy();
exit;
}
if (isset($_POST['search']))
{
$errmsg = 'ERRORS: ';
$begdate = $_POST['txtbegdate'];
$enddate = $_POST['txtenddate'];
echo 'Begin Date: ' . $begdate;
echo 'End Date: ' . $enddate;
if (strlen($begdate) ==0)
{
$errmsg = $errmsg . 'Begin Date Required';
}
if (strlen($enddate) ==0)
{
$errmsg = $errmsg . 'End Date Required';
}
echo $errmsg;
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="jquery-ui-1.12.1.custom/jquery-ui.min.css">
<script type="text/javascript" src="jquery-ui-1.12.1.custom/external/jquery/jquery.js"></script>
<script type="text/javascript" src="jquery-ui-1.12.1.custom/jquery-ui.min.js"></script>
<script>
$( function() {
$( "#txtbegdate" ).datepicker({
showOn: "button",
buttonImage: "jquery-ui-1.12.1.custom/images/calendar.gif",
buttonImageOnly: true,
buttonText: "Select date"
});
} );
</script>
<script>
$( function() {
$( "#txtenddate" ).datepicker({
showOn: "button",
buttonImage: "jquery-ui-1.12.1.custom/images/calendar.gif",
buttonImageOnly: true,
buttonText: "Select date"
});
} );
</script>
<script>
$( function() {
$( document ).tooltip();
} );
</script>
<style>
label {
display: inline-block;
width: 5em;
}
</style>
</head>
<title>Search by Dates</title>
<body>
<br><br>
<div>
<!--- start form -->
<form action="searchonly.php" method="post">
<table style="margin: auto;">
<tr>
<td style="text-align:center">Listings by Date Search</td>
</tr>
<tr>
<td> </td>
</tr>
</table>
<br>
<table style="margin: auto;">
<br>
<!--
Begin Begin Date Info Section
-->
<tr>
<div name="txtbegdate">
<td style="text-align:right">Begin Date:
<input type="text" name="txtbegdate" value="" id="txtbegdate">
<!-- <input class="datepicker"> -->
</td>
</div>
</tr>
</table>
<br>
<!--
Begin End Date Info Section
-->
<table style="margin: auto;">
<tr>
<div name="txtenddate">
<td style="text-align:right">Ending Date:
<input type="text" name="txtenddate" value="" id="txtenddate">
</td>
</div>
</tr>
</table>
<table style="margin: auto;">
<tr>
<td style="text-align:right"><label for="txtuser" class="textleft">UserName:</label>
<input type="text" name="txtuser" id="txtuser" required>
</td>
</tr>
<tr>
<td style="text-align:right"><label for="txtpass" class="textleft" >Password:</label>
<input type="text" name="txtpass" id="txtpass" required>
</td>
</tr>
</table>
<br>
<table style="margin: auto;">
<tr>
<td><input type="submit" name="search" value="Search" src="" alt="Search" />
<td><input type="submit" name="cancel" value="Cancel" src="" alt="Cancel"></td>
<td><input type="reset" name="reset" value="Reset Form" src="" alt="Reset Form"></td>
</tr>
</table>
</form>
<!-- end form -->
</div>
</body>
</html>