POST Variables Set by JavaScript Undefined [SOLVED]

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
Ellipsis17
Forum Newbie
Posts: 3
Joined: Sat Oct 23, 2010 11:36 pm

POST Variables Set by JavaScript Undefined [SOLVED]

Post by Ellipsis17 »

I have three text fields within an HTML form that may be populated in one of two ways:

1. The user may enter values in the three fields
2. The user may check a checkbox that sets default values for the three fields using JavaScript.

When the fields are set using the first method, things are fine. The form passes the values of the three fields using the POST method to the next page.

When the fields are set using JavaScript, the variables are not defined in the POST array. Instead, I get the following messages:

Notice: Undefined index: expMonth in C:\Apache\htdocs\PHP_functions.php on line 20
Notice: Undefined index: expDay in C:\Apache\htdocs\PHP_functions.php on line 21
Notice: Undefined index: expYear in C:\Apache\htdocs\PHP_functions.php on line 22


These messages occur in response to the following PHP code:

Code: Select all

$expMonth = $_POST['expMonth'];
$expDay = $_POST['expDay'];
$expYear = $_POST['expYear'];
The JavaScript which sets the variables, in response to an ONCLICK event, seems to work fine on the same page. I don't see why fields set with JavaScript would not pass successfully through the POST array. The JavaScript that sets the fields looks like this:

Code: Select all

var d = new Date();
d.setDate(d.getDate() + 90);
document.addRecord.expMonth.value = d.getMonth()+1;
document.addRecord.expDay.value = d.getDate();
document.addRecord.expYear.value = d.getFullYear();
I am using:
Firefox 3.6.11
Apache 2.2.14
PHP 5.2.12

Any help anyone can provide would be greatly appreciated!
Last edited by Ellipsis17 on Sun Oct 24, 2010 4:47 pm, edited 1 time in total.
User avatar
s.dot
Tranquility In Moderation
Posts: 5001
Joined: Sun Feb 06, 2005 7:18 pm
Location: Indiana

Re: POST Variables Set by JavaScript Undefined

Post by s.dot »

Show us your form. Is the name of the form 'addRecord' ?
Alert the values after you set them to make sure they're being set.. alert(document.form.field.value);
Do a print_r($_POST); on the php page after posting the form to see what is available in the $_POST array
Set Search Time - A google chrome extension. When you search only results from the past year (or set time period) are displayed. Helps tremendously when using new technologies to avoid outdated results.
Ellipsis17
Forum Newbie
Posts: 3
Joined: Sat Oct 23, 2010 11:36 pm

Re: POST Variables Set by JavaScript Undefined

Post by Ellipsis17 »

Thanks for your interest!

I added the alert() statements and found that the correct values were reported on the first page. I also added the statement print_r($_POST); to the second page and found that the same fields, as expected, were undefined when set with JavaScript. When I set the fields manually, entering numbers in each field, their values were reported successfully by the same print_r($_POST); statement.

The name of the form is indeed addRecord. Here is the form; the lines of interest (though I realize line numbers are not displayed) are:

13: where the form begins
43-46: where the month, day and year fields are declared, as well the checkbox that calls the JavaScript function setDefaultExpiration() when clicked.

Code: Select all

<html>

<head>
  <link rel="stylesheet" type="text/css" href="styles.css" />
  <script type="text/javascript" src="JavaScript_functions.js"></script>
</head>

<body onload="enableTextFields()">

  <?php include('header.html'); ?>

<div id="content">
  <form name="addRecord" action="add_record_conf.php" method="POST">
  
    Indicate the person whose authority is being delegated:
    <br />
    <select name="primary">
      <option value="">(select)</option>
      <option value="Johnson, Jay A">Johnson, Jay A</option>
      <option value="Stiner, Bryan D">Stiner, Bryan D</option>
      <option value="Oliver, Thomas E">Oliver, Thomas E</option>
      <option value="Chacon, Jean P">Chacon, Jean P</option>
      <option value="Williams, Greg S">Williams, Greg S</option>
    </select>
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    <input name="primaryIsSubmitter" type="checkbox" />Check if you are the person who is delegating authority. 
    <br /><br />
    Indicate the person who will receive the authority:
    <br />
    <select name="delegate">
      <option value="">(select)</option>
      <option value="Johnson, Jay A">Johnson, Jay A</option>
      <option value="Stiner, Bryan D">Stiner, Bryan D</option>
      <option value="Oliver, Thomas E">Oliver, Thomas E</option>
      <option value="Chacon, Jean P">Chacon, Jean P</option>
      <option value="Williams, Greg S">Williams, Greg S</option>
    </select>
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    <input name="delegateIsSubmitter" type="checkbox" />Check if you are the person receiving the authority.
    <br /><br />
    Enter the date on which the account will expire (default is 90-days, may not be greater than 90-days)
	<br />
	Month&nbsp;&nbsp;<input name="expMonth" type="text" size="2" maxlength="2" />&nbsp;&nbsp;
	Day&nbsp;&nbsp;<input name="expDay" type="text" size="2" maxlength="2" />&nbsp;&nbsp;
	Year&nbsp;&nbsp;<input name="expYear" type="text" size="2"  maxlength="4" />
	&nbsp;&nbsp;<input id="defaultExp" type="checkbox" onclick="setDefaultExpiration()" />&nbsp;&nbsp;Use the default expiration of +90-days.
    <br /><br />
    Enter the title of authority being delegated:
	<br />
	<input name="authTitle" type="text" size="40" />
    <br /><br />
    Enter the lowest organizational level at which this authority applies: 
	<br />
    <select name="orgLevel">
      <option value="global">Global</option>
      <option value="group">Group</option>
      <option value="bu">Business Unit</option>
      <option value="operation">Operation</option>
      <option value="division">Division</option>
    </select>
    <input name="orgNum" type="text" size="10" />
    <br /><br />
    Enter any limitations to this delegation:
	<br />
    <textarea name="limitations" rows="3" cols="50"></textarea>
	<br /><br />
    <input type="submit" /><input type="reset" />
  </form>
