Solved

Javascript - Multi select listbox to hide / unhide textbox

Posted on 2008-10-12
7
1,594 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 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
What Is Transaction Monitoring and who needs it?

Synthetic Transaction Monitoring that you need for the day to day, which ensures your business website keeps running optimally, and that there is no downtime to impact your customer experience.

 
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

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

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

Real-time is more about the business, not the technology. In day-to-day life, to make real-time decisions like buying or investing, business needs the latest information(e.g. Gold Rate/Stock Rate). Unlike traditional days, you need not wait for a fe…
Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
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…

726 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