simple form with jquery-not working

PHP_CHILD · April 2, 2013

hello all, am beginning to use jquery.. i am using the code online.. all works fine but when i remove 2 lines it fails.. these two lines are simple input fields.. plss help..no idea what am doing wrong..

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-2" />
<title>Example Ajax and Form</title>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
<script>
  $(function() {
    $( "#datepicker" ).datepicker();
  });
  </script>

<script type="text/javascript"><!--
// create the XMLHttpRequest object, according browser
function get_XmlHttp() {
  // create the variable that will contain the instance of the XMLHttpRequest object (initially with null value)
  var xmlHttp = null;

  if(window.XMLHttpRequest) {		// for Forefox, IE7+, Opera, Safari, ...
    xmlHttp = new XMLHttpRequest();
  }
  else if(window.ActiveXObject) {	// for Internet Explorer 5 or 6
    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
  }

  return xmlHttp;
}

// sends data to a php file, via POST, and displays the received answer
function ajaxrequest(php_file, tagID) {
  var request =  get_XmlHttp();		// calls the function for the XMLHttpRequest instance

  // gets data from form fields, using their ID
  var nume = document.getElementById('nume').value;
  var mesaj = document.getElementById('mesaj').value;
  
  var datepicker = document.getElementById('datepicker').value;
var hour = document.getElementById('hour').value;
var minute = document.getElementById('minute').value;
var dhour = document.getElementById('dhour').value;
var dminute = document.getElementById('dminute').value;

  // create pairs index=value with data that must be sent to server
  var  the_data = 'datepicker='+datepicker+'&hour='+hour+'&minute='+minute+'&dhour='+dhour+'&dminute='+dminute;

  request.open("POST", php_file, true);			// sets the request

  // adds a header to tell the PHP script to recognize the data as is sent via POST
  request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  request.send(the_data);		// sends the request

  // Check request status
  // If the response is received completely, will be transferred to the HTML tag with tagID
  request.onreadystatechange = function() {
    if (request.readyState == 4) {
      document.getElementById(tagID).innerHTML = request.responseText;
    }
  }
}
--></script>
<style>
.left{float:left;}
.clear{clear:both;}
</style>
</head>
<body>

<br />
<b>Create Appointment</b><br><br>
<form action="new.php" method="post" name="form1" onsubmit="ajaxrequest('new.php', 'resp'); return false;">
<label class="left" for="datepicker" id="hour_label" class="small">Hours<br>
Date: <input type="text" name="datepicker" id="datepicker"/></label>
<br><br><br><br>


 
 
</form>
<br>
Trainer Availabity<br>

<form action="new.php" method="post" name="form1" onsubmit="ajaxrequest('new.php', 'resp'); return false;">
  Your name: <input type="text" name="nume" id="nume" size="20" maxlength="33" /><br />
  Your message:<br />
  <textarea name="mesaj" id="mesaj" cols="25" rows="4"></textarea><br />
   <b>Time</b><br>
 <label class="left" for="hourid" id="hour_label" class="small">Hours<br>
<?php $number = range(00,24);
$tempholder = range(00,24);
$nr=24;
echo '<select class="doba" name="hour" id="hour">';
echo '<option value="" selected="selected">--Select Hour--</option>';
for ($i=0; $i<$nr; $i++)
{
	
        echo "<option>".$tempholder[$i]."</option>";
        }
 	echo '</select>';

?>
</label>



<label  class="left" for="minute" id="minute_label" class="small">Minute<br>
<?php $number = range(1,60);
$tempholder = range(1,60);
$nr=60;
echo '<select name="minute" id="minute">';
echo '<option value="" selected="selected">--Select Minute--</option>';
for ($i=0; $i<$nr; $i++)
{
	
        echo "<option>".$tempholder[$i]."</option>";
        }
 	echo '</select>';

?>
</label>





<br><br><br><br>
<div class="clear"><b>Duration</b></div> 
<div class="clear"></div>
 <label class="left" for="dhour" class="small" id="dhour_label">Hours<br>
<?php $number = range(00,05);
$tempholder = range(00,05);
$nr=5;
echo '<select class="doba" name="dhour" id="dhour">';
echo '<option value="" selected="selected">--Select Hour--</option>';
for ($i=0; $i<$nr; $i++)
{
	
        echo "<option>".$tempholder[$i]."</option>";
        }
 	echo '</select>';

?>
</label>



<label class="left" for="dminute" class="small" id="dminute_label">Minute<br>
<?php $number = range(1,60);
$tempholder = range(1,60);
$nr=60;
echo '<select name="dminute" id="dminute">';
echo '<option value="" selected="selected">--Select Minute--</option>';
for ($i=0; $i<$nr; $i++)
{
	
        echo "<option>".$tempholder[$i]."</option>";
        }
 	echo '</select>';

?>
</label>
  
  <input type="submit" value="Search Trainer Availabity" />
</form>



<div id="resp"></div>
</body>
</html>

when i remove

Your name: <input type="text" name="nume" id="nume" size="20" maxlength="33" /><br />
  Your message:<br />
  <textarea name="mesaj" id="mesaj" cols="25" rows="4"></textarea><br />

it shows the output php file,not the current file... pls help!!!

PHP_CHILD · April 2, 2013

got the answer..i was getting trying to get the value of those fields(getelementof) via javascript.. deleted those two lines...

Sign In

simple form with jquery-not working

Recommended Posts

PHP_CHILD

Link to comment

Share on other sites

PHP_CHILD

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information