...

View Full Version : populating multiple combobox after selecting one combobox



asamaiya
12-14-2009, 03:48 PM
<html>
<script language="javascript">
function foo()
{
var mainDiv = document.getElementById("my");
var div = document.createElement("div");
for(j=0;j<5;j++)
{
var select = document.createElement("select");
for(i=0;i<5;i++)
{
var option = document.createElement("option");
option.text = "hmm";
select.appendChild(option);
}
div.appendChild(select);
}
mainDiv.appendChild(div);
}

</script>
<body>
<select onchange="foo()">
<option>a</option>
<option>b</option>
<option>c</option>
<option>d</option>
<option>e</option>
<option selected>-----Select------</option>
</select>
<div id="my"></div>
</body>
</html>


I stuck ... but I got the solution
now I want to reset on every selection
?

Philip M
12-14-2009, 04:23 PM
[QUOTE=asamaiya;899245
I stuck ... but I got the solution
now I want to reset on every selection
?[/QUOTE]

As before, clear as mud. What does "reset" mean? You really must explain yourself more clearly if you want people to spend time on your problem.

BTW, please help us to help you by following the posting guidelines and wrapping your code in [code] tags. This means use the octothorpe or # button on the toolbar which will insert opening [ code ] and closing [ /code ] tags - omit the spaces. You can (and should) edit your previous post.

asamaiya
12-14-2009, 04:47 PM
after seleting one selectbox some more select boxes are appearing ...but all the previous select boxes are still there till you are not refreshing the page ......

new code

<html>
<script language="javascript">
function foo()
{
var mainDiv = document.getElementById("my");

var div = document.createElement("div");
var selectname = document.testform.fo.options[document.testform.fo.selectedIndex].value ;
alert(selectname);
for(j=0;j<selectname;j++)
{
var select = document.createElement("select");
for(i=0;i<selectname-1;i++)
{
var option = document.createElement("option");
option.text = "select"+i+j;
select.appendChild(option);
}
div.appendChild(select);
}
mainDiv.appendChild(div);
}

</script>

<body>
<form name=testform>
<select onchange="foo()" name="fo">
<option id="1" value="1">A</option>
<option id="2" value="2">B</option>
<option id="3" value="3">C</option>
<option id="4" value="4">D</option>
<option id="5" value="5">E</option>
<option selected>-----Select------</option>
</select>
<div id="my"></div>
</form>
</body></html>

Philip M
12-14-2009, 05:10 PM
Is this what you mean?

var mainDiv = document.getElementById("my");
mainDiv.innerHTML = "";

<script language=javascript> is long deprecated and obsolete. Use <script type = "text/javascript"> instead.



It is your responsibility to die() if necessary….. - PHP Manual

asamaiya
12-14-2009, 05:23 PM
thank god at Last you got my problem ...


but another problem is ..

how can I get the value of selectbox in PHP which are appearing after selecting the first select box ...

means how to pass unique id or name to randomly selectboxes...... ??

asamaiya
12-14-2009, 05:42 PM
I think I should be more clear here

what I want to do ..suppose I have a category e.g. keyboard

and after selecting any keyboard type ..all companies keyboards with different types and prices should appear in different select boxes ??

Philip M
12-14-2009, 06:38 PM
var please = false;
var thanks = false;
if (!please && !thanks) {
var interestLost = true;
var moreHelp = 0;
}

jmrker
12-14-2009, 06:41 PM
Is this what you mean?

var mainDiv = document.getElementById("my");
mainDiv.innerHTML = "";

<script language=javascript> is long deprecated and obsolete. Use <script type = "text/javascript"> instead.



It is your responsibility to die() if necessary….. - PHP Manual

I have a concept question about this.

If you leave the requested change out so that you can create multiple selections displayed
(my assumption here is that the same thing occurs when the .innerHTML = '' is used)
you can see multiple <select> elements are created.

I added an event to each selection element to see the effects


var select = document.createElement("select");
select.onchange = function(evt) { alert(this.value); } // adds display event to <select>tion


I also modified the loop for single element creation


// for(i=0;i<selectname-1;i++) { // modified to make displays consistent
for(i=0;i<selectname;i++) {

as it did not appear to add the text to a single display element.

:confused: My question is this:
1. If you create two (or more) original selections of 'A'..'E', each new multiple selection is visible,
but is it possible to create a memory overload if the user selects from the original selection accidently
and in the process creates un-necessary new <select> elements (duplicates) ?

2. Or does the use of the .innerHTML='' not allow this to happen?

asamaiya
12-14-2009, 07:00 PM
haha great code in javascript ...... philip ...

asamaiya
12-14-2009, 07:04 PM
I still did not get any help from here

asamaiya
12-15-2009, 04:52 PM
finally I got the solution

asamaiya
12-15-2009, 09:29 PM
your main file save done.php or done.html



<html>
<head>
<script src="sam.js"></script>
</head>
<body>

<form>
<!-- First Name: <input type="text" id="txt1" onkeyup="showHint(this.value)" />-->
<select name="categories_id" onChange="showHint(this.value)"><option value="" SELECTED>All Categories</option>
<option value="91">D</option>
<option value="99">T</option>
<option value="197">A</option>
<option value="198">S</option>
<option value="199">M</option>
<option value="114">B</option>
</select>
</form>
<p> <span id="hey"></span></p>

</body>
</html>






save as sam.js on the same directory


var xmlhttp

function showHint(str)
{
if (str.length==0)
{
document.getElementById("hey").innerHTML="";
return;
}
xmlhttp=GetXmlHttpObject();
if (xmlhttp==null)
{
alert ("Your browser does not support XMLHTTP!");
return;
}
var url="sam.php";
url=url+"?q="+str;
url=url+"&sid="+Math.random();
alert(url);
xmlhttp.onreadystatechange=stateChanged;
xmlhttp.open("GET",url,true);
xmlhttp.send(null);
}

function stateChanged()
{
if (xmlhttp.readyState==4)
{
document.getElementById("hey").innerHTML=xmlhttp.responseText;
}
}

function GetXmlHttpObject()
{
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
return new XMLHttpRequest();
}
if (window.ActiveXObject)
{
// code for IE6, IE5
return new ActiveXObject("Microsoft.XMLHTTP");
}
return null;
}// JavaScript Document

<?php
// Fill up array with names

//get the q parameter from URL
$q=$_GET["q"];

write your db connection and mysql query

and append the final output on that
//output the response
echo $response;
?>

asamaiya
12-15-2009, 09:30 PM
thanks for all of you ..... helping in this post ..............



thanks
for emailing me
2010old@gmail.com



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum