Focal Point Banner


As of December 1, 2020, Focal Point is retired and repurposed as a reference repository. We value the wealth of knowledge that's been shared here over the years. You'll continue to have access to this treasure trove of knowledge, for search purposes only.

Join the TIBCO Community
TIBCO Community is a collaborative space for users to share knowledge and support one another in making the best use of TIBCO products and services. There are several TIBCO WebFOCUS resources in the community.

  • From the Home page, select Predict: WebFOCUS to view articles, questions, and trending articles.
  • Select Products from the top navigation bar, scroll, and then select the TIBCO WebFOCUS product page to view product overview, articles, and discussions.
  • Request access to the private WebFOCUS User Group (login required) to network with fellow members.

Former myibi community members should have received an email on 8/3/22 to activate their user accounts to join the community. Check your Spam folder for the email. Please get in touch with us at community@tibco.com for further assistance. Reference the community FAQ to learn more about the community.


Focal Point    Focal Point Forums  Hop To Forum Categories  WebFOCUS/FOCUS Forum on Focal Point     Onclick event for Radio Button

Read-Only Read-Only Topic
Go
Search
Notify
Tools
Onclick event for Radio Button
 Login/Join
 
<obrienk2>
posted
On my launch page I have two radio butons and one combo box. When radio1 is clicked I want the datasource for the combobox to be tblemployees but it radio2 is clicked I want the datasource for the combobox to be tbladdresses. How do I change the datasource for the combobox on the click event of the radio buttons? Or is there another way of doing this?
 
Report This Post
Expert
posted Hide Post
Theorectically you could change the various attributes on your SELECT tag as required and then call the IB javascript function that is responsible for the dynamic nature of the HTML.

However, it may be easier for you to have two SELECT tags and use your "onclick" event to make the one you want visible (and the other hidden) using style attributes. To ease your coding and the variable values you pass from your HTML form, you might want to have seperate variable names for each of your SELECT tags and deal with the differences within your called fex.

If I get time then I'll try and knock up an example for you.

T



In FOCUS
since 1986
WebFOCUS Server 8.2.01M, thru 8.2.07 on Windows Svr 2008 R2  
WebFOCUS App Studio 8.2.06 standalone on Windows 10 
 
Posts: 5694 | Location: United Kingdom | Registered: April 08, 2004Report This Post
Expert
posted Hide Post
Ok, say your data source combo boxes are -
<SPAN id=ITEM5 style="visibility:visible; BORDER-TOP-WIDTH: 0px; 
  BORDER-LEFT-WIDTH: 0px;   Z-INDEX: 32; LEFT: 30px; BORDER-BOTTOM-WIDTH: 0px; 
  WIDTH: 145px; POSITION: absolute;   TOP: 145px; HEIGHT: 20px; 
  BORDER-RIGHT-WIDTH: 0px" name="text5" elementname="text5" elementtype="text">
Employee Name
</SPAN>
<SELECT id=ITEM6 style="visibility:visible; FONT-WEIGHT: 400; FONT-SIZE: 10pt; 
  Z-INDEX: 42; LEFT: 180px; WIDTH: 220px; FONT-STYLE: normal; 
  FONT-FAMILY: MS Sans Serif; POSITION: absolute; TOP: 145px; HEIGHT: 20px; 
  TEXT-DECORATION: none" name="Employee" elementname="combobox6"
  elementtype="combobox" sourcetype="typeMaster" labelid caption="combobox" 
  operation="NONE" ibiformat datatype="1" addalloption="0" dynalldisplayvalue="ALL"
  inchainindex="-1" chainnumber="-1" cacheruntimedata="0" 
  displayfield numofrecords="-1" datafield="LAST_NAME" 
  datasource="EMPLOYEE.MAS"  datafieldtype="CHAR">
</SELECT>
<SPAN id=ITEM7 style="visibility:hidden; BORDER-TOP-WIDTH: 0px; 
  BORDER-LEFT-WIDTH: 0px; Z-INDEX: 32; LEFT: 30px; BORDER-BOTTOM-WIDTH: 0px; 
  WIDTH: 145px; POSITION: absolute;  TOP: 145px; HEIGHT: 20px; 
  BORDER-RIGHT-WIDTH: 0px" name="text7" elementname="text7" elementtype="text">
