« Dynamic HTML Query - Are You Ready For This? | Main | It's Lights Out for WILB »
October 19, 2006
A Little Fun With Radio Buttons
Tom Neal recently asked me to modify a SWAMP report. The existing report returned information about the 05-06 Fiscal Year, and he also wanted information from the current Fiscal Year. This report is pretty long, so I wanted to keep the report to no more than one Fiscal Year. Also, this is a time frame that makes sense for this report.
I got the idea of creating a "front" page where the user could select a Fiscal Year, then click on a button and run this report for that time frame. A perfect spot for using "radio" buttons. Here's how I put the radio buttons to good use, blending JavaScript and PL/SQL.
First, the radio button is a good choice here because I don't want the user to pick more than one Fiscal Year at a time. To select more than one fiscal year at a time, checkboxes would have been the right choice. Checkboxes work pretty much the same as radio buttons.
In setting up radio buttons, JavaScript is really slick. If you give all the buttons the same name, JavaScript will make an array of them. Then you can just loop through the array looking for the selected button. Here's a look at the radio buttons I made:

Here's the code that created these buttons:
<tr>
<td>Fiscal Year 06-07</td><td><input type=radio name=fy checked=true> </td>
</tr>
<tr>
<td>Fiscal Year 05-06</td><td><input type=radio name=fy> </td>
</tr>
<tr>
<td>Fiscal Year 04-05</td><td><input type=radio name=fy> </td>
</tr>
Three radio buttons with the name "fy". Notice that the first button has the added property "checked=true". This automatically selects the first radio button. In this way, I avoid having to handle the possible condition of no radio buttons checked.
So, the user has selected the Fiscal Year they want and clicked the "Prepare Report" button. We must figure out which radio button was selected, then run the report for the appropriate Fiscal Year. Here's the JavaScript function that makes it happen:
function pickEd(){
var theone=0;
for (i=0;i<document.detail_form.fy.length;i++){
if (document.detail_form.fy[i].checked==true){
theone = i;
break; //exit for loop, as target acquired.
}
}
location.href = "http://[yourDADinfohere]/report_tools_equip.expend?pfy="+theone;
}
I obtained the guts of this function from here. This is the JavaScript Kit Reference page, and it is a great JavaScript resource.
What this function does is loop through the radio buttons until it finds the one that is checked, then calls a PL/SQL procedure, passing a 0,1, or 2 depending on which radio button was selected. My PL/SQL procedure then examines the value passed in and sets the date range. I did it like this (pfy is the value passed):
if(pfy = '0') then
vlodate := '01-JUL-06';
vhidate := '30-JUN-07';
elsif(pfy = '1') then
vlodate := '01-JUL-05';
vhidate := '30-JUN-06';
else
vlodate := '01-JUL-04';
vhidate := '30-JUN-05';
end if;
Here's something interesting - you can use these variable names in your procedure cursors. So a cursor could look like this:
select xxxxx from table.table
where condition
and item_date between vlodate and vhidate;
This works. Go ahead and set up your report as needed. Here's a sample of my report's output:

There you have it. Another useful JavaScript - PL/SQL combination.
Here's a comment from Summer:
I've created a
procedure that ads the javascript function to your code:
<pre>procedure getradio is
begin
htp.p('
<script language="javascript">
function getCheckedValue(radioObj) {
if(!radioObj)
return "";
var radioLength = radioObj.length;
if(radioLength == undefined)
if(radioObj.checked)
return radioObj.value;
else
return "";
for(var i = 0; i < radioLength; i++) {
if(radioObj[i].checked) {
return radioObj[i].value;
}
}
return "";
}
<script>');
end getradio;</pre>
Posted by rossm at October 19, 2006 8:36 AM
Comments
Post a comment
Thanks for signing in, . Now you can comment. (sign out)
(If you haven't left a comment here before, you may need to be approved by the site owner before your comment will appear. Until then, it won't appear on the entry. Thanks for waiting.)