Yii Booster Tbbuttongroup Change Color Of Button On Clicking It

Yii 1.1 Extensions
1

I have the following Yii Booster TbButtonGroup


$this->widget('booster.widgets.TbButtonGroup',array(

   	'buttons' => array(

   		array('label' => 'Low Danger',  

   			  'htmlOptions'=>array(

   			  		'id' => 'lowDangerButton', 

   			  		'onClick'=>'function()

   			  			{

   			  				$("#symptomFlagTextField").val("1");

   			  				$("#lowDangerButton").addClass("selectedFlag");

   			  			}')),

   		array('label' => 'Mild Danger', 'htmlOptions'=>array('id' => 'mildDangerButton', 'onClick'=>'$("#symptomFlagTextField").val("2");')),

   		array('label' => 'High Danger', 'htmlOptions'=>array('id' => 'highDangerButton', 'onClick'=>'$("#symptomFlagTextField").val("3");'))

   		),

   	)

);

What I want to do is that when the user presses a button, that’s button’s color will change (to something different for each button).

I tried doing it by adding a class to the button (you can see an example of this with the first button), but when I run it it won’t add the class to the button. But the first command in the function ($("#symptomFlagTextField").val(“1”); ) works perfectly.

Any ideas?

2

You missed the hash

$("#lowDangerButton").addClass("selectedFlag");

3

Sorry, that was a typo while trying various solutions.

I added the hash back in and it still doesn’t work :/. And I added an alert command to test it out, and it doesn’t work, so it seems when I click the button the only function that works is the val one :S

EDIT

I tried adding a class to a random div inside the modal the buttonGroup is in, and it also didn’t work for that. I was wondering if something is wrong with jQuery, but the .val() function is working so that’s not it.

EDIT 2

FIXED.

Turns out inside the string from onClick => $string I can only use a single javascript command. It’s really weird, and I have no idea why that is (maybe a more experienced user can explain it to me, and for everyone who in the future my stop by this thread).

Anyway, I just built a seperate js script with a function dothis() inside, and I changed the onClick to:


 "onClick" => "js:dothis()"

and it works

4

Oh, sorry. I don’t know why I haven’t seen it before - you have got there anonymous function that is not called.

Anyway, I’m glad you have solved it.