Проблема с сервлетом Ajax

Question

Проблема заключается в том, что если я сделаю поиск, результаты будут возвращены, то вскоре после завершения процесса страница перейдет на сервлет с данными json raw. Здесь я смущен.

Это JSP отправляет форму

<form class="col-lg-12" action="./urllinks" method="GET" id="searchform"> 

         <div class="input-group" 
          style="width: 340px; text-align: center; margin: 0 auto;"> 
          <input class="form-control input-lg" title="Make a wish !." 
           placeholder="Go on and search ! Don't be shy :p" type="text" id="box" 
           name="query"> <span class="input-group-btn"><button 
            class="btn btn-lg btn-primary" id="searchresult" type="submit">Search</button></span> 
         </div> 

</form> 

Это Servlet doGET

String word = request.getParameter("query"); 
    List<Page> results = DynamoDbMethods.search(word); 

    String reply = new Gson().toJson(results); 

    response.setContentType("text/json"); 
    response.setHeader("Cache-Control", "no-cache"); 
    response.getWriter().write(reply); 

Это Javascript AJAX

$('#searchform').submit(function(){ 
      var query = $("#box").val(); 

     // alert(query); 
      $.ajax({ 
       target:"#map", 
       dataType: "json", 
       type: 'GET', 
       data:{query: query}, 
       url: 'http://localhost:8080/path/urllinks', 
       success: function(response) { 
        successCallback(response);} 

      }); 
     }); 

function successCallback(responseObj){ 
    #This function just prints the data on a table 
    #e.g 
$.each(responseObj, function(index, element){ alert(element.title);} 

} 

Я попытался устранить: action="./urllinks" method="GET", но затем данных нет

Answer 1

Похоже, что вы не предотвратили отправку по умолчанию без аякса из триггера.

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

$(document).ready(
    function() { 
     $('#searchform').submit( 
      function(event) { 
       event.preventDefault(); 
       //rest of code 
      } 
     ); 
    } 
); 

Существует на самом деле плагин Jquery на ниже, где вы можете уменьшить все шаблонное на пару строк JS.

http://jquery.malsup.com/form/