Databases
StackOverflow2013
Postsdbo
POAjax dependable drop down list issue in Internet Explorer
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POAjax dependable drop down list issue in Internet Explorer
    primarykey
    data
    text
    <p>I have two drop down list in my webpage and one is dependent on the other. The Ajax code i am using is working fine in Chrome, Mozilla but not in IE (i am using IE9). Can someone please help me in getting this corrected.</p> <p>This is the Ajax code-</p> <pre><code> &lt;script language="javascript" type="text/javascript"&gt; 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 } } </code></pre> <p> </p> <p>This the main jsp page where the drop down lists are.--</p> <pre><code> &lt;table&gt; &lt;tr&gt; &lt;td align="right" width="10%"&gt;Category &lt;/td&gt; &lt;td&gt; &lt;select id='category' name="adv.categoryNo" onchange="showSubCategory(this.value)"&gt; &lt;option &gt;Select the Category&lt;/option&gt; &lt;% 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()){ %&gt; &lt;option value="&lt;%=rs1.getString(2)%&gt;"&gt;&lt;%=rs1.getString(2)%&gt;&lt;/option&gt; &lt;% } %&gt; &lt;/select&gt; &lt;/td&gt; &lt;/tr&gt; Second drop down list &lt;tr&gt; &lt;td align="right" width="10%"&gt;Subcategory &lt;span class="mandatory"&gt;*&lt;/span&gt;: &lt;/td&gt; &lt;td&gt; &lt;div id='subcategory'&gt; &lt;select id='subcat' name='subcategory'&gt; &lt;option &gt;Select the Subcategory&lt;/option&gt; &lt;/select&gt; &lt;/div&gt; &lt;/td&gt; &lt;/tr&gt; </code></pre> <p>Here is the <strong>subcategory</strong> jsp file which is called by Ajax.</p> <pre><code>&lt;%@page import="java.sql.*"%&gt; &lt;% String category=request.getParameter("count"); String buffer="&lt;select name='adv.subCategoryNo'&gt;&lt;option &gt;Select the Subcategory&lt;/option&gt;"; 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+"&lt;option value='"+rs.getString(3)+"'&gt;"+rs.getString(3)+"&lt;/option&gt;"; } buffer=buffer+"&lt;/select&gt;"; response.getWriter().println(buffer); } catch(Exception e){ System.out.println(e); } %&gt; </code></pre> <p>Strange thing is if i change the <strong>getElementById</strong> param in the following function of the Ajax code from "<strong>subcat</strong>" to "<strong>subcategory</strong>" which is the div id covering the second drop down list, it works fine in IE and other browsers.</p> <pre><code>function stateChange1(){ if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete"){ document.getElementById("subcat").innerHTML=xmlHttp.responseText } </code></pre> <p>If i follow the above approach i am not able to do any javascript form validation for that Subcategory select box using the following JS code.</p> <pre><code> 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; } } </code></pre> <p>Hope i am clear in my question. Please let me know if any more explanation is required. Thanks</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USBhaskar Sharma
    1. USBhaskar Sharma
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POAjax dependable drop down list issue in Internet Explorer
      1. This table or related slice is empty.
      1. VTUpMod
    1. COcan you post the **responseText** of the **XMLHttpRequest** object.
      singulars
      1. POAjax dependable drop down list issue in Internet Explorer
      1. USRavi Jain
    2. COplease let me know whether my answer works or not.
      singulars
      1. POAjax dependable drop down list issue in Internet Explorer
      1. USRavi Jain
    3. COi have edited my answer. Please take look at it. Answer to your first comment is yes, change the html code , it should work.
      singulars
      1. POAjax dependable drop down list issue in Internet Explorer
      1. USRavi Jain
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload