How to do it through javascript?
2
-
I'm a newbie. Help.– medvedvohaCommented Jan 27, 2015 at 20:11
-
1can you add more details to your question ? is it a button on a Visual force page or a standard button / custom button on a standard page layout ?– Vamsi Krishna GosuCommented Jan 27, 2015 at 23:18
Add a comment
|
2 Answers
Just for your information it is a good idea to include more detail when asking a question, e.g. you could include some of your source code, any solutions that you have already tried.
I am going to make an assumption that you have an <apex:commandButton>, and that you wish to add a javascript click event handler to the button that can change the color of the button:
<script type="text/javascript">
function changeColor(elementId, newColor) {
var element = document.getElementById(elementId);
element.style.background = newColor;
}
</script>
. . .
<apex:commandButton id="btn1"
value="Button 1"
onclick="changeColor('{!$Component.btn1}', 'red'); changeColor('{!$Component.btn2}', 'white');"
rerender="container"/>
<apex:commandButton id="btn2"
value="Button 2"
onclick="changeColor('{!$Component.btn1}', 'white'); changeColor('{!$Component.btn2}', 'red');"
rerender="container"/>
<apex:outputPanel id="container">
</apex:outputPanel>
answered Jan 27, 2015 at 20:25
-
That's almost what I need, but when you click page is loaded and returns the old color. How to get rid of it? Commented Jan 27, 2015 at 20:43
-
If you need the button to also call an action on your controller, then using a rerender attribute should do the trick as long as the component that you rerender doesn't contain the button itself. If you don't need to call an action on the controller you can just use a standard HTML button. I will updated the code above to demonstrate. Commented Jan 27, 2015 at 21:35
-
Thank you. Another question: how to when clicked on the button, and another button to change color? example: if (click button1) { button1.color="red"; button1.color="blue";} Commented Jan 27, 2015 at 22:22
-
Sorry but you will need to reword your sentence/question as it doesn't make sense. Commented Jan 27, 2015 at 22:57
-
I know English badly. For example: there are two buttons. if( Click button_1) { button_1.background='red'; button_2.background='white'; } else if( Click button_2) { button_1.background='white'; button_2.background='red'; } How to make such? Commented Jan 27, 2015 at 23:21
How to make: If click "Manager" then Manager.backcolor='red' and Employee.backcolor='white'. Else If click "Employee" then Manager.backcolor='white' and Employee.backcolor='red' ? Code:
<script>
function styleButton_Manager(btnEl)
{
var newHexColorStr = 'red';
btnEl.style.background = newHexColorStr;
}
function styleButton_Employee(btnEl)
{
var newHexColorStr = '#0000FF'; // blue
btnEl.style.background = newHexColorStr;
}
</script>
......................................
<apex:commandButton rendered="{!manager_mode}" onclick="styleButton_Manager(this)" action="{!toManager}" value="Manager" reRender="container"/>
<apex:commandButton rendered="{!employee_mode}" onclick="styleButton_Employee(this)" action="{!toEmployee}" value="Employee" reRender="container"/>
..................................
<apex:outputPanel id="container">
................................
</apex:outputPanel>