Jump to content

simple form with jquery-not working


Go to solution Solved by PHP_CHILD,

Recommended Posts

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!!!

Link to comment
https://forums.phpfreaks.com/topic/276413-simple-form-with-jquery-not-working/
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.