jquery webを使用して同じページの別のHTMLから得られた結果を表示する

Question

以下は私のhtmlとjqueryのコードです。次のページに行くのではなく、同じページのsubmitボタンの結果をdsiplayしたいと思います。しかし、それは私に結果を返していないし、次のページに行く。 HTMLコード

<form id="create" action="/engine_search/search/" method="get"> 
          <input style="height:40px;" type="text" class="form-control" placeholder="Search" name="q"> 
          <center> 
          <input style="float:left; margin-left:150px;" type="submit" class="btn btn-default" value="Search"> 
           </center> 
         </form> 

jqueryのコードは：

<script> 
$(document).ready(function() { 
$('#create').submit(function() { // catch the form's submit event 
    $.ajax({ // create an AJAX call... 
     data: $(this).serialize(), // get the form data 
     type: $(this).attr('method'), // GET or POST 
     url: $(this).attr('action'), // the file to call 
     success: function(response) { // on success.. 
      $('#created').html(response); // update the DIV 
     } 
    }); 
    return false; // cancel original event to prevent form submitting 
}); 
}); 
</script> 

Answer 1

<input style="float:left; margin-left:150px;" type="submit" class="btn btn-default" value="Search" onclick="return SubmitFunction(this);"> 

Javascriptを：

function SubmitFunction(thisId){ 
$.ajax({ // create an AJAX call... 
    data: $(thisId).serialize(), // get the form data 
    type: $(thisId).attr('method'), // GET or POST 
    url: $(thisId).attr('action'), // the file to call 
    success: function(response) { // on success.. 
     $('#created').html(response); // update the DIV 
    } 
}); 

return false; // cancel original event to prevent form submitting 

}

Answer 2

あなたはすべてのエラーのためにコンソール用event.preventDefault();

<script> 
$(document).ready(function() { 
$('#create').submit(function(event) { // catch the form's submit event 
    event.preventDefault(); 
    $.ajax({ // create an AJAX call... 
     data: $(this).serialize(), // get the form data 
     type: $(this).attr('method'), // GET or POST 
     url: $(this).attr('action'), // the file to call 
     success: function(response) { // on success.. 
      $('#created').html(response); // update the DIV 
     } 
    }); 
    return false; // cancel original event to prevent form submitting 
}); 
}); 
</script> 

ルックを使用する必要があります。それは役に立つかもしれません。