Do not use on any
shared computer
September 5, 2008 04:43pm pdt
 
[x]
Attachment Details

How do I get this javascript pop up calendar to work?

Tags: php, javascript
I can not get the javascript code to work in my php page which should give me a pop calendar so I can select at a date.

Go here: http://www.mywebgenius.net/purestaff/contr_view.php, click on the little icon under "New Assignement" column. Then click on the calendar icon under the end-date column.  Nothing happens.

code for the page attached and jscript for the calendar attached. ___NOTE: remember to look at the end date php up calendar, not start date
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:
68:
69:
70:
71:
72:
73:
74:
75:
76:
77:
78:
79:
80:
81:
82:
83:
84:
85:
86:
87:
88:
89:
90:
91:
92:
93:
94:
95:
96:
97:
98:
99:
100:
101:
102:
103:
104:
105:
106:
107:
108:
109:
110:
111:
112:
113:
114:
115:
116:
117:
118:
119:
120:
121:
122:
123:
124:
125:
126:
127:
128:
129:
130:
131:
132:
133:
134:
135:
136:
137:
138:
139:
140:
141:
142:
143:
144:
145:
146:
147:
148:
149:
150:
151:
152:
153:
154:
155:
156:
157:
158:
159:
160:
161:
162:
163:
164:
165:
166:
167:
168:
169:
170:
171:
172:
173:
174:
175:
176:
177:
178:
179:
180:
181:
182:
183:
184:
185:
186:
187:
188:
189:
190:
191:
192:
193:
194:
195:
196:
197:
198:
199:
200:
201:
202:
203:
204:
205:
206:
207:
208:
209:
210:
211:
212:
213:
214:
215:
216:
217:
218:
219:
220:
221:
222:
223:
224:
225:
226:
227:
228:
229:
230:
231:
232:
233:
234:
235:
236:
237:
238:
239:
240:
241:
242:
243:
244:
245:
246:
247:
248:
249:
250:
251:
252:
253:
254:
255:
256:
257:
258:
259:
260:
261:
262:
263:
264:
265:
266:
267:
268:
269:
270:
271:
272:
273:
274:
275:
276:
277:
278:
279:
280:
281:
282:
283:
284:
285:
286:
287:
288:
289:
290:
291:
292:
293:
294:
295:
296:
297:
298:
299:
300:
301:
302:
303:
304:
305:
306:
307:
308:
309:
310:
311:
312:
313:
314:
315:
316:
317:
318:
319:
320:
321:
322:
323:
<?php
session_start();
 
 
if ($_POST['Update'] == "Modify")
	{	include("includes/dbconn_ps.inc");
		/*echo "<br>the contractor id inside update is: ". $_SESSION['contractor_id']."<br><br>";
		echo "<br><br>The test is: ".$_SESSION['sess_test']."<br><br>";*/
		
		$staff_lname = $_SESSION['staffFNAME']=trim($_POST['txt_staff_lname']);
		$staff_fname = $_SESSION['staffLNAME']=trim($_POST['txt_staff_fname']);
		$staff_title = $_SESSION['staffTitle']=trim($_POST['txt_staff_title']);
		$staff_comments = $_SESSION['staffComments']=trim($_POST['txt_staff_comments']);
		
		
		/*echo "MODIFY button Pressed.<br><br>";
		echo $con_lname."<br><br>";
		
		echo "<pre>";
		print_r($_POST); // or var_dump()
		echo "</pre><br>";
		echo "<pre>";
		echo "<pre>";
		print_r($_SESSION); // or var_dump()
		echo "</pre><br>";
		echo "<pre>";*/
//($_SERVER, $_ENV, $_REQUEST, $_COOKIE, $_GET, $_POST, $_SESSION)
$qry = "INSERT INTO jobs (contractor_id, company_id, rep, position, start_date, end_date, comments)  VALUES  ('$companyName',  '$contactFirstName', '$contactLastName', '$contact_title', '$client_active', '$comments')";
//echo $qry;
$result = mysql_query($qry, $connection) or die(mysql_error());
//echo "result is: ".$result."<br><br>";
 
	if ($result !=1)
		{
		echo "Update not complete, contact webmaster.";
		exit;
		}
	else {
		//echo "update successful";
		echo "<script>setTimeout(document.location.href = 'staff_view.php',5000)</script>";
		}
		}
	if ($_POST['Delete'] == "Delete")
	{
		include("includes/dbconn_ps.inc");
		/*echo "Delete button Pressed";
		
		echo "<pre>";
		print_r($_POST); // or var_dump()
		echo "</pre><br>";*/
			
	//if delete set active flag to no
	$qry =("update staff set active ='n' where ID=$_SESSION[staff_id]")or die("the qry didn't work");
	//echo $qry;
	$result = mysql_query($qry, $connection) or die("result not working");
	//echo "<br><br>result equals :".$result."<br><br>";
	if ($result ==1)
		{
			echo "Staff record set to inactive";
			echo "<script>setTimeout(document.location.href = 'staff_view.php',5000)</script>";
		}
		else 
		{
			echo "Error, nothing entered in db.";
			exit;
			
		}
	}
	?>
	
