Используйте AJAX / JQuery для отправки формы и отображения результатов без перезагрузки

Question

Я пытаюсь использовать jquery и ajax для отправки формы и отображения результатов без перезагрузки.Как ваша типичная настройка комментирования ajax.

Мой HTML настроен так:

    <form id="create_new_heading" action="/display.php?brand=1" method="post">

          <label for="entry">Heading:</label><br/>
          <input type="text" id="heading" name="heading" maxlength="150"/><br/>

          <input type="submit" value="Add this Heading" />
    </form>
    <div id="result">

   </div>

JS:

    <script>
      /* attach a submit handler to the form */
      $("#create_new_heading").submit(function(event) {

        /* stop form from submitting normally */
        event.preventDefault(); 

        /* get some values from elements on the page: */
        var $form = $( this ),
            term = $form.find( 'input[name="heading"]' ).val(),
            url = $form.attr( 'action' );

        /* Send the data using post and put the results in a div */
        $.post( url, { s: term },
          function( data ) {
              var content = $( data ).find( '#test_me' );
              $( "#result" ).empty().append( content );
          }
        );
      });
    </script>

Процессор форм выглядит следующим образом:

public function write($p) {
    if ( $_POST['type'] )
      $type = mysql_real_escape_string($_POST['type']);
    if ( $_POST['heading'])
      $heading = mysql_real_escape_string($_POST['heading']);
    if ( $type && $heading ) {
      $uniqueid = uniqid();
      $sql = "INSERT INTO headings VALUES('$type','$heading','$uniqueid')";
      return mysql_query($sql);
    } else {
      return false;
    }
  }

Я пыталсяследовать документации JQuery для реализации этого, но я не могу заставить его работать.Форма отправляется, и запись помещается в базу данных, но мне все еще нужно обновить страницу, чтобы увидеть новую запись.Есть идеи, что я делаю не так?

Answer 1

Можете ли вы проверить на firebug, кеширует ли запрос.У меня была похожая проблема, и я начал давать random_id вместе с параметром, и он работал нормально.

Надлежащим образом можно было бы включить заголовок Cache-Control (или), установив прошедшее время как время истечения.

Answer 2

Почему бы не взять .empty()

$( "#result" ).append( content );

Или попробуйте

$( "#result" ).html( content );