473,218 Members | 1,417 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,218 software developers and data experts.

AJAX Form Problem??

384 256MB
I have this below code that calls an ajax page my problem is how do i pass the form values into the ajax page? I've tried $_REQUEST but it wont pick them up??

Expand|Select|Wrap|Line Numbers
  1. <form method="post" action="ajax-101-null/" enctype="multipart/form-data">
  2.                 <div class="teamdb_line_wrapper">
  3.                     <div class="teamdb_line_name">Group Name:</div>
  4.                     <div class="teamdb_line_text"><input type="text" id="name" name="name" size="40" maxlength="80" /></div>
  5.                 </div>
  6. </form>
May 8 '09 #1
16 2011
gits
5,390 Expert Mod 4TB
what do you mean with an 'AJAX-page'? an AJAX-call is made with the XMLHttpRequest-object and doesn't need a page or smething similar and you could pass values of the form-fields as params with the request ... have a look here for a basic AJAX-example

kind regards
May 8 '09 #2
ziycon
384 256MB
I'm just not sure how to explain my problem. I have the AJAX working fine. I click submit on the page and the relevant page opens but the $_REQUEST doesn't work on this page. It says that undefined variable?
May 8 '09 #3
gits
5,390 Expert Mod 4TB
as i said ... when you make an AJAX-call to request something at the server you need to add the values to the request ... the form is not posted and so the values are not posted ...

kind regards
May 8 '09 #4
ziycon
384 256MB
Thanks for that. I've added the values into the query using javascipt and it wil create a link like /ajax-101-name;23/
Out of the name;23 string, the first bit is being displayed, but anything after the semi-colon is being stripped, I've tried other characters but i get a page forbidden error??
May 8 '09 #5
gits
5,390 Expert Mod 4TB
?? i think i don't get what you did ... what is that link? and how did you pass the params to the request-object?

kind regards
May 8 '09 #6
Ciary
247 Expert 100+
by 'pass values of the form-fields as params with the request', gits means you need to add them to your URL. on the AJAX-page you'll be able to get them using $_GET

example URL:
Expand|Select|Wrap|Line Numbers
  1. 'yourpage.php?avariable='+document.getElementById('input').value+"&another="+document.getElementById('input2').value
May 8 '09 #7
ziycon
384 256MB
@Ciary
I was using mod_rewrite which was causing issues with the link but got it sorted now. Thanks for the help.
May 8 '09 #8
ziycon
384 256MB
While i have you here, is it possible to pass an image through a link? Or how would you go about it i this situation?
May 8 '09 #9
gits
5,390 Expert Mod 4TB
what do you mean with pass an image? i guess you mean an upload? that needs to be done with a 'normal' file upload ...

kind regards
May 8 '09 #10
ziycon
384 256MB
I know how to upload image through a normal form thats fine, I'm getting very confused when i try to do it with the way i have the ajax setup, any advice on how i would go about it?

Is this possible to upload an image with the way I'm using ajax at the moment?
May 8 '09 #11
gits
5,390 Expert Mod 4TB
hmmm ... i just don't have enough info about your 'setup' or what you mean with that or how you use AJAX at the moment ... may be this link is useful and answers your question?

kind regards
May 8 '09 #12
ziycon
384 256MB
Everything works fine except i don't know how to go about getting the file uploaded??

This is my setup:
Expand|Select|Wrap|Line Numbers
  1. <div id="teamdb_container">
  2.                 <form method="post" onsubmit="getcontent(\'sys/ajaxCalls.php?acid=101&value=\'+document.getElementById(\'name\').value+\'-\'+document.getElementById(\'url\').value+\'-\'+document.getElementById(\'body\').value,\'teamdb_container\')">
  3.                 <div id="teamdb_title">/New Team</div>
  4.                 <div class="teamdb_line_wrapper">
  5.                     <div class="teamdb_line_name">Group Name:</div>
  6.                     <div class="teamdb_line_text"><input type="text" id="name" name="name" size="40" maxlength="80" /></div>
  7.                 </div>
  8.                 <div class="teamdb_line_wrapper">
  9.                     <div class="teamdb_line_name">Website:</div>
  10.                     <div class="teamdb_line_text"><input type="text" id="url" name="url" size="40" maxlength="80" /></div>
  11.                 </div>
  12.                 <div class="teamdb_line_wrapper">
  13.                     <div class="teamdb_line_name">Banner:</div>
  14.                     <div class="teamdb_line_text"><input type="file" name="banner" size="50">
  15.                     <input type="hidden" name="MAX_FILE_SIZE" value="1000000"></div>
  16.                 </div>
  17.                 <div class="teamdb_line_wrapper">
  18.                     <div class="teamdb_line_name">About Us:</div>
  19.                     <div class="teamdb_line_text"><textarea id="body" name="body" rows="10" cols="60"></textarea></div>
  20.                 </div>
  21.                 <div class="teamdb_line_wrapper">
  22.                     <div class="teamdb_line_button"><input type="submit" value="Add New Team" /></div>
  23.                 </div>
  24.                 </form>
  25.             </div>