Address Line
</SPAN>
<SELECT id=ITEM8 style="visibility:hidden; FONT-WEIGHT: 400; FONT-SIZE: 10pt; 
  Z-INDEX: 42; LEFT: 180px; WIDTH: 220px; FONT-STYLE: normal; 
  FONT-FAMILY: MS Sans Serif; POSITION: absolute; TOP: 145px; HEIGHT: 20px; 
  TEXT-DECORATION: none" name="Address" elementname="combobox8" 
  elementtype="combobox" sourcetype="typeMaster" labelid caption="combobox" 
  operation="NONE" ibiformat datatype="1" addalloption="0" dynalldisplayvalue="ALL" 
  inchainindex="-1" chainnumber="-1" cacheruntimedata="0" 
  displayfield numofrecords="-1" datafield="ADDRESS_LN1" 
  datasource="EMPLOYEE.MAS"  datafieldtype="CHAR">
</SELECT>
then add some JavaScript like this -
<SCRIPT type=text/javascript>
// Show or hide the source
// depending upon the radio button selected
    function showsrce(btn) {
      if (btn==1) {
        showItem = document.getElementById("ITEM5");
        this.showItem.style.visibility = "visible";
        showItem = document.getElementById("ITEM6");
        this.showItem.style.visibility = "visible";
        showItem = document.getElementById("ITEM7");
        this.showItem.style.visibility = "hidden";
        showItem = document.getElementById("ITEM8");
        this.showItem.style.visibility = "hidden";
      } else {
        showItem = document.getElementById("ITEM5");
        this.showItem.style.visibility = "hidden";
        showItem = document.getElementById("ITEM6");
        this.showItem.style.visibility = "hidden";
        showItem = document.getElementById("ITEM7");
        this.showItem.style.visibility = "visible";
        showItem = document.getElementById("ITEM8");
        this.showItem.style.visibility = "visible";
      }
    }
</SCRIPT>
and add your onclick events to your radio buttons -
onclick="showsrce(1);" 
remembering to change the value being passed for the second radio button.

When you click each radio button on the HTML page the JavaScript function will be called with a value. The if statement evaluates the condition that the value (btn) being equal to 1 is true (the double == is correct) and hides the relveant controls accordingly.

Good luck.

T

This message has been edited. Last edited by: Kerry,



In FOCUS
since 1986
WebFOCUS Server 8.2.01M, thru 8.2.07 on Windows Svr 2008 R2  
WebFOCUS App Studio 8.2.06 standalone on Windows 10 
 
Posts: 5694 | Location: United Kingdom | Registered: April 08, 2004Report This Post
<obrienk2>
posted
quote:
elementname="combobox6"

Thank you soo much. I have a question. I need both Comboboxes to be named "Employee" because in my report it is looking for the "employee" parameter. Is that ok? the id names will be different but the names will be the same.
 
Report This Post
<obrienk2>
posted
Everything appears to be workining except for my radio button onclick events. When I click on the first radio button it works then when I click on the second radio button. Nothing happens. I checked the value of BTN and it appears to retain the value of 1 regardless of which button i click. I did make sure I changed the second button to onclick=showsrce(2);
 
Report This Post
Expert
posted Hide Post
Are you sure that you have the double equals sign in the JavaScript IF? This is a required syntax and if there is only one then that would explain the non changing state.

If you want to make sure that the values are being passed then you can add
alert(btn);
immediately after the function line and that will show you the value passed in the onclick event.



In FOCUS
since 1986
WebFOCUS Server 8.2.01M, thru 8.2.07 on Windows Svr 2008 R2  
WebFOCUS App Studio 8.2.06 standalone on Windows 10 
 
Posts: 5694 | Location: United Kingdom | Registered: April 08, 2004Report This Post
<obrienk2>
posted
Ok I do have the if statement like this (btn==1)

Also I did the alert and its passing only the same value on each click even though i am clicking a different radio button. Maybe I have my radio buttons set up wrong.

I have one radio1 then two radio1_0 and radio1_1 inputs. I put the onclick events under the radio1_0 and radio1_2.
 
Report This Post
Expert
posted Hide Post
The alert has found where the problem lies - in that the same value is being passed. So you need to look closely at the code for them.

