views:

85

answers:

3

I'm trying to get this to work, but no luck. It's 3am, so that may be the problem. What am I missing here?

I'm trying to insert some data via jQuery to a local MySQL table. If I run save.php on its own, it inserts a blank row in the DB, so that works. Any ideas?

**index.php**

<html>
 <head>
  <link rel="stylesheet" type="text/css" href="css/style.css" />

  <script src="jquery.js" type="text/javascript"></script>

  <script type="text/javascript">
   $(document).ready(function() {
    $('form#submit').submit(function () {
     var nume = $('#nume').val();
     $.ajax({
      type: "POST",
      url: "save.php",
      data: "nume="+ nume,
      success: function() {
       $('#nume').val('');
      }
     });
    return false;
    });
   });
  </script>
 </head>

 <body>

  <form id="submit" method="post">
   <p>Nume: <input id="nume" name="nume"  type="text"></p>
   <p><input id="submitButton" type="button" value="Submit"></p>
  </form>

 </body>
</html>


**save.php**

<?php
 mysql_connect('localhost', 'root', 'root') or die(mysql_error());
 mysql_select_db("test") or die(mysql_error());

 $nume = htmlspecialchars(trim($_POST['nume']));

 $add = "INSERT INTO ajax_test (nume) VALUES ('$nume')";
 mysql_query($add) or die(mysql_error());
?>
+2  A: 

Are you sure the form is submitting? Your button is not an input type="submit" - it's just a button. It won't submit the form on its own.

Scott Saunders
I changed it back it to type="submit", and now the page reloads, but it shouldn't.
Norbert
Try adding a space in $('form #submit')
Scott Saunders
if you use preventDefault(); you should be able to stop it reloading.use like this:$('form#submit').submit(function (e) {e.preventDefault();[rest of your code]});
andy-score
Returning false from the submit function should prevent the page reload as well (the form is submitting to the same page since no action is set in the form tag). But it seems that the submit function is not being set on the form because the jQuery selector is not correct. It needs to be $('form #submit')
Scott Saunders
+1  A: 

If the solution of Scott Saunders does not work try this:

instead of

url: "save.php",

try:

url: "save.php?nume=testvalue",

If that also does not work, check if your PHP script reads the input value out of $_GET['nume'] or $_POST instead of $_REQUEST['nume']

powtac
Tried every solution, it doesn't seem to work.
Norbert
Change $_POST['nume'] in your save.php into $_REQUEST['nume'] and call save.php?nume=testvalue in your browser then check if this value appears in the DB.
powtac
I don't know what I did, but now it seems to be working. And the save.php is still set to $_POST.
Norbert
+1  A: 

couple of things you could do to help with troubleshooting.

Stick an alert alert("submit"); in after the $('form#submit').submit(function () { to see if the form is submitting. Also stick one in the success alert("success"); to see if you're getting a callback. This will show you at what stage it's failing and help you liit your search.

You can also use the firebug plugin for firefox to see what's being sent via ajax, if it's working, to see if you've got any values wrong. Think you need to tick Show XMLHttpRequests in Console

andy-score