Jump to content

Form Data


bob_the _builder

Recommended Posts

Hi,

 

I am using the ajax example from here

 

When I use the ajax request in a form no post data seems to be generated, have is missed something?

 

 

<form name="maincat" action="javascript: AjaxRequest(\'main\',\'./includes/gallery.php?action=addmaincat\')" method="post">
  <input name="maincat" type="hidden" value="maincat" />
  <input type="text" name="maincatname" /><br /><br />
  <input type="submit" value="Submit" name="Submit">
</form>

 

Thanks

Link to comment
Share on other sites

Hi,

 

that is all the code relevant.. other than the ajax in the link from the first post..

 

That ajax code is only designed to work with get. I manage to get it to work but can only pass one variable across using get and OnSubmit:

 

<form name="addsubcat" method="get" action="javascript: AjaxRequest(\'main\',\'./includes/gallery.php?action=addsubcat\')" OnSubmit="javascript: AjaxRequest(\'main\',\'./includes/gallery.php?action=addsubcat&subcatname=\',\'subcatname\')">
    <b>Add Sub Category:</b><br /><br />
Select Main Category:<br /><br />
    <select id="maincatid" name="maincatid">
<option value="">Choose</option>';
$sql = mysql_query("SELECT * FROM gallerymaincat ORDER BY maincatname ASC");
while ($row = mysql_fetch_array($sql)) {
echo '<option value="'.$row['maincatid'].'">'.stripslashes($row['maincatname']).'</option>'; 
}
echo '</select><br /><br />
    Type category name:<br /><br />
    <input type="text" id="subcatname" name="subcatname" /><br /><br />
    <input type="submit" value="submit" name="submit">
</form>

 

Most of the variables are pased across the url, but have a few forms as well. Is there away to pass more variables with the form?

 

Thanks

Link to comment
Share on other sites

function MyAjaxRequest(target_div,file,check_div)
{
var MyHttpRequest = false;
var MyHttpLoading = '<p>Loading...</p>'; // or use an animated gif instead: var MyHttpLoading = '<img src="loading.gif" border="0" alt="running" />';
var ErrorMSG = 'Sorry - No XMLHTTP support in your browser, buy a newspaper instead';

if(check_div)
{
var check_value = document.getElementById(check_div).value;
}
else
{
var check_value = '';
}



if(window.XMLHttpRequest) // client use Firefox, Opera etc - Non Microsoft product
{
try
{
MyHttpRequest = new XMLHttpRequest();
}
catch(e)
{
MyHttpRequest = false;
}
}
else if(window.ActiveXObject) // client use Internet Explorer
{
try
{
MyHttpRequest = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e)
{
try
{
MyHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e)
{
MyHttpRequest = false;
}
}
}
else
{
MyHttpRequest = false;
}



if(MyHttpRequest) // browser supports httprequest
{
var random = Math.random() * Date.parse(new Date()); // make a random string to prevent caching

var file_array = file.split('.'); // prepare to check if we have a query string or a html/htm file
if(file_array[1] == 'php') // no query string, just calling a php file
{
  var query_string = '?rand=' + random;
}
else if(file_array[1] == 'htm' || file_array[1] == 'html') // calling a htm or html file
{
  var query_string = '';
}
else // we have presumable a php file with a query string attached
{
  var query_string = check_value + '&rand=' + random;
}


MyHttpRequest.open("get", url_encode(file + query_string), true); // <-- run the httprequest using GET


// handle the httprequest
MyHttpRequest.onreadystatechange = function ()
{
if(MyHttpRequest.readyState == 4) // done and responded
{
document.getElementById(target_div).innerHTML = MyHttpRequest.responseText; // display result
}
else
{
document.getElementById(target_div).innerHTML = MyHttpLoading; // still working
}
}
MyHttpRequest.send(null);
}
else 
{
document.getElementById(target_div).innerHTML = ErrorMSG; // the browser was unable to create a httprequest
}
}

Link to comment
Share on other sites

Can you show more code please? Also, since you're using AJAX, you don't need <form>.

 

Actually, good ajax programming means setting up everything so it will work without ajax, then applying the ajax overtop. This allows for graceful degradation, in the case that the user has javascript turned off, or that they are using an older browser. This means that the form tag is necessary so as to be able to provide that fallback functionality.

 

The form tag is also required for valid XHTML strict (and maybe transitional, though I don't use transitional so I'm not sure).

Link to comment
Share on other sites

Hi,

 

Like so?

 

}
else
{
document.getElementById(target_div).innerHTML = MyHttpLoading; // still working
}
}
MyHttpRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
MyHttpRequest.send(null);
}
else 
{
document.getElementById(target_div).innerHTML = ErrorMSG; // the browser was unable to create a httprequest
}

 

Link to comment
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.