Here is some sample radio button code that I used to test this -
<SPAN id=ITEM2 style="FONT-WEIGHT: 400; FONT-SIZE: 10pt; Z-INDEX: 67; 
  LEFT: 180px; WIDTH: 210px; FONT-STYLE: normal; FONT-FAMILY: MS Sans Serif; 
  POSITION: absolute; TOP: 80px; HEIGHT: 20px;  
  TEXT-DECORATION: none" name="radio2" elementname="radio2" elementtype="radio" 
  sourcetype="typeMaster" labelid caption="radio" columns="3" rows="-1" 
  operation="NONE" ibiformat datatype="0" addalloption="0" dynalldisplayvalue="ALL"
  inchainindex="-1" chainnumber="-1" cacheruntimedata="0" displayfield
  numofrecords="-1" datafield datasource datafieldtype="CHAR">
  <INPUT id=ITEM2_0 onclick="showsrce(1);" style="LEFT: 0px; WIDTH: 16px; 
  CURSOR: default;   POSITION: absolute; TOP: 0px; HEIGHT: 16px" 
  type=radio value=Employee name="DataSource" checked ="1">
  <LABEL style="LEFT: 19px; POSITION: absolute; TOP: 0px" for="ITEM2_0">
Employee
  </LABEL>
  <INPUT id=ITEM2_1 onclick="showsrce(0);" style="LEFT: 88px; WIDTH: 16px; 
  CURSOR: default; POSITION: absolute; TOP: 0px; HEIGHT: 16px" type=radio 
  value=Address name="DataSource">

  <LABEL style="LEFT: 107px; POSITION: absolute; TOP: 0px" for="ITEM2_1">
Addresses
  </LABEL>
</SPAN>

This message has been edited. Last edited by: Kerry,



In FOCUS
since 1986
WebFOCUS Server 8.2.01M, thru 8.2.07 on Windows Svr 2008 R2  
WebFOCUS App Studio 8.2.06 standalone on Windows 10 
 
Posts: 5694 | Location: United Kingdom | Registered: April 08, 2004Report This Post
<obrienk2>
posted
When you clickon these radio buttons is the value changing for your btn variable. I copied the code and clicked on the buttons and it is just displaying value 0.
 
Report This Post
Expert
posted Hide Post
Yes, when I click the first radio button it passes a 1 (one) when I click the right hand radio button it passes a 0 (zero).

How about posting just your button code?

T



In FOCUS
since 1986
WebFOCUS Server 8.2.01M, thru 8.2.07 on Windows Svr 2008 R2  
WebFOCUS App Studio 8.2.06 standalone on Windows 10 
 
Posts: 5694 | Location: United Kingdom | Registered: April 08, 2004Report This Post
Expert
posted Hide Post
A good start but I would like to see the radio button tag code.

Off home now but will check tonight.

T



In FOCUS
since 1986
WebFOCUS Server 8.2.01M, thru 8.2.07 on Windows Svr 2008 R2  
WebFOCUS App Studio 8.2.06 standalone on Windows 10 
 
Posts: 5694 | Location: United Kingdom | Registered: April 08, 2004Report This Post
Guru
posted Hide Post
obrienk2-
I think your syntax is showing up at the top of this post as radio buttons (at least for me).


(Prod: WebFOCUS 7.7.03: Win 2008 & AIX hub/Servlet Mode; sub: AS/400 JDE; mostly Self Serve; DBs: Oracle, JDE, SQLServer; various output formats)
 
Posts: 391 | Location: California | Registered: April 14, 2003Report This Post
<obrienk2>
posted
Here is the code for the boxes. Please help. Frowner
<BODY>
<SPAN id=ITEM2 style="FONT-WEIGHT: 400; FONT-SIZE: 10pt; Z-INDEX: 67; 
LEFT: 180px; WIDTH: 210px; FONT-STYLE: normal; FONT-FAMILY: MS Sans Serif; 
POSITION: absolute; TOP: 80px; HEIGHT: 20px; TEXT-DECORATION: none" 
sourcetype="typeMaster" datafieldtype="CHAR" datatype="0" 
datasource operation="NONE" addalloption="0" name="radio2" columns="3" 
datafield displayfield labelid numofrecords="-1" cacheruntimedata="0" 
chainnumber="-1" inchainindex="-1" dynalldisplayvalue="ALL" 
ibiformat rows="-1" caption="radio" elementtype="radio" elementname="radio2">
<INPUT id=ITEM2_0 style="LEFT: 0px; WIDTH: 16px; CURSOR: default; 
POSITION: absolute; TOP: 0px; HEIGHT: 16px" onclick=showsrce(1); 
type=radio CHECKED value=Employee name=DataSource> 
<LABEL style="LEFT: 19px; POSITION: absolute; TOP: 0px" for=ITEM2_0>
Employee 
</LABEL>
<INPUT id=ITEM2_1 style="LEFT: 88px; WIDTH: 16px; CURSOR: default; 
POSITION: absolute; TOP: 0px; HEIGHT: 16px" onclick=showsrce(0); 
type=radio value=Address name=DataSource> 
<LABEL style="LEFT: 107px; POSITION: absolute; TOP: 0px" for=ITEM2_1>
Addresses 
</LABEL>
</SPAN>
<INPUT language=javascript id=button1 style="Z-INDEX: 1; LEFT: 170px; 
WIDTH: 210px; POSITION: absolute; TOP: 170px; HEIGHT: 60px" 
onclick=button1_OnClick(this) tabIndex=1 type=button size=21 
value="Run Report" name=button1 requests_list="1">
   
