I’ve got a tbtogglebutton widget that runs a function when changed. The function runs an ajax request that submits an on/off set by the toggle, and a value found in a text field. I’d like to have it so that if the text field is empty and the button is already set to off, the toggle button is disabled… or, if the ajax request comes back with an error, the button is triggered to go into the ‘off’ position.
How can I manipulate the tbtogglebutton from my function? Right now, I’m doing this:
document.getElementById("toggleButton").removeAttribute('checked');
$("#toggleButton").parent("div").css("left", "-50%");
This solution seems to toggle the button off appropriately, but clicking the button afterward sends ‘off’ as the status, and the button doesn’t move because it’s already off.
Here’s the code for the button:
<?php
$this->widget(
'bootstrap.widgets.TbToggleButton',
array(
'model'=>$model,
'onChange' => 'js:function($el, status, e){
if(status == true){ toggleDND("1"); }
else{ toggleDND("0");}
;}',
'attribute'=>'dnd',
'enabledStyle' => null,
'customEnabledStyle' => array(
'background' => "#F26521",
'gradient' => "#F26521",
'color' => '#FFFFFF'
),
'customDisabledStyle' => array(
'background' => '#428BCA',
'gradient' => '#428BCA',
'color' => "#FFFFFF"
)
)
);
?>
I’m sure that I’m missing something silly, and I’ve tried to approach this from different angles, but I’m afraid that my solutions aren’t the most efficient. I could use a nudge in the right direction at this point. Any help would be appreciated.