Forum Moderators: coopster
Been trying to process a form without reloading the page, using AJAX. It seems the form data is not being passed to the php script..... or maybe i just dont know what i'm doing......lol
Anyway, here's the deal. first the html
<head>
<script type="text/javascript" src="ajax.js"></script>
</head>
<body>
<div id="ajax_res"></div>
<form id="form1">
<input name="name" type="text" id="name" />
<input name="email" type="text" id="email" />
<input name="submit" type="submit" id="submit" onclick="sendRequest('POST', 'submit.php')"/>
</form>
</body>
the javascript file ajax.js is as follows;
// JavaScript Document
function sendRequest(method, url){
var req;
try
{
req = new XMLHttpRequest();
}
catch (e)
{
try
{
req = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
try
{
req = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e)
{
alert('Your browser does not support AJAX');
}
}
}
req.open(method,url,true);
req.onreadystatechange = handleResponse;
req.send(null);
function handleResponse(){
if(req.readyState == 4){
var response = req.responseText;
if(response){
document.getElementById("ajax_res").innerHTML = response;
}
}
}
//
}
AND NOW THE PHP SCRIPT
<?php
if( $_POST['name'] == "" ¦¦ $_POST['name'] == null ¦¦ strlen($_POST['name']) == 0 ){
$error = "Please enter your name";
}
else if($_POST['email'] == "" ¦¦ $_POST['email'] == null ¦¦ strlen($_POST['email']) == 0){
$error = "Please enter your email address";
}
//some other stuff goes here....
if(isset($error)){
$content = $error;
}
else{
$content = "Congrats! It worked";
}
echo $content;
?>
It returns the first message ("Please enter your name"), no matter what value you enter into the form.
I would seriously recommend looking at jQuery and AJAX as it is really easy and there are loads of turorials on the net.
A link would be nice.
<?php// content of ajax_lib dir
// file name: select.jsvar xmlHttp
function pass_val(str)
{
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request")
return
}
var url="select_sub_dir.php"
url=url+"?q="+str
url=url+"&sid="+Math.random()
xmlHttp.onreadystatechange=stateChanged
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}
function stateChanged()
{
if (xmlHttp.readyState==4 ¦¦ xmlHttp.readyState=="complete")
{
document.getElementById("show").innerHTML=xmlHttp.responseText
}
}
function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
//Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}
// end of ajax lib dir// in first page head
<head><script src="ajax_lib/select.js"></script>
</head>
/////// end first page head demo /////// NEXT
// in ajax_lib/select.js
// Find for example:
/*
Below those lines
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request")
return
}
*/
//That line:
var url="select_sub_dir.php" // THIS IS WHERE THE AJAX CALL IS MADE
// indeed could be nay url
// ends of lib example//in first page body
// Be advised: that page will alos hold your html/css
// the page called by AJAX is only for functionalityecho"<h2>This will produce the desired effect</h2>";
// here we create a drop down box
$db = new MySQL_Db;
$db->connect($host, $un, $pw);
$db->query($db_db);$result = $db->query("
SELECT
cate_name
FROM
any_table"
);$num=$db->num_rows($result);
while($row=$db->fetch_array($result))
{
$cate_name=$row['cate_name']; // echo"$username";
$i=0;
echo"<form><select name='cate_name' onchange='pass_val(this.value)'>";
echo"<option value=''>Select from list";
while($i <$num)
{
$cate_name=mysql_result($result, $i, "cate_name");
echo"<option value='$cate_name'>$cate_name";
$i++; echo'</option>';
}
}
echo"</select></form><div id=\"show\"></div>";// Where the ajax call lands (here is select_sub_dir.php)
$q=$_GET['q'];
$str=strlen($q);
if($str >25)
{
echo"<h3>Intrusion tentative</h3>";
exit();
}
if (!preg_match("/^[A-Za-z\_ ]+$/",$q))
{
echo"<h3>Intrusion tentative</h3>";
exit();
}$cate_name=$q; // grab the value of $q
then this could pass the selected data to any form type
?>
Thanks.
.....
// in first page head
<head>
<script src="ajax_lib/select.js"></script>
</head>
/////// end first page head demo /////
.........
next: any file, say first.php
to contain the head as posted with source to ajax_lib dir
also in first.php
your html/php form, drop down etc...
when clicking "select from list" (as is set the example)
it goes to for example: second.php
that is the page which receives the input from the js file (in ajax_lib)
this is where you start by $q=$_GET['q'] etc..
my advice: ask here in JS/AJAX forum for pointers tutorial etc...
good luck!