<SELECT id=combobox2 style="Z-INDEX: 4; LEFT: 130px; VISIBILITY: visible; 
WIDTH: 250px; POSITION: absolute; TOP: 120px" tabIndex=4 size=1 
name=BoardMember sourcetype="typeMaster" datafieldtype="VARCHAR" 
datatype="1" datasource="TBLDISTRICT.mas" operation="NONE" accept="0"
addalloption="1" requiredfield="145163032" datafield="BOARD_MEMBER" 
displayfield="BOARD_MEMBER" labelid="text1">
</SELECT> 
<SPAN id=text2 style="Z-INDEX: 5; LEFT: 420px; WIDTH: 82px; 
POSITION: absolute; TOP: 50px; HEIGHT: 16px" tabIndex=5>
STATUS 
</SPAN>
<SELECT id=combobox3 style="Z-INDEX: 6; LEFT: 400px; WIDTH: 150px; 
POSITION: absolute; TOP: 120px" tabIndex=6 size=1 name=STATUS 
sourcetype="typeMaster" datafieldtype="VARCHAR" datatype="1" 
datasource="TBLSTATUS.mas" operation="NONE" accept="0" addalloption="1"
requiredfield="145163032" datafield="STATUS" displayfield="STATUS" 
labelid="text2">
</SELECT>
       
<SPAN id=text1 style="Z-INDEX: 25; LEFT: 130px; WIDTH: 230px; 
POSITION: absolute; TOP: 10px; HEIGHT: 38px" tabIndex=26>
Select an Option 
</SPAN>
<SELECT id=combobox1 style="Z-INDEX: 26; LEFT: 190px; VISIBILITY: hidden; 
WIDTH: 200px; POSITION: absolute; TOP: 280px" tabIndex=27 name=BoardMember 
datafieldtype="INTEGER" datatype="1" datasource="TBLschool.mas" operation="NONE" 
accept="0" addalloption="1" datafield="SCHOOLID" displayfield="SCHOOLID">
</SELECT> 




This message has been edited. Last edited by: Kerry,
 
Report This Post
<obrienk2>
posted
I had to end up using this because it kept looking at the radio button as one button.

function ITEM2_onclick(ctrl) {
if (RADSELECT[0].checked) {
        showItem = document.getElementById("combobox2");
        this.showItem.style.visibility = "visible";
        showItem = document.getElementById("combobox1");
        this.showItem.style.visibility = "hidden";
}
else {
     showItem = document.getElementById("combobox2");
        this.showItem.style.visibility = "hidden";
        showItem = document.getElementById("combobox1");
        this.showItem.style.visibility = "visible";
 }
}


 
Report This Post
Expert
posted Hide Post
I see your posts have been changed but recalling the one I saw just I left work - I think your problem was how you were using the passed value in your JavaScript.

You had "function ITEM2_onclick(ctrl) {" in your code but then referred to the passed value as "btn" instead of "ctrl".

However, I'm glad you managed to get it working.

T



In FOCUS
since 1986
WebFOCUS Server 8.2.01M, thru 8.2.07 on Windows Svr 2008 R2  
WebFOCUS App Studio 8.2.06 standalone on Windows 10 
 
Posts: 5694 | Location: United Kingdom | Registered: April 08, 2004Report This Post
  Powered by Social Strata  

Read-Only Read-Only Topic

Focal Point    Focal Point Forums  Hop To Forum Categories  WebFOCUS/FOCUS Forum on Focal Point     Onclick event for Radio Button

Copyright © 1996-2020 Information Builders