CaptainChainsaw Posted October 12, 2009 Share Posted October 12, 2009 Hi all, I've just started messing around with AJAX. I have a problem when clicking the "button" to submit the form. What it should do is retrieve a value from the database but instead it prints the value of the button. I believe its submitting the form contents twice because there is a function being called twice. I really don't know what I'm doing with it though. I just want the input box to display on the screen whatever is typed into it, that works its just the clicking of the button to retrieve the value from the db that doesn't. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> <title>Ajax With Jquery</title> <!-- <script src="http://code.jquery.com/jquery-latest.pack.js" type="text/javascript" charset="utf-8"></script> --> <script src="jquery-1.3.2.min.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript" charset="utf-8"> $(document).ready(function(){ $('#txtValue').keyup(function(){ sendValue($(this).val()); }); $('#button').click(function(){ sendValue($(this).val()); }); }); function sendValue(str){ $.post("ajax.php",{ sendValue: str }, function(data){ $('#display').html(data.returnValue); $('#votes').html(data.returnVotes); }, "json"); } </script> </head> <body> <label for="txtValue">Enter a value : </label> <form> <input type="text" name="txtValue" value="" id="txtValue"> </form> <form> <input type="button" name="button" value="button" id="button"> </form> <div id="display"></div> <div id="votes"></div> </body> </html> Code to talk to the DB: <?php $dbhost = 'localhost'; $dbuser = 'root'; $dbpass = ''; $conn = mysql_connect($dbhost, $dbuser, $dbpass) or die ('Error connecting to mysql'); $dbname = 'dbname'; mysql_select_db($dbname); //Get Post Variables. The name is the same as //what was in the object that was sent in the jQuery if (isset($_POST['sendValue'])){ $value = $_POST['sendValue']; }else{ $value = ""; } $button = (isset($_REQUEST['button'])) ? $_REQUEST['button'] : ''; if ($button){ $votes=''; $result=mysql_query("SELECT votes FROM vote"); if($row=mysql_fetch_array($result)){ $votes=$row['votes']; } }else{ $votes = 0; } //Because we want to use json, we have to place things in an array and encode it for json. //This will give us a nice javascript object on the front side. echo json_encode(array("returnValue"=>"This is returned from PHP : ".$value, 'returnVotes' => $votes)); ?> This is probably a very simple problem to solve, any ideas? Thnx again, CaptainChainsaw Quote Link to comment https://forums.phpfreaks.com/topic/177467-solved-ajax-n00b-multiple-form-submission/ Share on other sites More sharing options...
CaptainChainsaw Posted October 13, 2009 Author Share Posted October 13, 2009 Creating an additional function and corresponding backend code fixed this: function sendVotes(str){ $.post("ajax.php",{ sendVotes: str }, function(data){ $('#votes').html(data.returnVotes); }, "json"); } Quote Link to comment https://forums.phpfreaks.com/topic/177467-solved-ajax-n00b-multiple-form-submission/#findComment-936421 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.