Solved

Ratio Field + Text Field Hide

Posted on 2004-03-23
11
320 Views
Last Modified: 2008-03-06
I have a list of fields from a database, I output them to a page with 3 ratio boxes next to them and a text box next to each row, on load the text box is hidden, but when a spesific ratio box is checked the text box is shown and the user is able to type into it, if a different ratio box is selected then the text box hides again.
How do i do this using prefrably javascript/clientside (and no .NET)
0
Comment
Question by:Pyro-San
  • 6
  • 5
11 Comments
 
LVL 31

Expert Comment

by:alorentz
ID: 10663379
Do you have any existing code....easier if we know what it is?
0
 

Author Comment

by:Pyro-San
ID: 10663444
no code that is usefull

here is an example of the loop for the output tho

<%
while not rs.eof
%>
<tr>
 <td><%=rs("name1")></td>
 <td>
  <input type="radio" name="calltype<%=rs("id")%>" value="<%=rs("id")%>:1">
  <input type="radio" name="calltype<%=rs("id")%>" value="<%=rs("id")%>:2">
  <input type="radio" name="calltype<%=rs("id")%>" value="<%=rs("id")%>:3">
 </td>
 <td>
  <input type="text" name="stringNumber<%=rs("id")%>">
 </td>
</tr>
<%
wend
%>

when say the #2 radio button is selected the text box will appear when it is not the text box will be hidden
(yeah sorry I keep on typing ratio when it should be radio (I think))
0
 
LVL 31

Expert Comment

by:alorentz
ID: 10663467
That puts 3 radio buttons for every 1 textbox?
0
NAS Cloud Backup Strategies

This article explains backup scenarios when using network storage. We review the so-called “3-2-1 strategy” and summarize the methods you can use to send NAS data to the cloud

 

Author Comment

by:Pyro-San
ID: 10663501
yep.
that is the way it needs to be setup, the user gets a choice 1 out of 3 has to be selected, if the radio button (example as above 2(<input type="radio" name="calltype<%=rs("id")%>" value="<%=rs("id")%>:2">)) is selected then the text box is visible, otherwise it is hidden.
0
 
LVL 31

Expert Comment

by:alorentz
ID: 10663544
Only visible if 2 is selected?  What about 1 and 3...what is to happen?
0
 

Author Comment

by:Pyro-San
ID: 10663554
the text box is hidden
0
 
LVL 31

Expert Comment

by:alorentz
ID: 10663614
This should work: (but put your ASP back in)

<SCRIPT ID=clientEventHandlersJS LANGUAGE=javascript>
<!--

function ShowHide(val) {
if(val==2){
document.form1.stringNumber.style.visibility = "visible";
}
else
{
document.form1.stringNumber.style.visibility = "hidden";
document.form1.stringNumber.value = "";
}
}

//-->
</SCRIPT>

<FORM action="" method=POST id=form1 name=form1>
<TABLE WIDTH=75% BORDER=1 CELLSPACING=1 CELLPADDING=1>
      <TR>
            <TD>
                <input type="radio" name="calltype" value=":1" LANGUAGE=javascript onclick="return ShowHide(1)">
                  <input type="radio" name="calltype" value=":2" LANGUAGE=javascript onclick="return ShowHide(2)">
                  <input type="radio" name="calltype" value=":3" LANGUAGE=javascript onclick="return ShowHide(3)">
            </TD>
            <TD>
               <input type="text" name="stringNumber">
            </TD>
      </TR>
</TABLE>
</FORM>

0
 

Author Comment

by:Pyro-San
ID: 10663679
is there a way to do it without having lots of "document.form1.stringNumber.style.visibility = "hidden";"?
because there is going to be obviously more than one text box on the page, usually MIN 50 of them?
something like ShowHide(1,value2)
document.form1.stringNumbervalue2.style.visibility = "hidden";
or is it going to be to dificult to do it like that?
0
 
LVL 31

Accepted Solution

by:
alorentz earned 125 total points
ID: 10663717
Here's one way to do it:

<SCRIPT ID=clientEventHandlersJS LANGUAGE=javascript>
<!--

function ShowHide(val, target) {
//target will be the rs("id") that you put in the parameters
if(val==2){
eval("document.form1.stringNumber"+target+".style.visibility = 'visible'");

}
else
{
eval("document.form1.stringNumber"+target+".style.visibility = 'hidden'");
eval("document.form1.stringNumber"+target+".value = ''");
}
}

//-->
</SCRIPT>

<FORM action="" method=POST id=form1 name=form1>
<TABLE WIDTH=75% BORDER=1 CELLSPACING=1 CELLPADDING=1>
      <TR>
            <TD>
                <input type="radio" name="calltype" value=":1" LANGUAGE=javascript onclick="return ShowHide(1, 1)">
                  <input type="radio" name="calltype" value=":2" LANGUAGE=javascript onclick="return ShowHide(2, 1)">
                  <input type="radio" name="calltype" value=":3" LANGUAGE=javascript onclick="return ShowHide(3, 1)">
            </TD>
            <TD>
               <input type="text" name="stringNumber1">
            </TD>
      </TR>
</TABLE>
</FORM>
0
 
LVL 31

Expert Comment

by:alorentz
ID: 10663856
Did that solve it?
0
 

Author Comment

by:Pyro-San
ID: 10663866
yeah it did, thanks :D
0

Featured Post

Efficient way to get backups off site to Azure

This user guide provides instructions on how to deploy and configure both a StoneFly Scale Out NAS Enterprise Cloud Drive virtual machine and Veeam Cloud Connect in the Microsoft Azure Cloud.

Question has a verified solution.

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

I recently decide that I needed a way to make my pages scream on the net.   While searching around how I can accomplish this I stumbled across a great article that stated "minimize the server requests." I got to thinking, hey, I use more than one…
This demonstration started out as a follow up to some recently posted questions on the subject of logging in: http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_28634665.html and http://www.experts-exchange.com/Programming/…
In a recent question (https://www.experts-exchange.com/questions/28997919/Pagination-in-Adobe-Acrobat.html) here at Experts Exchange, a member asked how to add page numbers to a PDF file using Adobe Acrobat XI Pro. This short video Micro Tutorial sh…
Finds all prime numbers in a range requested and places them in a public primes() array. I've demostrated a template size of 30 (2 * 3 * 5) but larger templates can be built such 210  (2 * 3 * 5 * 7) or 2310  (2 * 3 * 5 * 7 * 11). The larger templa…

773 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