Solved

Javascript - Multi select listbox to hide / unhide textbox

Posted on 2008-10-12
7
1,571 Views
Last Modified: 2012-06-21
Hi!
I have a multi-select textbox named : LIST_CAT and a textfield named: LIST_CAT_OTHERS that is hidden.

On page load, i will populate the items inside this listbox from database.

I need a javascript such that, when one of the items inside the LIST_CAT is selected - The value is Others, this textfield will  appear.

Any advice on how i can go about doing it?

The reason why i need javascript is because that if i use post back, though the LIST_CAT_OTHERS is visible, the LIST_CAT will display the list from the top again.

Thanks in advance!
0
Comment
Question by:darenceang
  • 3
  • 3
7 Comments
 
LVL 26

Expert Comment

by:Anurag Thakur
Comment Utility
If you use postback and do it through javascript it will be perfect - not as fast as through javascript but will not behave as you are anticipating
0
 
LVL 4

Author Comment

by:darenceang
Comment Utility
But if i do a postback... the listbox will return to the first item yea?
If my listbox containts 15 items...

it will show:
Item 1
item 2
item 3
item 4
item 5

If i browse down and select item 14, the post back will refresh and then it will show item 1 first again... but i want it to "STAY" @ item 14.
0
 

Expert Comment

by:Interlinked
Comment Utility
Could you just do this via a bit of server side processing? so far example:

<select name="LIST_CAT ">
<option value="1" <%= String(Request("LIST_CAT")) == "1" ? "Selected" : "" %> >Item 1</option>
<option value="2" <%= String(Request("LIST_CAT")) == "2" ? "Selected" : "" %> >Item 2</option>
<option value="3" <%= String(Request("LIST_CAT")) == "3" ? "Selected" : "" %> >Item 3</option>
<option value="4" <%= String(Request("LIST_CAT")) == "4" ? "Selected" : "" %> >Item 4</option>
<option value="5" <%= String(Request("LIST_CAT")) == "5" ? "Selected" : "" %> >Item 5</option>
<option value="6" <%= String(Request("LIST_CAT")) == "6" ? "Selected" : "" %> >Item 6</option>
<option value="7" <%= String(Request("LIST_CAT")) == "7" ? "Selected" : "" %> >Item 7</option>
<option value="8" <%= String(Request("LIST_CAT")) == "8" ? "Selected" : "" %> >Item 8</option>
<option value="9" <%= String(Request("LIST_CAT")) == "9" ? "Selected" : "" %> >Item 9</option>
<option value="10" <%= String(Request("LIST_CAT")) == "10" ? "Selected" : "" %> >Item 10</option>
<option value="11" <%= String(Request("LIST_CAT")) == "11" ? "Selected" : "" %> >Item 11</option>
<option value="12" <%= String(Request("LIST_CAT")) == "12" ? "Selected" : "" %> >Item 12</option>
<option value="13" <%= String(Request("LIST_CAT")) == "13" ? "Selected" : "" %> >Item 13</option>
<option value="14" <%= String(Request("LIST_CAT")) == "14" ? "Selected" : "" %> >Item 14</option>
</select>

This is just to run in Javascript ASP,but I can adapt to another language if you know what your server can support.
0
What Is Threat Intelligence?

Threat intelligence is often discussed, but rarely understood. Starting with a precise definition, along with clear business goals, is essential.

 
LVL 4

Author Comment

by:darenceang
Comment Utility
Hi Interlinked.

What u mean by that?
Sorry... noob....

Do u mean that after my onSelectedIndexChange, i repopulate the list again?
0
 

Expert Comment

by:Interlinked
Comment Utility

I think i am miss understanding... are you trying to get the text box "LIST_CAT_OTHERS" to show when the user selects the value "Others" from LIST_CAT?

If so, you could do:
function ShowList_Cat_Others() {
 if (document.getElementById("LIST_CAT").value) == "Others") { document.getElementById("LIST_CAT_OTHERS").style.display = ''; }
}

<select name="LIST_CAT " id="LIST_CAT" onchange="ShowList_Cat_Others()">....</select>

if you set the textfield LIST_CAT_OTHERS to load with the display:none as a style, then it will be hidden when it loads and showing when the user select the "Other".

The example i gave below will work if someone is posting the data back to your server and you want them to reload with the last option they had selected still being selected.
0
 
LVL 4

Author Comment

by:darenceang
Comment Utility
Hi Interlinked.
I tried ur codes. but there is no such thing as .value

Do i have to use a for loop since its a multi-select listbox?

Please advice.
0
 

Accepted Solution

by:
Interlinked earned 50 total points
Comment Utility

Sorry, I should have put:

function ShowList_Cat_Others() {
 if (String(document.getElementById("LIST_CAT").options[document.getElementById("LIST_CAT").selectedIndex].value) == "Others") { document.getElementById("LIST_CAT_OTHERS").style.display = ''; }
}


0

Featured Post

IT, Stop Being Called Into Every Meeting

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

Join & Write a Comment

It was really hard time for me to get the understanding of Delegates in C#. I went through many websites and articles but I found them very clumsy. After going through those sites, I noted down the points in a easy way so here I am sharing that unde…
This article discusses how to create an extensible mechanism for linked drop downs.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

763 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

10 Experts available now in Live!

Get 1:1 Help Now