<HTML>
<HEAD>
	<TITLE>JavaScript Toolbox - Calendar Popup To Select Date</TITLE>
	<SCRIPT LANGUAGE="JavaScript" src="jscripts/CalendarPopup.js"></SCRIPT>
	<SCRIPT LANGUAGE="JavaScript">
	var cal = new CalendarPopup();
	</SCRIPT>
	<script language="JavaScript" src="ts_picker.js"></SCRIPT>
 
</HEAD>
<BODY>
 
<?php
$ebits = ini_get('error_reporting');
error_reporting($ebits ^ E_NOTICE);
 
 
echo "New Contractor Assisgnment<br><br>";
 
$_SESSION['contractor_id'] = $_POST['txt_contractor_id'];
include("includes/dbconn_ps.inc");
 
$qryCID ="Select * from contractors where id=".$_SESSION['contractor_id'];
$result = mysql_query($qryCID, $connection);
$row = mysql_fetch_array($result);
 
$qryClients ="Select id, clientName from clients where client_active='Yes'";
$resultClients = mysql_query($qryClients, $connection) or die("query error");
 
$qryRep ="Select id, lname from staff where current ='y'";
$resultRep = mysql_query($qryRep, $connection) or die("query error");
 
echo "<FORM method = 'post' action=".basename($_SERVER['PHP_SELF'])." NAME=frmAddNewJob>";
echo "<p>".$row['fname']."  ".$row['lname']."</p>";
echo "<table border=1 width=100%>
  <tr>
    <th width=20%>Company Name</th>
    <th width=20%>Rep</th>
    <th width=20%>Start date</th>
    <th width=20%>&nbsp;End date</th>
    <th width=20%>Title</th>
  </tr>
  <tr>
    <td width=20%>";
    if(mysql_num_rows($resultClients) > 0)
		{
		  echo("<select name=\"clientName\">");
		  while($rowClients = mysql_fetch_object($resultClients)){
		    echo("<option value=\"$rowClients->id\">$rowClients->clientName</option>");
		  }
		  echo("</select>");
		}
		else{
		  echo("<i>No values found.</i>");
}
echo "</td>
    <td width=20%>";
    
    if(mysql_num_rows($resultRep) > 0)
		{
		  echo("<select name=\"RepName\">");
		  while($rowRep = mysql_fetch_object($resultRep)){
		    echo("<option value=\"$rowRep->id\">$rowRep->lname</option>");
		  }
		  echo("</select>");
		}
		else{
		  echo("<i>No values found.</i>");
		}
		echo "</td>
    <td width=20%><input type=text name=date1 value='' size=25>";
echo "<A HREF='#' onClick='cal.select(document.frmAddNewJob.date1,'anchor1','MM/dd/yyyy'); return false;' NAME='anchor1' ID='anchor1'>select</A></td>
 
    
    <td width=20%><input type=text name=txt_end_date size=20>
    <a href='javascript:show_calendar('document.frmAddNewJob.txt_end_date', document.frmAddNewJob.txt_end_date.value);'><img src='cal.gif' width='16' height='16' border='0' alt='Click Here to Pick up the timestamp'></a>
 
    
    </td>
    <td width=20%>$row[title]</td>
  </tr>
  <tr>
    <td width=20%>contractor pay rate</td>
    <td width=20%>rep commission</td>
    <td width=20%>company pay rate</td>
    <td width=20%>&nbsp;</td>
    <td width=20%>&nbsp;</td>
  </tr>
  <tr>
    <td width=20%><input type=text name=txt_contractor_payrate size=20></td>
    <td width=20%><input type=text name=txt_rep_commission size=20></td>
    <td width=20%><input type=text name=txt_company_payrate size=20></td>
    <td width=20%>&nbsp;</td>
    <td width=20%>&nbsp;</td>
  </tr>
  <tr>
    <td width=20%>comments</td>
    <td width=20%>&nbsp;</td>
    <td width=20%>&nbsp;</td>
    <td width=20%>&nbsp;</td>
    <td width=20%>&nbsp;</td>
  </tr>
  <tr>
    <td width=20%>comments</td>
    <td width=20%>&nbsp;</td>
    <td width=20%>&nbsp;</td>
    <td width=20%>&nbsp;</td>
    <td width=20%>&nbsp;</td>
  </tr>
</table>";
		
		echo "<p><input type=submit value=Modify name=Update><input type=submit value=Delete name=Delete></p>";
echo "</form>";
 
