1

Webページに2つのドロップダウンリストがあり、一方は他方に依存しています。私が使用しているAjaxコードは、Chrome、Mozillaでは正常に機能していますが、IEでは機能していません(IE9を使用しています)。誰かがこれを修正するのを手伝ってくれませんか。

これはAjaxコードです-

 <script language="javascript" type="text/javascript">  
  var xmlHttp  
  var xmlHttp

  function showSubCategory(str){
      if (typeof XMLHttpRequest != "undefined"){
      xmlHttp= new XMLHttpRequest();
      }
      else if (window.ActiveXObject){
      xmlHttp= new ActiveXObject("Microsoft.XMLHTTP");
      }
      if (xmlHttp==null){
      alert("Browser does not support XMLHTTP Request")
      return;
      } 
      var url="jsp/subcategory.jsp";
      url +="?count=" +str;
      xmlHttp.onreadystatechange = stateChange1;
      xmlHttp.open("GET", url, true);
      xmlHttp.send(null);
      }

      function stateChange1(){   
      if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete"){   
      document.getElementById("subcat").innerHTML=xmlHttp.responseText   
      }   
      } 

これは、ドロップダウンリストがあるメインのjspページです。-

 <table>
     <tr>
<td align="right" width="10%">Category </td>
<td>
   <select id='category' name="adv.categoryNo" onchange="showSubCategory(this.value)">  
       <option >Select the Category</option>  
     <%
Class.forName("com.mysql.jdbc.Driver").newInstance();  
Connection con1 = DriverManager.getConnection("jdbc:mysql://localhost:3306/db","user","pwd");  
Statement stmt1 = con1.createStatement();  
ResultSet rs1 = stmt1.executeQuery("Select * from categories");
while(rs1.next()){
    %>
    <option value="<%=rs1.getString(2)%>"><%=rs1.getString(2)%></option>  
    <%
}
    %>
    </select>                                  
     </td>
    </tr>

   Second drop down list 


    <tr>
      <td align="right" width="10%">Subcategory <span class="mandatory">*</span>: </td>
       <td>
         <div id='subcategory'>  
         <select id='subcat'  name='subcategory'>  
         <option >Select the Subcategory</option>  
         </select>  
         </div>
    </td>
    </tr>

これは、Ajaxによって呼び出されるサブカテゴリのjspファイルです。

<%@page import="java.sql.*"%>
 <%
  String category=request.getParameter("count");  
   String buffer="<select name='adv.subCategoryNo'><option >Select the Subcategory</option>";  
 try{
  Class.forName("com.mysql.jdbc.Driver").newInstance();  
  Connection con = DriverManager.getConnection("jdbc:mysql://localhost:3306/db","user","pwd");  
  Statement stmt = con.createStatement();  
  ResultSet rs = stmt.executeQuery("Select * from subcategories where     categoryName='"+category+"' ");  
   while(rs.next()){
   buffer=buffer+"<option value='"+rs.getString(3)+"'>"+rs.getString(3)+"</option>";  
   }  
    buffer=buffer+"</select>";  
    response.getWriter().println(buffer); 
    }
   catch(Exception e){
    System.out.println(e);
    }
   %>

奇妙なことに、Ajaxコードの次の関数のgetElementByIdパラメーターを「 subcat」から2番目のドロップダウンリストをカバーするdiv idである「subcategory」に変更すると、IEや他のブラウザーで正常に機能します。

function stateChange1(){   
      if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete"){   
      document.getElementById("subcat").innerHTML=xmlHttp.responseText   
      } 

上記のアプローチに従うと、次のJSコードを使用して、そのサブカテゴリ選択ボックスのJavaScriptフォーム検証を行うことができません。

 function madeSelectionCity(){
  var subcat = document.getElementById('subcat');
if(subcat.value == "Select the City name"){
    alert("Please select a subcategory first");
    subcat.focus();
    return false;
}else{
    return true;
}
 }

私の質問がはっきりしていることを願っています。さらに説明が必要な場合はお知らせください。ありがとう

4

1 に答える 1

0

以下のコード行を変更します ( ajaxコードによって呼び出されるsubcategory.jsp内)。

 String buffer="<select name='adv.subCategoryNo'><option >Select the Subcategory</option>";  

 String buffer="<select id='subcat' name='adv.subCategoryNo'><option >Select the Subcategory</option>";  

また、このコード行を追加します(ajaxコードによって呼び出されるsubcategory.jsp内)

response.setContentType("text/html");

ウェブページ(メインページ)で、htmlは

 <div id='subcategory'>
 </div>

そしてajax(メインページ)コードは

function stateChange1(){   
      if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete"){   
      document.getElementById("subcategory").innerHTML=xmlHttp.responseText   
      } 
于 2012-04-27T11:39:58.413 に答える