Hi -
Just added Yiistrap to a project and found an interesting issue with TbHtml::button() and disabling it and what that might really mean…
What I have is a simple modal pop up with 2 buttons on is a cancel button the other is a SAVE button. What I have are 2 drop downs list boxes that when either are empty (nothing selected) the SAVE button is being set to disabled or enabled based on the if the dropdowns are selecting valid data.
The Yiistrap Code that disables the button, but only the look of it, it is still enabled and responding to events such as the onclick();
TbHtml::button( 'Save', array('disabled' => true, 'data-dismiss' => 'modal', 'id' => 'save_zip', 'name'=>'save_zip', 'color' => 'custom', 'onclick'=>'getPostalCode();')),
Generated HTML
<button id="save_zip" class="btn btn-custom disabled" type="button" onclick="getPostalCode();" name="save_zip" data-dismiss="modal" ></button>
The problem is that while the button LOOKS disabled it’s still responds to the onclick event. In looking at the Yiistrap code it seems that the property ‘disabled’ is not set as it’s own attribute but an attribute to the class.
This code is what I would expect it to be, since the idea of disabling a button is not only the look of disabled but also the rest of the functionality.
<button id="save_zip" class="btn btn-custom" type="button" onclick="getPostalCode();" name="save_zip" data-dismiss="modal" "disabled"=>"disabled"></button>
Yiistrap TbHtml::button() is looking to set the class to disabled for the button and their is no way to specify a disabled attribute from the helper because as soon as it sees the ‘disabled’ name it will put it in the ‘CSS Class’ and be done. I think this is a bug as the notion of ‘disabling’ is not just the look of the button, but the actions as well. It also makes it more complex to do a programatic changes to the state with they typical code below.
Working JS code that programatically does the job the more commonly used way which does not work with the YiiStrap TbHtml::Button generated code.
if($("#state_helper").val() != "" && $("#city_helper").val() != "")
$("#save_zip").removeAttr("disabled"); // remove the disabled attribute to enable the button
else
$("#save_zip").attr("disabled", "disabled"); // add the disabled attribute back in to disable the button including the click
Not sure where to inquire about Yiistrap bugs at this point but wanted to see if I’m off base here before hacking things up…
Sandy