»
EnglishFrenchVietnamese

Print - Change the size property in execution time - JavaScriptBank.com

Full version: jsB@nk » Form » Dropdown » Change the size property in execution time
URL: https://www.javascriptbank.com/change-the-size-property-in-execution-time.html

Change the size property in execution time © JavaScriptBank.comThe idea of this JavaScript is very simple. Just define one layer for every size you need. In academical therms it is not correct; but in the reality, we can supose that the maximum size that a list will have could be about 10 (and <50 physically).

Full version: jsB@nk » Form » Dropdown » Change the size property in execution time
URL: https://www.javascriptbank.com/change-the-size-property-in-execution-time.html



JavaScript
<SCRIPT language=javascript>        <!--            // Set the number of positions for the arrays.            var MaxNumArray = 6            // Defining the arrays.            var MainList=new Array(MaxNumArray)            var SubList=new Array(MaxNumArray)            // The last view used.            var lastLayerVis = 1            // Create the data            // If wants to personalize, just put the data in the next function.            function PrepareData()            {                            for (i = 0; i < MaxNumArray; i++)                {                    MainList[i]="Show " + (i+1) + " item(s) in the sublist."                    SubList[i] ="Item" + (i+1) + "."                }            }                        // This will show the main list. The list will let us to change the size of the other list.            function ShowMainList()            {                var page = "MainList:<br><SELECT NAME='mainlist' onChange='writeList()'>"                for (i=0;i<MainList.length;i++)                 {                                        page+="<OPTION VALUE="+MainList[i]                    if (i==0)                     {                        page+=" SELECTED "                    }                    page+=">"+MainList[i]                }                page+="</SELECT>"                                document.write(page);            }            // The sublist.            // Here I define as layers as I need. The first visible layer will be the layer with a list of 1 element.            // Be sure to put the layer in the correct (top,left) corner...            function ShowSubList()            {                var page = ""                for (j=1;j<=MainList.length;j++)                {                                        if (j==1)                        page+="<DIV ID='LSubList"+j+"' style='position:relative; width:20; height:20; z-index:1; top: 0; left: 0; visibility:visible;'>"                     else                        page+="<DIV ID='LSubList"+j+"' style='position:relative; width:20; height:20; z-index:1; top: 0; left: 0; visibility:hidden;'>"                    page+='SubList:<select NAME="sublist'+j+'" size="'+j+'">'                    for (i=0;i<SubList.length;i++)                     {                        page+="<OPTION VALUE="+SubList[i]                        if (i==0)                            page+=" SELECTED "                        page+=">"+SubList[i]                    }                    page+="</SELECT>"                    page+="</DIV>"                }                document.write(page)            }                        // When there is a change in the main list; I maintain the selected index in the sublist            // and change the visibility of the pertinent layers.            function ChooseSubList(asize)            {                document.form1['sublist'+asize].selectedIndex = document.form1['sublist'+lastLayerVis].selectedIndex;                document.all['LSubList'+asize].style.visibility="visible"                document.all['LSubList'+lastLayerVis].style.visibility="hidden"                // Finally I must remember the last layer that is visible.                lastLayerVis = asize            }                        // A simple all given the selected index of the item in the main list.            function writeList()            {                ChooseSubList(document.form1.mainlist.selectedIndex+1)            }            //-->        </SCRIPT><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<FORM name=form1><SCRIPT language=javascript>            <!--                                PrepareData()                ShowMainList()                ShowSubList()            //-->            </SCRIPT></FORM><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->