/*echo "<pre>";
		echo "Post array:<br>";
		print_r($_POST); // or var_dump()
		echo "</pre><br>";
		echo "<pre>";
		echo "Session array:<br>";
		print_r($_SESSION); // or var_dump()
		echo "</pre><br>";
		echo "<pre>";*/
?>
</BODY>
</HTML>
//--------datepicker javascrit-------
// Title: Timestamp picker
// Description: See the demo at url
// URL: http://us.geocities.com/tspicker/
// Script featured on: http://javascriptkit.com/script/script2/timestamp.shtml
// Version: 1.0
// Date: 12-05-2001 (mm-dd-yyyy)
// Author: Denis Gritcyuk <denis@softcomplex.com>; <tspicker@yahoo.com>
// Notes: Permission given to use this script in any kind of applications if
//    header lines are left unchanged. Feel free to contact the author
//    for feature requests and/or donations
 
function show_calendar(str_target, str_datetime) {
	var arr_months = ["January", "February", "March", "April", "May", "June",
		"July", "August", "September", "October", "November", "December"];
	var week_days = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
	var n_weekstart = 1; // day week starts from (normally 0 or 1)
 
	var dt_datetime = (str_datetime == null || str_datetime =="" ?  new Date() : str2dt(str_datetime));
	var dt_prev_month = new Date(dt_datetime);
	dt_prev_month.setMonth(dt_datetime.getMonth()-1);
	var dt_next_month = new Date(dt_datetime);
	dt_next_month.setMonth(dt_datetime.getMonth()+1);
	var dt_firstday = new Date(dt_datetime);
	dt_firstday.setDate(1);
	dt_firstday.setDate(1-(7+dt_firstday.getDay()-n_weekstart)%7);
	var dt_lastday = new Date(dt_next_month);
	dt_lastday.setDate(0);
	
	// html generation (feel free to tune it for your particular application)
	// print calendar header
	var str_buffer = new String (
		"<html>\n"+
		"<head>\n"+
		"	<title>Calendar</title>\n"+
		"</head>\n"+
		"<body bgcolor=\"White\">\n"+
		"<table class=\"clsOTable\" cellspacing=\"0\" border=\"0\" width=\"100%\">\n"+
		"<tr><td bgcolor=\"#4682B4\">\n"+
		"<table cellspacing=\"1\" cellpadding=\"3\" border=\"0\" width=\"100%\">\n"+
		"<tr>\n	<td bgcolor=\"#4682B4\"><a href=\"javascript:window.opener.show_calendar('"+
		str_target+"', '"+ dt2dtstr(dt_prev_month)+"'+document.cal.time.value);\">"+
		"<img src=\"prev.gif\" width=\"16\" height=\"16\" border=\"0\""+
		" alt=\"previous month\"></a></td>\n"+
		"	<td bgcolor=\"#4682B4\" colspan=\"5\">"+
		"<font color=\"white\" face=\"tahoma, verdana\" size=\"2\">"
		+arr_months[dt_datetime.getMonth()]+" "+dt_datetime.getFullYear()+"</font></td>\n"+
		"	<td bgcolor=\"#4682B4\" align=\"right\"><a href=\"javascript:window.opener.show_calendar('"
		+str_target+"', '"+dt2dtstr(dt_next_month)+"'+document.cal.time.value);\">"+
		"<img src=\"next.gif\" width=\"16\" height=\"16\" border=\"0\""+
		" alt=\"next month\"></a></td>\n</tr>\n"
	);
 
	var dt_current_day = new Date(dt_firstday);
	// print weekdays titles
	str_buffer += "<tr>\n";
	for (var n=0; n<7; n++)
		str_buffer += "	<td bgcolor=\"#87CEFA\">"+
		"<font color=\"white\" face=\"tahoma, verdana\" size=\"2\">"+
		week_days[(n_weekstart+n)%7]+"</font></td>\n";
	// print calendar table
	str_buffer += "</tr>\n";
	while (dt_current_day.getMonth() == dt_datetime.getMonth() ||
		dt_current_day.getMonth() == dt_firstday.getMonth()) {
		// print row heder
		str_buffer += "<tr>\n";
		for (var n_current_wday=0; n_current_wday<7; n_current_wday++) {
				if (dt_current_day.getDate() == dt_datetime.getDate() &&
					dt_current_day.getMonth() == dt_datetime.getMonth())
					// print current date
					str_buffer += "	<td bgcolor=\"#FFB6C1\" align=\"right\">";
				else if (dt_current_day.getDay() == 0 || dt_current_day.getDay() == 6)
					// weekend days
					str_buffer += "	<td bgcolor=\"#DBEAF5\" align=\"right\">";
				else
					// print working days of current month
					str_buffer += "	<td bgcolor=\"white\" align=\"right\">";
 
				if (dt_current_day.getMonth() == dt_datetime.getMonth())
					// print days of current month
					str_buffer += "<a href=\"javascript:window.opener."+str_target+
					".value='"+dt2dtstr(dt_current_day)+"'+document.cal.time.value; window.close();\">"+
					"<font color=\"black\" face=\"tahoma, verdana\" size=\"2\">";
				else 
					// print days of other months
					str_buffer += "<a href=\"javascript:window.opener."+str_target+
					".value='"+dt2dtstr(dt_current_day)+"'+document.cal.time.value; window.close();\">"+
					"<font color=\"gray\" face=\"tahoma, verdana\" size=\"2\">";
				str_buffer += dt_current_day.getDate()+"</font></a></td>\n";
				dt_current_day.setDate(dt_current_day.getDate()+1);
		}
		// print row footer
		str_buffer += "</tr>\n";
	}
	// print calendar footer
	str_buffer +=
		"<form name=\"cal\">\n<tr><td colspan=\"7\" bgcolor=\"#87CEFA\">"+
		"<font color=\"White\" face=\"tahoma, verdana\" size=\"2\">"+
		"Time: <input type=\"text\" name=\"time\" value=\""+dt2tmstr(dt_datetime)+
		"\" size=\"8\" maxlength=\"8\"></font></td></tr>\n</form>\n" +
		"</table>\n" +
		"</tr>\n</td>\n</table>\n" +
		"</body>\n" +
		"</html>\n";
 
	var vWinCal = window.open("", "Calendar", 
		"width=200,height=250,status=no,resizable=yes,top=200,left=200");
	vWinCal.opener = self;
	var calc_doc = vWinCal.document;
	calc_doc.write (str_buffer);
	calc_doc.close();
}
// datetime parsing and formatting routimes. modify them if you wish other datetime format
function str2dt (str_datetime) {
	var re_date = /^(\d+)\-(\d+)\-(\d+)\s+(\d+)\:(\d+)\:(\d+)$/;
	if (!re_date.exec(str_datetime))
		return alert("Invalid Datetime format: "+ str_datetime);
	return (new Date (RegExp.$3, RegExp.$2-1, RegExp.$1, RegExp.$4, RegExp.$5, RegExp.$6));
}
function dt2dtstr (dt_datetime) {
	return (new String (
			dt_datetime.getDate()+"-"+(dt_datetime.getMonth()+1)+"-"+dt_datetime.getFullYear()+" "));
}
function dt2tmstr (dt_datetime) {
	return (new String (
			dt_datetime.getHours()+":"+dt_datetime.getMinutes()+":"+dt_datetime.getSeconds()));
}
Start your free trial to view this solution
[x]
The Solution Rating System

