• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 724
  • Last Modified:

Drop Down Fields disabling in JSP

I have certain fields like 9 of them in a javascript dropdown.

In a specific scenario i need to have only one field in the dropdown and rest i shouldnt see them

I am new to this and need a sample example to solve this.
0
ashokvarma06
Asked:
ashokvarma06
  • 2
1 Solution
 
Gurvinder Pal SinghCommented:
I am not sure if you can hide the options, but can disable them
This code will disable all but first and third option






<script>
	function showOnlyFirstOne()
	{
		var alloptions = document.getElementById("dd").options;
		alert(alloptions.length);
		for ( var counter = 0; counter < alloptions.length; counter++ )
		{
			alloptions[ counter ].disabled=true;
		}
		alloptions[ 0 ].disabled=false;
		alloptions[ 2 ].disabled=false;
		alert("all blocked");
	}
</script>
<body onload="showOnlyFirstOne()">
	<SELECT id="dd">
		<OPTION value="1">1</OPTION>
		<OPTION value="2">2</OPTION>
		<OPTION value="3">3</OPTION>
		<OPTION value="4">4</OPTION>
		<OPTION value="5">5</OPTION>
		<OPTION value="6">6</OPTION>
	</SELECT>
</body>

Open in new window

0
 
Gurvinder Pal SinghCommented:
the name of the method is misleading :), please change the same to disableOption()
0
 
Dushyant SharmaCommented:
If you want it from JSP then you can hide them from the jsp code only. Only required fields will be rendered then. an example is as below

<select>
<%
boolean set1=true;
boolean set2=true;
if(set1){out.println("<option value='1'>1</option>");}
if(set1){out.println("<option value='2'>2</option>");}
if(set1){out.println("<option value='3'>3</option>");}
if(set2){out.println("<option value='a'>A</option>");}
if(set2){out.println("<option value='b'>B</option>");}
if(set2){out.println("<option value='c'>C</option>");}
%>
</select>

here set1 and set2 are the two boolean variables which can be set or unset. i have set them to true in the above case.

from javascript you can remove them using removeChild function eg
<select id="test">
<option id='1' value='1'>1</option>
<option id='2' value='2'>2</option>
<option id='3' value='3'>3</option>
<option id='4' value='a'>A</option>
<option id='5' value='b'>B</option>
<option id='6' value='c'>C</option>
</select>

<script type="text/javascript">
    var d=document.getElementById('test');
    d.removeChild(document.getElementById("1"));
</script>
0
 
su_muCommented:
You can store the drop down values inside a array. Based on the specific scenario, you can populate the drop down dynamically.

E.g. Consider this HTML in your page
<span id="spa"><select id="name"><option>Select One</option>
</select></span>
<button name="butt" onClick="changeText()">Button Click</button>

<script>
var values = new Array(5);
// At index [1] you can store a flag for the conditional load
values[0] = new Array('1','0');
values[1] = new Array('2','1');
values[2] = new Array('3','1');
values[3] = new Array('4','1');
values[4] = new Array('5','0');

function changeText(){
      str = "<select id='name'>";
      // For 1st Cond
      cond = '1';
      for(i=0;i<5;i++){
      if(values[i][1] == cond){
      str = str+"<option value='"+values[i][0]+"'>"+values[i][0]+"</option>";
      }
      }
      str = str+"</select>";
      document.getElementById("spa").innerHTML = str;
}
</script>

0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now