JQuery, AJAX: невозможно вставить данные из формы и вернуться на ту же страницу

Question

Я пытаюсь вставить информацию из формы в таблицу базы данных и затем вернуться на ту же страницу с предупреждением об успехе или сбое. Однако я не могу заставить его работать. Вот что у меня сейчас есть ...

ФОРМА HTML

  <form id="add-menu-item">
     <input type="text" name="name" class="formbox">
      <input type="text" name="price" class="formbox">
  <input type="submit" class="form-submit-button">
  </form>

Jquery

    $("#add-menu-item").click(function()
    {
        addMenuItem();

    });

function addMenuItem()
{
    var t_name    = $("#add-menu-item [name='name']").val();
    var t_price   = $("#add-menu-item [name='price']").val();
    var errors  = '';

    $.ajax({
        type    : "GET",
        url     : "insert.php",
        data    : { name  : t_name,
                    price : t_price, },
        cache   : false, timeout: 10000,

        success  : function() {
            alert("WORKED!");
        },
        error    : function() {
            alert("DIDN'T WORK!");
        },
        complete : function() {
        }
    });
});

insert.php

<?php

include_once('_code/connectdb.php');
include_once('_code/functions.php');

$name = mysql_real_escape_string($_POST['name']);
$price = mysql_real_escape_string($_POST['price']);
$error = '';

$query = "INSERT INTO menuitems ( name, price ) VALUES ('{$name}', '{$price}')";

if (!mysql_query($query, $conn))
{
    $error = mysql_error();
    $return['error'] = $error;
    echo json_encode($return);
    mysql_close($conn);
}
else
{
    $success = "Menu Item Successfully Added!";
    $return['mysql'] = $success;
   echo json_encode($return);
    mysql_close($conn);
}

?>

Спасибо

Answer 1

Используйте FireBug или подобное программное обеспечение для простого обнаружения ошибок этого типа ......................

Answer 2

Не знаю, что не работает. Однако я думаю:

$("#add-menu-item").click(function() {
  addMenuItem();
});

Должно быть:

$("#add-menu-item").submit(function() { // you want the action to perform on submit of form and not on click??? on form
  addMenuItem();
  return false; // to prevent submitting the form after ajax stuff is done
});

И я думаю:

data    : { name  : t_name,
                    price : t_price, },

Должно быть:

data: ({name : t_name, price : t_price}),

Хотя последний точно не знаю: http://api.jquery.com/jQuery.ajax/#example-5