With so many solutions, how can you tell which solutions are most likely to help you and which ones are not? To provide you with a tool to use, we rate our solutions based on various elements that most accurately determine if a solution is a quality solution. To explain what factors affect the solution rating, here are the elements we take into consideration when formulating our solution rating.

  • The Grade of the Solution
  • The Zone Rank of the Expert Providing the Solution
  • The Number of Author and Expert Comments
  • The Number of Experts Contributing
  • The Feedback of the Community

Your Input Matters
Because of the way the system is set up, the most important variable in this equation is you. As a member of Experts Exchange, you are able to cast your vote on the quality of the solutions in regard to how complete, accurate, helpful and easy to understand each solution is. When you provide your feedback, each rating is adjusted accordingly. So, if you see a solution that has a poor rating that you think is a good solution, let us know by rating it. As you do, the rating will be adjusted and will become more accurate for other members of our site.

If you have any suggestions that you would like to make for our rating system, please ask a question in the Suggestions Zone of Community Support.

Thank you!

Question Stats
Zone: Web Development
Question Asked By: justmelat
Solution Provided By: logudotcom
Participating Experts: 2
Solution Grade: B
Views: 27
Translate:
Loading Advertisement...
 
[+][-]Accepted Solution by logudotcom

Rank: Wizard

Accepted Solution by logudotcom:

All comments and solutions are available to Premium Service Members only.

Start your 7-day free trial and see for yourself why Experts Exchange is the easiest and most proven technology resource in the world. Get Started

Already a member? Login to view this solution.

 
 
[+][-]Author Comment by justmelat
Author Comment by justmelat:

All comments and solutions are available to Premium Service Members only.

Start your 7-day free trial and see for yourself why Experts Exchange is the easiest and most proven technology resource in the world. Get Started

Already a member? Login to view this solution.

 
 
Loading Advertisement...
Open Discussion
Open Discussion
 
Comment by WizPrang
The differences are to do with when to use Quotations and Commas, HTML typically uses " whereas Javascript uses '.

Can't see 2 references to "value" though..
 
 
20080723-EE-VQP-34 / EE_QW_2_20070628