Solved

changing radio button state programmatically

Posted on 2000-03-06
9
436 Views
Last Modified: 2010-05-18
I have the following asp page which i use to enter some search information

*******start******
<%@ Language=VBScript %>
<html>

<head>
<meta name="VI60_defaultClientScript" content="VBScript">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>Sales Order Inquiry</title>
</head>

<body topmargin="0" leftmargin="0">

<p align="center">

<align="center"><font size="5"><font face="Arial Black">Product Lookup</font><br>

</font>

<form ACTION="plookup-details.asp" target="main" ID-ACTION="SUBROUTINE" METHOD="POST" NAME="frmProductLookup">
  <div align="center">
    <div align="center">
      <center>
      <table border="0" cellpadding="3" cellspacing="1">
        <tr>
          <td><b><font face="Arial" size="2">Search By:</font></b></td>
          <td></td>
          <td></td>
          <td></td>
        </tr>
        <tr>
          <td></td>
          <td><font face="Arial" color="#C71010" size="2"><strong><input type="radio" value="Material" name="R1">Material
        Number: </strong></font></td>
          <td><input NAME="txtMaterial" SIZE="22" MAXLENGTH="18" tabindex="1"></td>
          <td>(enter complete Material #)</td>
        </tr>
        <tr>
          <td></td>
          <td><font FACE="Arial" COLOR="#C71010" size="2"><strong><input type="radio" name="R1" value="Description" checked>Description:</strong></font></td>
          <td><input NAME="txtSearchString" SIZE="22" MAXLENGTH="18" tabindex="2"></td>
          <td>(enter search phrase)</td>
        </tr>
      </table>
      </center>
    </div>
    <center>
   
  </center></div><div align="center"><center><p><input NAME="btnSubmit" TYPE="image"
  SRC="images/btn_submit.jpg" BORDER="0" VALUE="Submit"> </p>
  </center></div>
</form>
</body>
</html>

******end******

how do i make the radio buttons change automatically to reflect the text box which has just had text entered.  That is, if i click on the text box for description, i would like the radio button to be automatically selected, than having to actually click on it myself before hitting the submit button.  The above code can be pasted into a new file in Frontpage to see what i mean.  I know how to do this using dynamic html, but need a javascript solution so that it can work for Netscape too.  Thanks.

0
Comment
Question by:gbr
[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
  • 4
  • 3
  • 2
9 Comments
 
LVL 1

Expert Comment

by:dmaryakh
ID: 2588600
I have modified your code to do just that. It all amounts to adding an event handlers for both text fields.


<html>

<head>
<meta name="VI60_defaultClientScript" content="VBScript">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>Sales Order Inquiry</title>
</head>

<body topmargin="0" leftmargin="0">

<p align="center">

<align="center"><font size="5"><font face="Arial Black">Product Lookup</font><br>

</font>

<form ACTION="plookup-details.asp" target="main" ID-ACTION="SUBROUTINE" METHOD="POST" NAME="frmProductLookup">
  <div align="center">
    <div align="center">
      <center>
      <table border="0" cellpadding="3" cellspacing="1">
        <tr>
          <td><b><font face="Arial" size="2">Search By:</font></b></td>
          <td></td>
          <td></td>
          <td></td>
        </tr>
        <tr>
          <td></td>
          <td><font face="Arial" color="#C71010" size="2"><strong><input type="radio" value="Material" name="R1">Material
        Number: </strong></font></td>
          <td><input NAME="txtMaterial" SIZE="22" MAXLENGTH="18" tabindex="1" onFocus="document.frmProductLookup.R1[0].checked=true;"></td>
          <td>(enter complete Material #)</td>
        </tr>
        <tr>
          <td></td>
          <td><font FACE="Arial" COLOR="#C71010" size="2"><strong><input type="radio" name="R1" value="Description" checked>Description:</strong></font></td>
          <td><input NAME="txtSearchString" SIZE="22" MAXLENGTH="18" tabindex="2" onFocus="document.frmProductLookup.R1[1].checked=true;"></td>
          <td>(enter search phrase)</td>
        </tr>
      </table>
      </center>
    </div>
    <center>

  </center></div><div align="center"><center><p><input NAME="btnSubmit" TYPE="image"
  SRC="images/btn_submit.jpg" BORDER="0" VALUE="Submit"> </p>
  </center></div>
</form>
</body>
</html>
0
 
LVL 1

Expert Comment

by:estrauss
ID: 2588623
in the textbox description put in

OnFocus="form.R1[n].checked"

where N is the correct radio button for that group.
So you would have

<td><input NAME="txtMaterial" SIZE="22" MAXLENGTH="18" tabindex="1" OnFocus="frmProductLookup.R1[0].checked"></td>

and

<td><input NAME="txtSearchString" SIZE="22" MAXLENGTH="18" tabindex="1" OnFocus="frmProductLookup.R1[1].checked"></td>

I think that will do it.
Ethan
0
 

Author Comment

by:gbr
ID: 2589279
will this work for both netscape and ie?  ...this looks very much like something i already got working, but only to find that it only worked in ie, ...just wanted to know before i went ahead and made the changes, ..thanks.
0
Optimize your web performance

What's in the eBook?
- Full list of reasons for poor performance
- Ultimate measures to speed things up
- Primary web monitoring types
- KPIs you should be monitoring in order to increase your ROI

 
LVL 1

Expert Comment

by:estrauss
ID: 2591387
I don't know for sure. I don't see any reason it would not work in Netscape, but I use IE pretty exclusively, so I may be wrong.
Ethan
0
 

Author Comment

by:gbr
ID: 2591576
i tested it out, and as i suspected, this only works for ie, ...hence the reason why i asked for a javascript solution, ...thanks for your help anyway.
0
 
LVL 1

Expert Comment

by:dmaryakh
ID: 2591758
GBR,

I have tested my code posted above in both IE and Netscape and is DOES work.

here are two lines that I have modified from your code

<input NAME="txtMaterial" SIZE="22" MAXLENGTH="18" tabindex="1" onFocus="document.frmProductLookup.R1[0].checked=true;">

<input NAME="txtSearchString" SIZE="22" MAXLENGTH="18" tabindex="2" onFocus="document.frmProductLookup.R1[1].checked=true;">

0
 

Author Comment

by:gbr
ID: 2594154
thanks very much for your help, ...i am still having problems however getting this to work properly in netscape, ...its really strange, but it takes 2 clicks of the text box for the radio button to change state. I have also found that it works ok if i just tab to the text fields, so its only when you click on the text boxes that this happens. Yet it works great in internet explorer.  

the changes i made are exactly as above, ...these are:

<input NAME="txtMaterial" SIZE="22" MAXLENGTH="18" tabindex="1" onFocus="document.frmProductLookup.R1[0].checked=true;">

<input NAME="txtSearchString" SIZE="22" MAXLENGTH="18" tabindex="2" onFocus="document.frmProductLookup.R1[1].checked=true;">

I am using nescape 4.7, ..any ideas, it would be great to get this to work.  Thanks again.

0
 
LVL 1

Accepted Solution

by:
dmaryakh earned 50 total points
ID: 2596379
I just tested it again, and everything works just fine.
My Netscape is version 4.51 and it have no problem with the code.
0
 

Author Comment

by:gbr
ID: 2624059
thanks, ..it must a problem with netscape 4.7.
0

Featured Post

Get 15 Days FREE Full-Featured Trial

Benefit from a mission critical IT monitoring with Monitis Premium or get it FREE for your entry level monitoring needs.
-Over 200,000 users
-More than 300,000 websites monitored
-Used in 197 countries
-Recommended by 98% of users

Question has a verified solution.

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

This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
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…
Suggested Courses

617 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