Announcement

Collapse
No announcement yet.

Change Button text and/or background color with javascript?

Collapse
X
  • Filter
  • Time
  • Show
Clear All
new posts

  • Change Button text and/or background color with javascript?

    Hi,

    i have a button "MyButton" and would like change the text and/or background color:

    Code:
    echo "<script>document.getElementById('sc_btnMyButton_top').bgcolor='red';</script>";    
    echo "<script>document.getElementById('sc_btnMyButton_top').textElement.innerText = 'my new text';</script>";
    (SC add "sc_btn" and "_top" to the button name)

    But that does not work ... why?
    Best regards: - Reinhard -

    I use ScriptCase 8 Enterprise Edition, Version 8.(latest)

  • #2
    Well, as you might know already, straight javascript in SC doesn't always work as expected. :-D

    You might give this one a try.

    onScriptInit:

    Code:
    ?>
    <script>
    function changeBackgroundText()
    {
    	document.getElementById('sc_mybutton_top').style = 'background-image: none; background-color: #CCCCCC;';
    	document.getElementById('sc_mybotton_top').innerHTML = 'New Text';
    }
    </script>
    <?php
    
    change_Button(); // you can of course call the function wherever you want
    PHP Method (change_Button):
    sc_ajax_javascript('changeBackgroundText');

    This will work in Control and Form applications.
    Keep in mind, since you are overriding the button's css default class(es), all the other styles like onmouseover, onmousedown, etc. will have different or no effects.

    jsb
    Last edited by jsbinca; 09-16-2014, 09:33 PM.

    Comment


    • #3
      Hi jsb,

      i have tested in a grid application and here comes an error: "Fatal error: Call to undefined function sc_ajax_javascript() ..."
      Best regards: - Reinhard -

      I use ScriptCase 8 Enterprise Edition, Version 8.(latest)

      Comment


      • #4
        Hi,
        as I said it's working in control and form applications because sc_ajax_javascript() doesn't work in grids (see Events x Applications)
        and javascript and grid application is a *beep*.
        However, if you need it so badly that you can't sleep :-D you might try this one.

        onScriptInit:
        Code:
        ?>
        <script>
        function changeBackgroundText(bcolor, ntext) //pass the colour and text as a variables, not bad eh?
        {
        	document.getElementById('sc_mybutton_top').style = 'background-image: none; background-color: '+bcolor+';';
        	document.getElementById('sc_mybutton_top').innerHTML = ntext;
        }
        </script>
        <?php
        [bcolor] = 'yellow';
        [ntext] = 'New Text';
        onRecord:
        Code:
        if([bcolor]) //it's just to have the change done only once
        {
            echo "<script>changeBackgroundText('[bcolor]','[ntext]');</script>";
            [bcolor] = false;
        }
        jsb
        Last edited by jsbinca; 09-18-2014, 12:43 PM. Reason: Corrected typo in code.

        Comment


        • #5
          Hi jsb,

          Originally posted by jsbinca View Post
          However, if you need it so badly that you can't sleep :-D you might try this one.
          thank you, but the "badly" script don't run ... (in SC8). No reaction, no errors ...
          Best regards: - Reinhard -

          I use ScriptCase 8 Enterprise Edition, Version 8.(latest)

          Comment


          • #6
            Sorry to hear.
            Please check again for any typos. It's working on 7 and 8. Just tested it.
            And your button is still in the top toolbar? Otherwise it would be sc_yourbutton_bot. Just saying.

            jsb

            Comment


            • #7
              Hhm ... yes, the button is in the top toolbar. I'am use a php button, but no change. If i use a javascript button, the text is changed, but not the background color.

              Originally posted by jsbinca View Post
              It's working on 7 and 8. Just tested it.
              For a better unterstanding: you generate a simple grid, place a new (php) button in the toolbar, copying your code (in onScriptInit and in the button code)?
              Best regards: - Reinhard -

              I use ScriptCase 8 Enterprise Edition, Version 8.(latest)

              Comment


              • #8
                Originally posted by RHS View Post

                For a better unterstanding: you generate a simple grid, place a new (php) button in the toolbar, copying your code (in onScriptInit and in the button code)?
                Not quite, the first block is in onScriptinit, the second block in onRecord.
                You can't put the code in a php button (javascript button works) because when you hit the button you are leaving the grid and when you exit the button code
                and return to the grid, it is loaded again and everything is reinitialized and set to the defaults.
                In order to change the color/text of a php button you have to place the code somewhere else. Unfortunately it doesn't work everywhere. Who wonders.

                jsb
                Last edited by jsbinca; 09-19-2014, 08:58 AM.

                Comment


                • #9
                  It works for me.

                  And jsbinca do a good work.

                  How to run a ajax function, do you have any example?
                  such as http://stackoverflow.com/questions/2...a-php-function

                  Could I move it into scriptcase? I tested but not work for me.

                  Comment

                  Working...
                  X