Change Button content when Radio button clicked...

Within my BSP code I have an OnClientClick event against the Radio button tag.
What I need to do is to have some kind of Javascript that changes the context (text) or colour of a button if the Radio button is clicked.
I know very little of how to achieve this and would relish any guidance about how I can get this to work.
I understand that I need to use a reference/handle to the button and change it's values via javascript, but how can I embed this code into my BSP code, what code do I use, and more importantly how can I obtain this reference/handle on the buttion?.
Jon

Hi Jon,
below an Example to do this
(due to security forum restriction replace scrip t with script and o nclick with onclick)
<html>
<head>
<scrip t>
function change_button_text(v_object){
var button = document.getElementById("id_button");
var new_text = v_object.value + ' Clicked!';
if (button.childNodes[0])
        button.childNodes[0].nodeValue=new_text;
    else if (button.value)
        button.value=new_text;
</scrip t>
</head>
<body>
<form>
<input type="radio" name="***" value="male" o nclick="change_button_text(this)"/> Male<br />
<input type="radio" name="***" value="female" o nclick="change_button_text(this)"/> Female
</form>
<button id="id_button">Button Text</button>
</body>
</html>
Edited by: alessandro spadoni on Apr 28, 2011 9:56 AM

Similar Messages

Is it possible to fire an event when radio buttons are clicked in a report?

Hi All,
I have got a requirement. In the selection screen i have certain input fields and three radio buttons. When radio buttons are clicked i have to grey out certain input fields. Is it possible to fire an event when i write program through se38??
Thanks
Rakesh

Hi Rakesh,
Check this code.
SELECTION-SCREEN BEGIN OF BLOCK FINPUT WITH FRAME TITLE TEXT-001.
PARAMETERS : FILENAME(132) TYPE C LOWER CASE NO-DISPLAY,
              FDLOAD RADIOBUTTON GROUP RAD1
              USER-COMMAND R1 ,
              FUPLOAD RADIOBUTTON GROUP RAD1 .
SELECTION-SCREEN END OF BLOCK FINPUT.
SELECTION-SCREEN BEGIN OF BLOCK B1 WITH FRAME TITLE TEXT-002.
PARAMETERS : FUNAME(132) TYPE C LOWER CASE MODIF ID AA.
SELECTION-SCREEN PUSHBUTTON /33(30) ACTION USER-COMMAND
                 BTNACT MODIF ID AA VISIBLE LENGTH 8 .
SELECTION-SCREEN PUSHBUTTON 43(30) CANCEL USER-COMMAND
                 BTNCAN MODIF ID AA VISIBLE LENGTH 8 .
SELECTION-SCREEN END OF BLOCK B1.
SELECTION-SCREEN BEGIN OF BLOCK B2 WITH FRAME TITLE TEXT-002.
PARAMETERS : FDNAME(132) TYPE C LOWER CASE MODIF ID BB.
SELECTION-SCREEN PUSHBUTTON /33(30) ACTIONS USER-COMMAND
                 BTNACT1 MODIF ID BB VISIBLE LENGTH 8.
SELECTION-SCREEN PUSHBUTTON 43(30) CANCELS USER-COMMAND
                 BTNCAN1 MODIF ID BB VISIBLE LENGTH 8.
SELECTION-SCREEN END OF BLOCK B2.
DATA : ACTNAME(8) TYPE C,SCRGRUP(2) TYPE C.
INITIALIZATION.
ACTIONS = 'Download'.
CANCEL = 'Cancel'.
ACTION = 'Upload'.
CANCELS = 'Cancel'.
ACTNAME = 'Download'.
SCRGRUP = 'AA'.
AT SELECTION-SCREEN ON RADIOBUTTON GROUP RAD1.
IF FUPLOAD = 'X'.
     MOVE 'Upload' TO ACTION.
     MOVE 'Upload' TO ACTNAME.
ELSEIF FDLOAD = 'X'.
     MOVE 'Download' TO ACTION.
     MOVE 'Download' TO ACTNAME.
ENDIF.
AT SELECTION-SCREEN.
IF SY-UCOMM = 'R1'.
    IF ACTION = 'Download'.
      SCRGRUP = 'AA'.
     MESSAGE S007(ZMESSAGE).
    ELSEIF ACTION = 'Upload'.
      SCRGRUP = 'BB'.
     MESSAGE S008(ZMESSAGE).
   ENDIF.
ELSEIF SY-UCOMM = 'BTNCAN' OR SY-UCOMM = 'BTNCAN1'.
LEAVE PROGRAM.
ENDIF.
*AT USER-COMMAND.
CASE SY-UCOMM.
   WHEN 'ACTIONS'.
     LOOP AT SCREEN.
       IF SCREEN-NAME = 'FUNAME'.
       ENDIF.
     ENDLOOP.
ENDCASE.
AT SELECTION-SCREEN ON VALUE-REQUEST FOR FUNAME.
PERFORM call_filedialog CHANGING FUNAME.
PERFORM call_filedialog CHANGING FUNAME.
AT SELECTION-SCREEN OUTPUT.
LOOP AT SCREEN.
IF SCREEN-GROUP1 = SCRGRUP AND ACTNAME = 'Download' .
SCREEN-ACTIVE = 0.
MODIFY SCREEN.
ENDIF.
IF SCREEN-GROUP1 = SCRGRUP AND ACTNAME = 'Upload'.
SCREEN-ACTIVE = 0.
MODIFY SCREEN.
ENDIF.
ENDLOOP.
FORM call_filedialog CHANGING fname.
DATA: li_filetable TYPE STANDARD TABLE OF file_table,
    lv_return TYPE i,
    lw_filetable TYPE file_table.
CALL FUNCTION 'TMP_GUI_FILE_OPEN_DIALOG'
    TABLES
      file_table = li_filetable
    EXCEPTIONS
      cntl_error = 1
      OTHERS     = 2.
IF sy-subrc <> 0.
    MESSAGE ID sy-msgid TYPE sy-msgty NUMBER sy-msgno
            WITH sy-msgv1 sy-msgv2 sy-msgv3 sy-msgv4.
ENDIF.
READ TABLE li_filetable INDEX 1 INTO lw_filetable.
fname = lw_filetable-filename.
ENDFORM.                    "call_filedialog
Reward Points, if useful.
Regards,
Manoj Kumar

File name should change by selecting the radio buttons

Hi all,
PARAMETERs: p_file LIKE rlgrap-filename.
PARAMETERS: p_app RADIOBUTTON GROUP rg DEFAULT 'X',
                         p_pre RADIOBUTTON GROUP rg.
this is to download the ITAB data to presentation and application servers depending upon the radio button selected.
if i select p_pre , then default download path is : 'C:/ download.txt'.
if i select P_app , default download path is : '\usr\sap\EBG\SYS\profile\DOWN.TXT'.
how the file name should change by selecting the radio buttons ?
Thanks
KR

Hi,
DATA: c_x VALUE 'X'.
selection-screen begin of block input with frame title text-000.
parameters :desktop     radiobutton group rg_f user-command rg_f,
                   in_file type ibipparms-path modif id ps DEFAULT 'C:/ download.txt',
            menu     radiobutton group rg_f ,
                   sys_file type ibipparms-path modif id as default '\usr\sap\EBG\SYS\profile\DOWN.TXT' .
selection-screen end of block input.
at selection-screen output.
if desktop is initial and menu is initial.
    desktop = c_x.
endif.
perform f_toggle_finputs.
form f_toggle_finputs.
loop at screen.
    if screen-group1 = 'PS'.
      if desktop = c_x.
        screen-input    = 1.
*         sys_file = c_server_path.
      else.
        screen-input    = 0.
      endif.
    endif.
    if screen-group1 = 'AS'.
      if menu = c_x.
        screen-input    = 1.
*        clear: in_file.
      else.
        screen-input    = 0.
      endif.
    endif.
    modify screen.
endloop.
endform. "f_toggle_finputs
Hope this helps u.
Thanks.

I want to delete some songs from iTunes but no delete button appears when i right click or when i try to delete it from edit. what can i do?

I want to delete some songs from iTunes but no delete button appears when i right click or when i try to delete it from edit. what can i do?

If the songs are downloaded into your iTunes library (i.e. they don't have the cloud icon against them) then you should be able to delete them by selecting them and pressing the delete button on your keyboard.
If they do have the cloud icon then they are in the cloud - you can turn off the showing of all icloud music via the 'Show iTunes in the Cloud Purchases' on the Store tab in iTunes > Preferences (command-comma), or you can hide individual tracks and/or albums so that they don't show in the cloud : iTunes Store: Hiding and unhiding purchases.

How do you grey out/disable fields under a radio button if another radio button is selected in Adobe Acrobat XI Pro?

How do you grey out/disable fields under a radio button if another radio button is selected in Adobe Acrobat XI Pro?
I’m creating a form where the user has three options to make a payment.
1. charge to my credit card
2. charge associated costs to bank account
3. By cheque or money order
My Problem is, under each option, there are required fields that has to be filled out. So if the user picks the first option, charge to my credit card, they would fill out the required fields (credit card number, expiration date etc.). But when they click submit button to submit the form, it won’t let them, because there are required fields under the second option. Also, I have the radio buttons for the three options setup so that if the user holds the shift key and clicks a radio button, it unchecks it. So what I'm trying to do is this: If the user selects the radio button for option 1, the other two options are greyed out/disabled. And if the user holds down the shift key and clicks radio button for option one again, it unchecks the radio button and the other two options are available again. Is there a way to grey out or disable the two other payment options when the other one is picked. I’m assuming I will have to use javascript, but what would the coding be and which field do I write it under?
Thanks in advance guys

You will have to use custom JavaScript to access the various properties of the field object.
The radio button group has a value. When no button is selected that value is "Off". When an individual button has been selected the value for the group will be the option or export value for that individual button.
Once you have determined the button selected, then you will know the form fields that need to be made required. You use JavaScript to access those fields and change the "read only" property to false, and set the "required" property to true. For the fields associated with the other options, those fields should be reset, made read only, and have the "required" property set to false.
Disabling (graying-out) Form Fields
>> Also, I have the radio buttons for the three options setup so that if the user holds the shift key and clicks a radio button, it unchecks it.
Radio button in a PDF do not work that way. Only check boxes can be unchecked by clicking on one that has been checked.
If you plan the coding for the Mouse UP action to test for all possible options and code for each of those options you should have what you want.
If you want actual code you need to provide a lot more details.
It is even possible to perform some credit card and bank routing number validations with JavaScript and some check digit formulas.

Radion buttons under a radio button.

Hi-
I have a selection screen with two radio buttons.
I have the requirement where when I select the first radio button two other radio buttons under the selected radio button should appear.
Can anyone help me to acheieve this functionality.
Thanks.
Ramesh.

Take a look at this...
type-pools: icon.
data: switch.
selection-screen begin of block b2 with frame title text-001.
parameters: radio radiobutton group rnd user-command test default 'X',
            radio2 radiobutton group rnd.
selection-screen end of block b2.
selection-screen begin of block b1 with frame title text-001.
parameters:
           test type bkpf-belnr modif id sc1.
selection-screen end of block b1.
selection-screen begin of block b3 with frame title text-001.
parameters:
           test1 type bkpf-belnr modif id sc2.
selection-screen end of block b3.
AT SELECTION-SCREEN OUTPUT.
LOOP AT SCREEN.
IF SCREEN-GROUP1 = 'SC1' AND RADIO EQ 'X'.
    SCREEN-ACTIVE = '0'.
    MODIFY SCREEN.
    CONTINUE.
ELSEIF SCREEN-GROUP1 = 'SC2' AND RADIO2 EQ 'X'.
    SCREEN-ACTIVE = '0'.
    MODIFY SCREEN.
    CONTINUE.
ENDIF.
ENDLOOP.
start-of-selection.
Kindly stealed from Rich Heilman -;)
Greetings,
Blag.

TabNavigator - How to change what happens when a user clicks a tab

I am using a TabNavigator in my Flex application and I'd like
to be able to change what happens when a user clicks a tab on the
TabNavigator. I'd like to be able to handle the click on the tab
myself and stop Flex from perfoming it's default actions. Anyone
have a clue how to do this? Any help would be much appreciated!
Mike

Yeah, in the following code, the changeHandler has an effect
but the click effect does not:
<?xml version="1.0"?>
<mx:Application xmlns:mx="
http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
private function clickHandler():void{
accounts.setStyle("fontSize",20);
stocks.setStyle("fontSize",20);
futures.setStyle("fontSize",20);
private function changeHandler():void{
accounts.setStyle("fontSize",7);
stocks.setStyle("fontSize",7);
futures.setStyle("fontSize",7);
]]>
</mx:Script>
<mx:TabNavigator borderStyle="solid"
click="clickHandler()" change="changeHandler()">
<mx:VBox id="accounts" label="Accounts"
width="300"
height="150">
<mx:Label text="Accounts"/>
</mx:VBox>
<mx:VBox id="stocks" label="Stocks"
width="300"
height="150">
<mx:Label text="Stocks"/>
</mx:VBox>
<mx:VBox id="futures" label="Futures"
width="300"
height="150">
<mx:Label text="Futures"/>
</mx:VBox>
</mx:TabNavigator>
</mx:Application>

I'm in Safari, is there a way to change the order when you right click a link? Just upgraded to Mavrick OS

I'm in Safari, is there a way to change the order when you right click a link? Just upgraded to Mavrick OS

You can do that with the Menu Editor extension - https://addons.mozilla.org/firefox/addon/menu-editor/
This extension has not been updated by its author in a couple of years, but another developer has updated it for Firefox 4, you can get the updated version from http://netticat.ath.cx/MyAddons/MyAddons.htm#3rdpartyaddons

Chaning color when radio button is clicked

I am trying to change the background color when a radio button is clicked. The blue button is the only that I have added an actionListener, but when it is clicked, I get a runtime error. Any suggestions?
[import javax.swing.*;
import java.awt.*;
import java.awt.event.*;
public class Radio
     public static void main(String[] args)
          JFrame frame = new JFrame("Radio");
          Container pane = frame.getContentPane();
          JPanel radioPanel = new JPanel();
          radioPanel.setLayout(new GridLayout(3,1));
          JRadioButton blue = new JRadioButton("Blue", false);
          blue.setActionCommand("blue");
          JRadioButton red = new JRadioButton("Red", false);
          JRadioButton green = new JRadioButton("Green", false);
          Radio2 listener = new Radio2(blue, red, green, radioPanel);
          blue.addActionListener(listener);
          blue.setBackground(Color.BLUE);
     blue.setContentAreaFilled(false);
ButtonGroup bg = new ButtonGroup();
          bg.add(blue);
          bg.add(red);
          bg.add(green);
          radioPanel.add(blue);
          radioPanel.add(red);
          radioPanel.add(green);
          radioPanel.setBorder(BorderFactory.createTitledBorder(
BorderFactory.createEtchedBorder(), "Change Color?"));
          frame.add(radioPanel);
          frame.setSize(200,200);
          frame.setVisible(true);
     class Radio2 implements ActionListener
          private JRadioButton blue, red, green;
          private JPanel radioPanel;
          public Radio2(JRadioButton blue, JRadioButton red, JRadioButton green, JPanel radioPanel)
               blue = blue;
               red = red;
               green = green;
               radioPanel = radioPanel;
          public void actionPerformed(ActionEvent e)
               if(e.getActionCommand().equals("blue"))
                    radioPanel.setBackground(Color.blue);
                    System.out.println(e.getActionCommand());
]

I am trying to change the background color when a
radio button is clicked. The blue button is the only
that I have added an actionListener, but when it is
clicked, I get a runtime error. Any suggestions?
[import javax.swing.*;
import java.awt.*;
import java.awt.event.*;
public class Radio
     public static void main(String[] args)
          JFrame frame = new JFrame("Radio");
          Container pane = frame.getContentPane();
          JPanel radioPanel = new JPanel();
          radioPanel.setLayout(new GridLayout(3,1));
JRadioButton blue = new JRadioButton("Blue",
", false);
          blue.setActionCommand("blue");
          JRadioButton red = new JRadioButton("Red", false);
JRadioButton green = new JRadioButton("Green",
", false);
Radio2 listener = new Radio2(blue, red, green,
n, radioPanel);
          blue.addActionListener(listener);
          blue.setBackground(Color.BLUE);
     blue.setContentAreaFilled(false);
ButtonGroup bg = new ButtonGroup();
          bg.add(blue);
          bg.add(red);
          bg.add(green);
          radioPanel.add(blue);
          radioPanel.add(red);
          radioPanel.add(green);
          radioPanel.setBorder(BorderFactory.createTitledBorde
r(
BorderFactory.createEtchedBorder(),
edBorder(), "Change Color?"));
          frame.add(radioPanel);
          frame.setSize(200,200);
          frame.setVisible(true);
     class Radio2 implements ActionListener
          private JRadioButton blue, red, green;
          private JPanel radioPanel;
public Radio2(JRadioButton blue, JRadioButton red,
d, JRadioButton green, JPanel radioPanel)
               blue = blue;
               red = red;
               green = green;
               radioPanel = radioPanel;
          public void actionPerformed(ActionEvent e)
               if(e.getActionCommand().equals("blue"))
                    radioPanel.setBackground(Color.blue);
                    System.out.println(e.getActionCommand());
]Do me a favor, please. When you post code, put it inside code tags (the button you see above the text area.)
Thanks.

Form Reset When Radio Button Clicked.

I have two radio buttons.
One is checked and form elements are visible
The second, when clicks, makes all but one form element
uneditable
When the Second is clicked, I need the form elements to be
reset.
Any Ideas?

Have any ideas that would work for this?
>I have two radio buttons.
> One is checked and form elements are visible
> The second, when clicks, makes all but one form element
uneditable
>
> When the Second is clicked, I need the form elements to
be reset.

Popup window when radio button clicked

Hello,
I have a button that has a URL redirect of:
javascript:popUp2('f?p=&APP_ID.:8:&SESSION.::NO:::', 400, 400);
This opens a separate window.
Now I want this to happen when the user clicks on a radio button on that page.
Thank you,
Matt

You dont have to put this in html head..
ON THE PAGE RENDERING SECTION..
UNDER ITEMS... FIND THE RADIO BUTTON ITEM AND CLICK ON THAT..
U WILL SEE DIFFERENT TAB OVER THERE... LIKE .. SHOW ALL , NAME , DISPLAYED , LABEL , ELEMENT ... ETC..
SELECT ELEMENT..
UNDER ELEMENT YOU WILL SEE
HTML FORM ELEMENTS ATTRIBUTES... IN THAT TEXT BOX U JUST HAVE TO COPY AND PASTE THE ABOVE CODE

Displaying a field when radio button clicked

I am new using Acrobat and JavaScript and am trying to create a form. I have a radio button called Rate with 2 values, Pay and Bill. I also have 2 text boxes, called Pay_Rate_Fillin and Bill_Rate_Fillin which are initially set up as hidden fields. I would like for the Pay_Rate-Fillin text box to be visible when Pay is select and hidden otherwise. Then if Bill is selected the Bill_Rate_Fillin text box is visible. I have tried many different scripts and I just can't seem to get this right.

Place this code as Rate's custom calculation script:
var rate = event.value;
if (rate=="Pay") {
    this.getField("Pay_Rate_Fillin").display = display.visible;
    this.getField("Bill_Rate_Fillin").display = display.hidden;
} else if (rate=="Bill") {
    this.getField("Pay_Rate_Fillin").display = display.hidden;
    this.getField("Bill_Rate_Fillin").display = display.visible;

Textarea when Radio Button Clicked Yes

I'm trying to add a textarea for a gift message if the users
clicks the "Yes" radio button. The characters have to be limited to
150. I'm not a programmer and know very, very, little coldfusion.
The message in the textarea will be stored in a pre-existing DB
column.
Any help with this is greatly appreciated.

<input type="radio" name="giftMessage" value="1"
onclick="textAreaShow('inline');" />Yes
<input type="radio" name="giftMessage" value="0"
onclick="textAreaShow('none');" />No
<textarea name="giftMessageText"
id="giftMessageText"></textarea>
<script type="text/javascript">
function textAreaShow(onOff) {
document.getElementById('giftMessageText').style.display =
onoff;
</script>
for the text limit, that's a little tougher. textareas do not
have the builtin maxlength attribute that text inputs have. there
are javascripts you can use that will fire on the onkeyup event of
the textarea counting the characters, but i personally don't care
for those.
i'd suggest on the submit action of the form, check the
textarea.value length using JS and if it exceeds 150 characters,
don't submit the form and alert the user. in addition, DEFINITELY
check on the form's action page using CF to ensure that the length
of the value passed is less than 150 (and if not, handle
appropriately).

When radio button is enabled the block should be enable

I have a 4 radio buttons and a four blocks in a same single canvas , and when ever i enable a radio button the related block should get enable .. pls help me with coidng

Use the when-radio-changed trigger. There is a RADIO BUTTON VALUE property per radio item. You can place in the trigger...
IF CONTROL.TEMP_RADIO_BUTTON = 1 THEN
SET_BLOCK_PROPERTY ('BLOCK1', ENABLED, PROPERTY_TRUE);
ELSIF...
END IF;
Hope this helps...

Skin or change color of selected radio button or selected checkbox

I'm creating a custom CSS and I want to change the color of the checkmark (or the icon used) for selected radio buttons/checkboxes. Right now it's green (because it's using the simple stylesheet) but I don't know what element I can use to change the color or skin it. I've tried the af:selectBooleanCheckbox and af:selectBooleanRadio (even though they say they are only for disabled and read-only) but they don't appear to do anything... what do I use?

Have a look at
http://www.oracle.com/technology/products/jdev/htdocs/partners/addins/exchange/jsf/doc/skin-selectors.html
Searh e.g for
af:selectBooleanCheckbox Component
to learn how to work with custom images
Frank

Change Button content when Radio button clicked...

Similar Messages

Maybe you are looking for