SitePoint Sponsor |
|
User Tag List
Results 1 to 17 of 17
Thread: jquery form submission help
-
Jul 1, 2008, 02:49 #1
jquery form submission help
Hi,
I am trying to run a simple jQuery script that would load a php page "load.php" on click of a submit button and the load.php page would return the value of "tname" variable which is "John" in this case.
Following is my jQuery script.
Code:<script src="jquery-1.2.6.js"></script> <script> $(document).ready(function(){ $("form#myform").submit(function() { $.get("load.php", { tname: "John", ttime: "2pm" }); $("#quote").load("load.php"); return false; }); }); </script> <div id="quote"></div> <form method="post" id="myform"> <input name="submit" type="submit" value="Submit" /> </form>
PHP Code:<?php
echo $_GET['tname'];
?>
Can you help me plz?
Thanx
-
Jul 1, 2008, 03:10 #2
- Join Date
- Aug 2007
- Location
- Brighton, UK
- Posts
- 2,006
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
You need to set the form action attribute to "get" if you want it to work with ur PHP script.
★ James Padolsey
–––––––––––––––––––––––––––––––––––––––
Awesome JavaScript Zoomer (demo here)
'Ajaxy' - Ajax integration solution (demo here)
-
Jul 1, 2008, 03:14 #3
- Join Date
- Aug 2007
- Location
- Brighton, UK
- Posts
- 2,006
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Nvrmnd I see you're using the GET method in jQuery - Although, you will need to create a non-JS fallback.
You need to do something with the response data so:
Code JavaScript:$.get("load.php", { tname: "John", ttime: "2pm" },function(data){ $("#quote").append(data); });
★ James Padolsey
–––––––––––––––––––––––––––––––––––––––
Awesome JavaScript Zoomer (demo here)
'Ajaxy' - Ajax integration solution (demo here)
-
Jul 1, 2008, 03:16 #4
can u show me an example plz?
-
Jul 1, 2008, 03:18 #5
- Join Date
- Aug 2007
- Location
- Brighton, UK
- Posts
- 2,006
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
? Look above?
★ James Padolsey
–––––––––––––––––––––––––––––––––––––––
Awesome JavaScript Zoomer (demo here)
'Ajaxy' - Ajax integration solution (demo here)
-
Jul 1, 2008, 03:35 #6
in the load.php page, if I put the following code
PHP Code:
<?php
echo $_GET['tname']." There you go...";
?>
-
Jul 1, 2008, 04:01 #7
- Join Date
- Aug 2007
- Location
- Brighton, UK
- Posts
- 2,006
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Did you delete this line? -
Code JavaScript:$("#quote").load("load.php");
★ James Padolsey
–––––––––––––––––––––––––––––––––––––––
Awesome JavaScript Zoomer (demo here)
'Ajaxy' - Ajax integration solution (demo here)
-
Jul 1, 2008, 04:04 #8
Yes. still in vain.
-
Jul 1, 2008, 04:10 #9
- Join Date
- Aug 2007
- Location
- Brighton, UK
- Posts
- 2,006
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Weird... It works for me...
This is what I'm using:
Code html4strict:<!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>test</title> <script type="text/javascript" src="jquery.js"></script> </head> <body> <script type="text/javascript"> $(document).ready(function(){ $("form#myform").submit(function() { $.get("load.php", { tname: "John", ttime: "2pm" },function(data){ $("#quote").append(data); }); return false; }); }); </script> <div id="quote"></div> <form method="post" id="myform"> <input name="submit" type="submit" value="Submit" /> </form> </body> </html>
PHP (load.php)
Code php:<?php echo $_GET['tname']." There you go..."; ?>
★ James Padolsey
–––––––––––––––––––––––––––––––––––––––
Awesome JavaScript Zoomer (demo here)
'Ajaxy' - Ajax integration solution (demo here)
-
Jul 1, 2008, 04:17 #10
Yes it works now.
Could u plz tell me what does this line mean?
Code:$("#quote").load("load.php");
-
Jul 1, 2008, 04:22 #11
- Join Date
- Aug 2007
- Location
- Brighton, UK
- Posts
- 2,006
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Well, all that line would do is load all the contents of "load.php" into #quote - So you could theoretically do this:
Code JavaScript:$("#quote").load("http://www.google.com");
Although that would be pretty pointless.
You don't have to use $.get - you could do something like this:
Code JavaScript:$("#quote").load("load.php?tname=john&ttime=2pm");
Using $.get is best though...★ James Padolsey
–––––––––––––––––––––––––––––––––––––––
Awesome JavaScript Zoomer (demo here)
'Ajaxy' - Ajax integration solution (demo here)
-
Jul 1, 2008, 04:44 #12
ahhh!!! gotcha.
Seems you are a JS expert.
Thanx for all your help.
-
Jul 1, 2008, 23:03 #13
Hi again
How do I do the same thing using $.post method?
Thanx
-
Jul 1, 2008, 23:53 #14
- Join Date
- Aug 2007
- Location
- Brighton, UK
- Posts
- 2,006
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Very simple, just change "get" to "post". ($.get --> $.post)
Also change it in your PHP script ($_GET --> $_POST)...★ James Padolsey
–––––––––––––––––––––––––––––––––––––––
Awesome JavaScript Zoomer (demo here)
'Ajaxy' - Ajax integration solution (demo here)
-
Jul 1, 2008, 23:58 #15
so do i still have to pass the parameters if its post or will it detect all the form variables automatically?
-
Jul 2, 2008, 00:19 #16
- Join Date
- Aug 2007
- Location
- Brighton, UK
- Posts
- 2,006
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
It won't detect them - you could loop through them like shown in this screencast though: http://remysharp.com/wp-content/uplo...ajax_forms.mov
★ James Padolsey
–––––––––––––––––––––––––––––––––––––––
Awesome JavaScript Zoomer (demo here)
'Ajaxy' - Ajax integration solution (demo here)
-
Jul 2, 2008, 00:19 #17
- Join Date
- Aug 2007
- Location
- Brighton, UK
- Posts
- 2,006
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
If it's only a few fields adding them individually would probably be best...
★ James Padolsey
–––––––––––––––––––––––––––––––––––––––
Awesome JavaScript Zoomer (demo here)
'Ajaxy' - Ajax integration solution (demo here)
Bookmarks