Solved

Javascript - Multi select listbox to hide / unhide textbox

Posted on 2008-10-12
7
1,578 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
ID: 22697062
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
ID: 22700032
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
ID: 22700073
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
Announcing the Most Valuable Experts of 2016

MVEs are more concerned with the satisfaction of those they help than with the considerable points they can earn. They are the types of people you feel privileged to call colleagues. Join us in honoring this amazing group of Experts.

 
LVL 4

Author Comment

by:darenceang
ID: 22700110
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
ID: 22700139

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
ID: 22700217
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
ID: 22702160

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

Announcing the Most Valuable Experts of 2016

MVEs are more concerned with the satisfaction of those they help than with the considerable points they can earn. They are the types of people you feel privileged to call colleagues. Join us in honoring this amazing group of Experts.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Entity Framework is a powerful tool to help you interact with the DataBase but still doesn't help much when we have a Stored Procedure that returns more than one resultset. The solution takes some of out-of-the-box thinking; read on!
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
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…

808 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