Then in the ajaxCalls.php file i have:
Expand|Select|Wrap|Line Numbers
  1. if($acid == 101) {
  2.           $value = explode('-',$value);
  3.           if(($value[0]!='') && ($value[1]!='') && ($value[2]!='')) {
  4.               //Query to add to db here
  5.               echo '<div id="teamdb_container">
  6.                       <meta http-equiv="refresh" content="2;url=teamdb.html">
  7.                       <div id="db_add_successful">Team has been added successfully!</div>
  8.                       <div id="redirect_msgs">You will be redirected in 2 seconds...</div>
  9.                     </div>';
  10.           }
  11.           else {
  12.               echo '<div id="teamdb_container">
  13.                 <form method="post" onsubmit="getcontent(\'sys/ajaxCalls.php?acid=101&value=\'+document.getElementById(\'name\').value+\'-\'+document.getElementById(\'url\').value+\'-\'+document.getElementById(\'body\').value,\'teamdb_container\')">
  14.                 <div id="teamdb_title">/New Team</div>
  15.                 <div class="teamdb_line_wrapper">
  16.                     <div class="teamdb_line_name">Group Name:</div>
  17.                     <div class="teamdb_line_text"><input type="text" id="name" name="name" value="'.$value[0].'" size="40" maxlength="80" /></div>
  18.                 </div>
  19.                 <div class="teamdb_line_wrapper">
  20.                     <div class="teamdb_line_name">Website:</div>
  21.                     <div class="teamdb_line_text"><input type="text" id="url" name="url" value="'.$value[1].'" size="40" maxlength="80" /></div>
  22.                 </div>
  23.                 <div class="teamdb_line_wrapper">
  24.                     <div class="teamdb_line_name">Banner:</div>
  25.                     <div class="teamdb_line_text"><input type="file" name="banner" size="50">
  26.                     <input type="hidden" name="MAX_FILE_SIZE" value="1000000"></div>
  27.                 </div>
  28.                 <div class="teamdb_line_wrapper">
  29.                     <div class="teamdb_line_name">About Us:</div>
  30.                     <div class="teamdb_line_text"><textarea id="body" name="body" rows="10" cols="60">'.$value[2].'</textarea></div>
  31.                 </div>
  32.                 <div class="teamdb_line_wrapper">
  33.                     <div class="teamdb_line_button"><input type="submit" value="Add New Team" /></div>
  34.                 </div>
  35.                 </form>
  36.             </div>';
  37.           }
  38.       }
May 8 '09 #13
gits
5,390 Expert Mod 4TB
did you have a look at the link i showed you above? there is an example for exactly that issue ...
May 8 '09 #14
ziycon
384 256MB
Ye, can't seem to get my head round it, I'll have another look. thanks.
May 8 '09 #15
gits
5,390 Expert Mod 4TB
no problem ... simply ask here in case you have specific problems with the shown code there ...

kind regards
May 8 '09 #16
ziycon
384 256MB
Ok, I've gone through the code and I've added it to my code they way that i need it but i just don't under stand what the code is doing so i can't figure out where I'm going wrong!?

So i have:
Expand|Select|Wrap|Line Numbers
  1. <html>
  2. <head>
  3. <script type="text/javascript" language="javascript">
  4.     var loading_img = '/media/images/layout/loading.gif';
  5.     var loading_msg = ' Loading...';
  6.     var xmlhttp_obj = false;//create the XMLHttpRequest
  7.  
  8.     function ewd_xmlhttp()
  9.     {
  10.         if (window.XMLHttpRequest)
  11.         { // if Mozilla, Safari etc
  12.             xmlhttp_obj = new XMLHttpRequest();
  13.         }
  14.         else if (window.ActiveXObject)
  15.         { // if IE
  16.             try
  17.             {
  18.                 xmlhttp_obj = new ActiveXObject("Msxml2.XMLHTTP");
  19.             }
  20.             catch (e)
  21.             {
  22.                 try
  23.                 {
  24.                     xmlhttp_obj = new ActiveXObject("Microsoft.XMLHTTP");
  25.                 }
  26.                 catch (e)
  27.                 {
  28.  
  29.                 }
  30.             }
  31.         }
  32.         else
  33.         {
  34.             xmlhttp_obj = false;
  35.         }
  36.  
  37.         return xmlhttp_obj;
  38.     }   //get content via GET
  39.  
  40.     function getcontent(url, containerid)
  41.     {
  42.         var xmlhttp_obj = ewd_xmlhttp();
  43.         document.getElementById(containerid).innerHTML = '<img src="' + loading_img + '" />' + loading_msg;
  44.         xmlhttp_obj.onreadystatechange=function()
  45.         {
  46.             loadpage(xmlhttp_obj, containerid);
  47.         }
  48.         xmlhttp_obj.open('GET', url, true);
  49.         xmlhttp_obj.send(null);
  50.     }     
  51.  
  52.     function loadpage(xmlhttp_obj, containerid)
  53.     {
  54.         if ( xmlhttp_obj.readyState == 4 && xmlhttp_obj.status == 200 )
  55.         {
  56.             document.getElementById(containerid).innerHTML = xmlhttp_obj.responseText;
  57.         }
  58.     }
  59. //]]>
  60. </script>
  61. <script type="text/javascript" src="sys/js/webtoolkit.aim.js"></script>
  62.     <script type="text/javascript">
  63.         function startCallback() {
  64.             // make something useful before submit (onStart)
  65.             return true;
  66.         }
  67.  
  68.         function completeCallback(response) {
  69.             // make something useful after (onComplete)
  70.             document.getElementById('nr').innerHTML = parseInt(document.getElementById('nr').innerHTML) + 1;
  71.             document.getElementById('r').innerHTML = response;
  72.         }
  73. </script>
  74.  
  75. </head>
  76. <body>
  77. <div id="teamdb_container">
  78.                 <form method="post" onsubmit="return AIM.submit(this, {\'onStart\' : startCallback, \'onComplete\' : completeCallback})">
  79.                 <div id="teamdb_title">/New Team</div>
  80.                 <div class="teamdb_line_wrapper">
  81.                     <div class="teamdb_line_name">Group Name:</div>
  82.                     <div class="teamdb_line_text"><input type="text" id="name" name="name" size="40" maxlength="80" /></div>
  83.                 </div>
  84.                 <div class="teamdb_line_wrapper">
  85.                     <div class="teamdb_line_name">Website:</div>
  86.                     <div class="teamdb_line_text"><input type="text" id="url" name="url" size="40" maxlength="80" /></div>
  87.                 </div>
  88.                 <div class="teamdb_line_wrapper">
  89.                     <div class="teamdb_line_name">Banner:</div>
  90.                     <div class="teamdb_line_text"><input type="file" id="banner" name="form[file]" size="50">
  91.                     <input type="hidden" name="MAX_FILE_SIZE" value="1000000"></div>
  92.                 </div>
  93.                 <div class="teamdb_line_wrapper">
  94.                     <div class="teamdb_line_name">About Us:</div>
  95.                     <div class="teamdb_line_text"><textarea id="body" name="body" rows="10" cols="60"></textarea></div>
  96.                 </div>
  97.                 <div class="teamdb_line_wrapper">
  98.                     <div class="teamdb_line_button"><input type="submit" value="Add New Team" onclick="getcontent(\'sys/ajaxCalls.php?acid=101&value=\'+document.getElementById(\'name\').value+\'-\'+document.getElementById(\'url\').value+\'-\'+document.getElementById(\'banner\').value+\'-\'+document.getElementById(\'body\').value,\'teamdb_container\')" /></div>
  99.                 </div>
  100.                 </form>
  101.             </div>
  102. </body>
  103. </html>
And then it goes here:
Expand|Select|Wrap|Line Numbers
  1. if($acid == 101) {
  2.           $value = explode('-',$value);
  3.           if(($value[0]!='') && ($value[1]!='') && ($value[2]!='') && ($value[3]!='')) {
  4.               //Store to DB query here
  5.                echo '<div id="teamdb_container">
  6.                       <meta http-equiv="refresh" content="2;url=teamdb.html">
  7.                       <div id="db_add_successful">Team has been added successfully!</div>
  8.                       <div id="redirect_msgs">You will be redirected in 2 seconds...</div>
  9.                     </div>';
  10.           }
  11.           else {
  12.               echo '<div id="teamdb_container">
  13.                 <form method="post" onsubmit="return AIM.submit(this, {\'onStart\' : startCallback, \'onComplete\' : completeCallback})">
  14.                 <div id="teamdb_title">/New Team</div>
  15.                 <div class="teamdb_line_wrapper">
  16.                     <div class="teamdb_line_name">Group Name:</div>
  17.                     <div class="teamdb_line_text"><input type="text" id="name" name="name" value="'.$value[0].'" size="40" maxlength="80" /></div>
  18.                 </div>
  19.                 <div class="teamdb_line_wrapper">
  20.                     <div class="teamdb_line_name">Website:</div>
  21.                     <div class="teamdb_line_text"><input type="text" id="url" name="url" value="'.$value[1].'" size="40" maxlength="80" /></div>
  22.                 </div>
  23.                 <div class="teamdb_line_wrapper">
  24.                     <div class="teamdb_line_name">Banner:</div>
  25.                     <div class="teamdb_line_text"><input type="file" id="banner" name="form[file]" size="50">
  26.                     <input type="hidden" name="MAX_FILE_SIZE" value="1000000"></div>
  27.                 </div>
  28.                 <div class="teamdb_line_wrapper">
  29.                     <div class="teamdb_line_name">About Us:</div>
  30.                     <div class="teamdb_line_text"><textarea id="body" name="body" rows="10" cols="60">'.$value[3].'</textarea></div>
  31.                 </div>
  32.                 <div class="teamdb_line_wrapper">
  33.                     <div class="teamdb_line_button"><input type="submit" value="Add New Team" onclick="getcontent(\'sys/ajaxCalls.php?acid=101&value=\'+document.getElementById(\'name\').value+\'-\'+document.getElementById(\'url\').value+\'-\'+document.getElementById(\'banner\').value+\'-\'+document.getElementById(\'body\').value,\'teamdb_container\')" /></div>
  34.                 </div>
  35.                 </form>
  36.             </div>';
  37.           }
  38.       }
