Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.

I would like to change this menu so that if I choose the second report1 shows the menu that says if there is type1 otherwise go to the third menu with written about1. In all four menus. I think the best way is the PHP but do not know the language.

HTML:

<form name="classic">
   <select style="width: 20%">
       <option value="0"></option>
       <option value="2">report1</option>
       <option value="2">report2</option>
   <option value="2">report3</option>
       <option value="2">report4</option>
   </select>
   <br /><br />
<select style="width: 20%">
    <option value="0"></option>
    <option value="2">tipo1</option>
    <option value="2">tipo2</option>
<option value="2">tipo3</option>
    <option value="2">tipo4</option>
</select>
<br /><br />
    <select style="width: 20%">
    <option value="0"></option>
    <option value="4">about1</option>
    <option value="4">about2</option>
<option value="4">about3</option>
    <option value="4">about4</option>
</select>
<br /><br />
<select style="width: 20%">
    <option value="0"></option>
    <option value="4">periodo1</option>
    <option value="4">periodo2</option>
<option value="4">periodo3</option>
    <option value="4">periodo4</option>
</select>
<br /><br />

</form>

this is the part javascript

<script language="JavaScript">
var tiporeportlist=document.classic.tiporeport
var reportlist=document.classic.report

var report=new Array()
report[0]=["report1"]
report[1]=["report2"]
report[2]=["report3"]
report[3]=["report4"]

var tipo=new Array()
tipo[0]=["tipo1"]
tipo[1]=["tipo2"]
tipo[2]=["tipo3"]
tipo[3]=["tipo4"]

var banca=new Array()
about[0]=["about1"]
about[1]=["about2"]
about[2]=["about3"]
about[3]=["about4"]

var periodo=new Array()
periodo[0]=["periodo1"]
periodo[1]=["periodo2"]
periodo[2]=["periodo3"]
periodo[3]=["periodo4"]

function getSelected(select) {

    return select.options[select.selectedIndex].value;
}

function getElement(id)  {

    return document.getElementById(id);
}
function popolaSelect(select,opt) {

    switch (opt) {
        case '1':
            var arr = report;
            break;
        case '2':
            var arr = tipo;
            break;
        case '3':
            var arr = about;
            break;
        case '4':
            var arr = periodo;
            break;
        default:
            return;
            break;
    }

    select.options.length = 1;

    for(var i=0; i<arr.length; i++) {                              

        select.options[select.options.length] = new Option(arr[i],i);        
    }
}
</script>
share|improve this question

closed as not a real question by George, Jay Gilford, NikiC, xan, shadyyx Mar 22 '13 at 14:22

It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center.If this question can be reworded to fit the rules in the help center, please edit the question.

2  
Have you considered using JavaScript? –  Antony Mar 22 '13 at 11:06
    
What have you tried? StackOverflow is not free code service. –  DaveRandom Mar 22 '13 at 11:07
    
yes... but it is better with php for security of the web page –  luca ricci Mar 22 '13 at 11:08
    
Security? It's a few select boxes that anybody who views the page can see. –  George Mar 22 '13 at 11:10

2 Answers 2

The options cannot be changed dynamically with PHP. The page should be refreshed everytime and values should be passed through GET or POST parameters or by cookie.

A more easier implementation would be to use javascript as below. It should work on Internet explorer without any problem. Haven't tested on it though.

HTML:

<form name="classic">
   <select style="width: 20%" id="s1" onchange="choose('s2',this)">
       <option value="0"></option>
       <option value="2">report1</option>
       <option value="2">report2</option>
   <option value="2">report3</option>
       <option value="2">report4</option>
   </select>
   <br /><br />
<select style="width: 20%" id="s2" onchange="choose('s3',this)">
    <option value="0"></option>
    <option value="2">tipo1</option>
    <option value="2">tipo2</option>
<option value="2">tipo3</option>
    <option value="2">tipo4</option>
</select>
<br /><br />
    <select style="width: 20%" id="s3" onchange="choose('s4',this)">
    <option value="0"></option>
    <option value="4">about1</option>
    <option value="4">about2</option>
<option value="4">about3</option>
    <option value="4">about4</option>
</select>
<br /><br />
<select style="width: 20%" id="s4">
    <option value="0"></option>
    <option value="4">periodo1</option>
    <option value="4">periodo2</option>
<option value="4">periodo3</option>
    <option value="4">periodo4</option>
</select>
<br /><br />

Javascript:

function choose(target,option)
{
    var val = option.options[option.selectedIndex].text;
    document.getElementById(target).options[0].innerHTML = val;
}

Example: http://jsfiddle.net/xensoft/QdYSz/

share|improve this answer
    
thank you so much –  luca ricci Mar 22 '13 at 13:06
    
the only problem is that internet explorer does not work –  luca ricci Mar 22 '13 at 13:34
    
May i know which version of Internet explorer you are using? –  kavin Mar 22 '13 at 13:37
    
internet explorer 9 –  luca ricci Mar 22 '13 at 13:42

You could use php for this but then without javascript and/or ajax the page needs to refresh every time.

For that reason it is better to use javascript for this. I advice you to have a look at jquery and try it out.

share|improve this answer
    
I know but since I need to view it in Internet Explorer locks it in javascript –  luca ricci Mar 22 '13 at 11:28
    
Javascript works in IE, just as it does in every standard browser –  Luc Prevoo Mar 22 '13 at 11:51

Not the answer you're looking for? Browse other questions tagged or ask your own question.