</div>

  <?php include('footer.html'); ?>

</body>

</html> 
setDefaultExpiration() is defined (lines 1-30) in the file JavaScript_function.js, which I now include:

Code: Select all

function setDefaultExpiration()
{
  if(document.getElementById('defaultExp').checked == true) {
    document.addRecord.expMonth.value = '';
	document.addRecord.expDay.value = '';
	document.addRecord.expYear.value = '';
	
	document.addRecord.expMonth.disabled = true;
	document.addRecord.expDay.disabled = true;
	document.addRecord.expYear.disabled = true;
	
	var d = new Date();
	d.setDate(d.getDate() + 90);
    document.addRecord.expMonth.value = d.getMonth()+1;
	document.addRecord.expDay.value = d.getDate();
	document.addRecord.expYear.value = d.getFullYear();
	alert("The value of expMonth is " + document.addRecord.expMonth.value);
	alert("The value of expDay is " + document.addRecord.expDay.value);
	alert("The value of expYear is " + document.addRecord.expYear.value);
  }
  else {
    document.addRecord.expMonth.value = '';
	document.addRecord.expDay.value = '';
	document.addRecord.expYear.value = '';
	
	document.addRecord.expMonth.disabled = false;
	document.addRecord.expDay.disabled = false;
	document.addRecord.expYear.disabled = false;
  }
}

function enableTextFields()
{
  document.addRecord.expMonth.value = '';
  document.addRecord.expDay.value = '';
  document.addRecord.expYear.value = '';
	
  document.addRecord.expMonth.disabled = false;
  document.addRecord.expDay.disabled = false;
  document.addRecord.expYear.disabled = false;
  
  document.getElementById('defaultExp').checked = false;
}
And here is the current state of the second page, add_record_conf.php:

Code: Select all

<html>

<head>
  <link rel="stylesheet" type="text/css" href="styles.css" />
  <?php include('PHP_functions.php') ?>
</head>

<body>

  <?php include('header.html'); ?>

<div id="content">

  <?php
	print_r($_POST);
	validateExpDate();
  ?>

</div>

  <?php include('footer.html'); ?>

</body>

</html>
Still at a loss to explain why these fields are not being "collected" by the POST array when they are set with JavaScript.
User avatar
s.dot
Tranquility In Moderation
Posts: 5001
Joined: Sun Feb 06, 2005 7:18 pm
Location: Indiana

Re: POST Variables Set by JavaScript Undefined

Post by s.dot »

[text]document.addRecord.expMonth.disabled = true;
document.addRecord.expDay.disabled = true;
document.addRecord.expYear.disabled = true;[/text]
You are setting them to disabled. disabled form elements are not sent with the form in the POST array. Perhaps you want to set them to read only instead?

I think it is set like this - document.addRecord.expMonth.readOnly = true;
Set Search Time - A google chrome extension. When you search only results from the past year (or set time period) are displayed. Helps tremendously when using new technologies to avoid outdated results.
Ellipsis17
Forum Newbie
Posts: 3
Joined: Sat Oct 23, 2010 11:36 pm

Re: POST Variables Set by JavaScript Undefined

Post by Ellipsis17 »

That was it, it's fixed!

Thanks, s.dot! Very kind of you to take your time to help me.

I'm new to this forum. Is there any way I can add to your reputation or mark the question answered?
User avatar
s.dot
Tranquility In Moderation
Posts: 5001
Joined: Sun Feb 06, 2005 7:18 pm
Location: Indiana

Re: POST Variables Set by JavaScript Undefined

Post by s.dot »

You can mark the question as answered by editing the post title to [SOLVED]
You're welcome!
Set Search Time - A google chrome extension. When you search only results from the past year (or set time period) are displayed. Helps tremendously when using new technologies to avoid outdated results.
Post Reply