May 8 '09 #17

Sign in to post your reply or Sign up for a free account.

Similar topics

31
by: Tony | last post by:
I just noticed that prototype.js is one of the files in the Ajax.NET distribution - I'm pretty concerned about this. Does anyone know if this is the same "prototype.js" that is not well-liked...
5
by: Martin | last post by:
Hello NG, I've been doing some AJAX for a few weeks now. The basics worked fine so far, but now I've got the following problem which I can't solve: With AJAX you typically update/replace only...
9
by: RBM007 | last post by:
Hello, I have created some pages in the (old) Atlas pages and migrated to AJAX version. After the update I noticed that any page containing ASP.NET AJAX won't compile anymore. Even if the same...
3
by: noballack | last post by:
I've got a problem, I'm working with Ajax in a web with a form with a list of checkbox added to the form via an Ajax.Updater method. These added checkboxs are not been sended by the form if I use...
5
by: lucyh3h | last post by:
Hi, I am trying to use XMLHttpRequest to do server side validation. I have several fields on a form and a submit button. The submit button has an event assocated with it when clicked. The...
0
by: BlipBlip | last post by:
Hi All, I was not sure which forum to post the message to since the problem related to ASP/AJAX, but decided to post it here. I have a simple routine which utilizes an Ajax to query database for...
0
by: Tarik Monem | last post by:
I have been working on an all AJAX/DOM web site which is set to go live today and I thought I'd share my discoveries with all of you whom have helped me when I have encountered different issues along...
2
by: shivendravikramsingh | last post by:
hi friends, i m using a ajax function for retrieving some values from a database table,and display the values in required field,my prob is that the ajax function i m using is working f9 once,but if...
7
xNephilimx
by: xNephilimx | last post by:
lHi guys! I'm having a little problem that's getting on my nerves, I couldn't find a solution, I also tryed googling it and I found nothing... (my field of expertise is in AS 2 and 3, but I still...
5
by: quirk | last post by:
I am trying to write a script where a page is populated with some maths questions, user answers them (it's timed but I've left this bit out), gets results on same page and ajax takes their score,...
1
isladogs
by: isladogs | last post by:
The next online meeting of the Access Europe User Group will be on Wednesday 6 Dec 2023 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, Mike...
0
by: veera ravala | last post by:
ServiceNow is a powerful cloud-based platform that offers a wide range of services to help organizations manage their workflows, operations, and IT services more efficiently. At its core, ServiceNow...
3
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 3 Jan 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). For other local times, please check World Time Buddy In...
0
by: jianzs | last post by:
Introduction Cloud-native applications are conventionally identified as those designed and nurtured on cloud infrastructure. Such applications, rooted in cloud technologies, skillfully benefit from...
0
by: mar23 | last post by:
Here's the situation. I have a form called frmDiceInventory with subform called subfrmDice. The subform's control source is linked to a query called qryDiceInventory. I've been trying to pick up the...
2
by: jimatqsi | last post by:
The boss wants the word "CONFIDENTIAL" overlaying certain reports. He wants it large, slanted across the page, on every page, very light gray, outlined letters, not block letters. I thought Word Art...
0
by: stefan129 | last post by:
Hey forum members, I'm exploring options for SSL certificates for multiple domains. Has anyone had experience with multi-domain SSL certificates? Any recommendations on reliable providers or specific...
1
by: davi5007 | last post by:
Hi, Basically, I am trying to automate a field named TraceabilityNo into a web page from an access form. I've got the serial held in the variable strSearchString. How can I get this into the...
0
by: MeoLessi9 | last post by:
I have VirtualBox installed on Windows 11 and now I would like to install Kali on a virtual machine. However, on the official website, I see two options: "Installer images" and "Virtual machines"....

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.