2015-01-22 13 views
-3

У меня есть две страницы jsp. newEmployee.jsp и editData.jsp, оба имеют srcipt, связанный с myjScript.js. Как только пользователь отправляет информацию о состоянии и стране в newEmployee.jsp, он приходит к editData.jsp.ajax url not found "NetworkError: 404 Not Found"

Теперь, в сценарии (то есть на той же странице) раздела editData.jsp, у меня есть вызов ajax, который должен срабатывать до SelectEditData.java, но он говорит, что не найден. (это сервлет).

@WebServlet("/SelectEditData") 
public class SelectEditData extends HttpServlet { 
    private static final long serialVersionUID = 1L; 

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { 
     // TODO Auto-generated method stub 
     System.out.println("inside edit data servlet"); 

     JsonArray data_json = new JsonArray(); 

     try { 
      Connection con = ConnectionClass.getConnecton(); 
      Statement st = con.createStatement(); 
      String query = "SELECT * FROM selectboxschema.new_table"; 
      System.out.println("details query " + query); 
      ResultSet rs = st.executeQuery(query); 
      JsonObject json_response = new JsonObject(); 
      while (rs.next()) { 

       System.out.println("result set: " + rs.getString(1)); 
       System.out.println("result set: " + rs.getString(2)); 

       JsonObject json = new JsonObject(); 
       json.addProperty("firstData", rs.getString(1)); 
       json.addProperty("secondData", rs.getString(2)); 

       data_json.add(json); 
      } 


      json_response.add("aData", data_json); 
      System.out.println("json response: " + json_response.toString()); 
      response.setContentType("application/Json"); 

      response.getWriter().write(json_response.toString()); 



     } catch (Exception e) { 
      System.out.println("exception caught in edit data servlet" + e.getStackTrace()); 
     } 
    } 

} 

//this is jScript.js 
 

 
function populateStates(countryElementId, stateElementId) { 
 

 
\t var selectedCountryIndex = document.getElementById(countryElementId).selectedIndex; 
 

 
\t var stateElement = document.getElementById(stateElementId); 
 

 
\t stateElement.length = 0; // Fixed by Julian Woods 
 
\t stateElement.options[0] = new Option('Select State', ''); 
 
\t stateElement.selectedIndex = 0; 
 

 
\t var state_arr = s_a[selectedCountryIndex].split("|"); 
 

 
\t for (var i = 0; i < state_arr.length; i++) { 
 
\t \t stateElement.options[stateElement.length] = new Option(state_arr[i], 
 
\t \t \t \t state_arr[i]); 
 
\t } 
 
} 
 

 
function populateCountries(countryElementId, stateElementId) { 
 
\t // given the id of the <select> tag as function argument, it inserts 
 
\t // <option> tags 
 
\t var countryElement = document.getElementById(countryElementId); 
 
\t countryElement.length = 0; 
 
\t countryElement.options[0] = new Option('Select Country', '-1'); 
 
\t countryElement.selectedIndex = 0; 
 
\t for (var i = 0; i < country_arr.length; i++) { 
 
\t \t countryElement.options[countryElement.length] = new Option(
 
\t \t \t \t country_arr[i], country_arr[i]); 
 
\t } 
 

 
\t // Assigned all countries. Event listener for the states. 
 

 
\t if (stateElementId) { 
 
\t \t countryElement.onchange = function() { 
 
\t \t \t populateStates(countryElementId, stateElementId); 
 
\t \t }; 
 
\t } 
 
}

//this is the editData.jsp 
 

 

 

 
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" 
 
    pageEncoding="ISO-8859-1"%> 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
 
<html> 
 
<head> 
 
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.10.2.js"></script> 
 
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jScript.js"></script> 
 
<script type="text/javascript"> 
 

 
\t alert("ready of edit"); 
 
\t 
 
\t $.ajax({ 
 
\t \t 
 
\t \t type : "GET", 
 
\t \t url : "SelectBoxEdit/SelectEditData", 
 
\t \t dataType : "json", 
 

 
\t \t success : function(data) { 
 
\t \t \t console.log(data); 
 

 
\t \t \t $.each(data.aData, function(i, obj) { 
 
\t \t \t \t alert("data: " + obj.firstTable); 
 
\t \t \t \t var div_data = "<option selected=" 
 
\t \t \t \t \t \t + "selected" + ">" 
 
\t \t \t \t \t \t + obj.firstData + "</option>"; 
 
\t \t \t \t alert(div_data); 
 
\t \t \t \t console.log(div_data); 
 
\t \t \t \t $(div_data).appendTo('#country'); 
 
\t \t \t \t 
 
\t \t \t \t 
 
\t \t \t }); 
 
\t \t } 
 
\t }); 
 

 
</script> 
 

 

 

 

 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
 
<title>Insert title here</title> 
 
</head> 
 
<body> 
 

 
<div> 
 
     <hr/> 
 
     <br/>Select Country (with states): 
 
     <select id="country" name="country"></select> 
 
     <br />State: 
 
     <select name="state" id="state"></select> 
 
     <br/> 
 
     
 
     <script language="javascript"> 
 
\t \t  populateCountries("country", "state"); 
 
     
 
     </script> 
 
     <br/> 
 
     <br/> 
 
     <br /> 
 
     <br /> 
 
     <input type="button" id="submitBtn"> 
 
</div> 
 

 

 
</body> 
 
</html>

+1

Проверьте ваш Аякса URL правильно или нет –

+0

, когда я запускаю выше код он дает следующее сообщение об ошибке в поджигатель "NetworkError: 404 Not Found - HTTP: // локальный: 8080/SelectBoxEdit/SelectBoxEdit/SelectEditData" когда я меняю его на url: «/ SelectEditData» он дает: «NetworkError: 404 Not Found - http: // localhost: 8080/SelectEditData» –

+0

Есть ли способ динамически получить URL-адрес и просто добавить «/ SelectEditData» в Это . Я думаю, что это должно сработать. Но я не знаю, как динамически получить URL. Спасибо за ваше время. –

ответ

0

Чтобы ваш запрос URL является правильным.

  1. использовать /yourServletPath, это сгенерирует URL-адрес запроса, такой как http://localhost:8080/yourServletPath. который не имеет контекстного тракта.
  2. если вы должны добавить контекстный путь, и, возможно, ваш контекстный путь изменится позже. Вы можете добавить <input type="hidden" id="request_url" value="<%=request.getContextPath() %>/yourServletPath"/>, а затем, когда вы выполните запрос ajax, вы можете использовать его в своем javascript-коде, например: $('#request_url').val().
+0

Не беспокойтесь о вводе скрытой формы - OP может быть просто в строке (перед предупреждением) следующим образом: var ctxPath = "$ {pageContext.request.contextPath}"; –

+0

Спасибо, но я попытался использовать $ ('# request_url'). Val() в предупреждении, но он показал неопределенный. –

+0

@DaveG Я попробовал и получил URL. url: ctxPath + "/ SelectEditData", Но все же сервлет не попал. Я получил эту ошибку: NetworkError: 404 Not Found - http: // localhost: 8080/SelectBoxEdit/SelectEditData Я использую anotation для сопоставления сервлета и не отображаемого в web.xml. Это вопрос по какой-то причине? –