One of my friends was trying to accomplish a no postback dropdown combo using JavaScript and while searching on Google, he downloaded code from here and found that there were minor bugs in the code. Since he was still in college and had shortage of time, he sent the script to me for debugging.
I am pasting a debugged and trimmed version of that code just in case anybody else needs it. You can download an MDB file to use with this code from the link pasted above. This code populates 2nd dropdown list from database based on the input selected for first dropdown and works without a postback. And on a separate note – This is okay for small lists but for populating larger lists, you need to use XMLHttpRequest object to fetch data from the server. I will write an article on that sometime soon.
<%@LANGUAGE="VBSCRIPT"%>
<html>
<head>
<%
dim connstring, sqlstring, rs, conn
connstring = "Provider=Microsoft.Jet.OLEDB.4.0; Data Source=c:\inetpub\wwwroot\DependentLists.mdb"
set conn = Server.CreateObject("ADODB.Connection")
conn.open(connstring)
sqlstring = "select * from classfd_subcategory"
set rs = conn.execute(sqlstring)
x=0
%>
<script language = "JavaScript">
function sublist(inform, selecteditem)
{
inform.subcategory.length = 0
<%
count= 0
y=0
do while not rs.eof
%>
x = <%= trim(y) %>
subcat = new Array();
subcategorys = "<%= trim(rs("subcategory"))%>"
subcategoryof = "<%= trim(rs("subcat_of"))%>"
subcategoryid = "<%= trim(rs("subcategory_id"))%>"
subcat[x,0] = subcategorys;
subcat[x,1] = subcategoryof;
subcat[x,2] = subcategoryid;
if (subcat[x,1] == selecteditem)
{
var option = new Option(subcat[x,0], subcat[x,2]);
inform.subcategory.options[inform.subcategory.length]=option ;
}
<%
count = count + 1
y = y + 1
rs.movenext
loop
%>
}
</script>
<title>Submit an Ad</title>
<LINK rel="stylesheet" type="text/css" href="style/summary.css">
</HEAD>
<BODY onLoad = "sublist(document.subad,document.subad.category_
[document.subad.category.selectedIndex].value)">
<form name = subad action = "thankyouad.asp" >
<Table>
<%
cat = Request.QueryString("cat")
sqlstring = "SELECT * from classfd_category"
set rs = conn.execute (sqlstring)
%>
<tr>
<td>category</td>
</tr>
<tr>
<td>
<SELECT id=category name=category onChange="javascript:sublist_
(this.form, document.subad.category[document.subad.category.selectedIndex].value)">
<OPTION selected value=""></OPTION>
<%
do until rs.eof
%>
<OPTION value="<%= rs("category_id")%>">_
<% = rs("category")%></OPTION>
<%
rs.movenext
loop
set rs = nothing
%>
</SELECT></td>
</tr>
<tr>
<td><SELECT id = "subcategory" name="subcategory">
<Option selected value="none">————————-</option>
</SELECT>
</td>
</tr>
</table >
</form>
</BODY>
</HTML>
<script type="text/javascript">// <![CDATA[
google_ad_client = "pub-1008722237038581";
/* 468x60, created 9/5/08 */
google_ad_slot = "9526576849";
google_ad_width = 468;
google_ad_height = 60;
// ]]></script>
<script type="text/javascript" _
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">// <![CDATA[
// ]]></script>
ASP self populating dropdown list using JavaScript is a post from CoolWebDeveloper.com
I am a Senior Systems Developer with a leading financial firm in Toronto. I am a technology enthusiast and have worked on several large enterprise level projects.
You can visit my blog here: http://www.coolwebdeveloper.com
Submit an article or tip
