You are viewing revision #1 of this wiki article.
This version may not be up to date with the latest version.
You may want to view the differences to the latest version.
We all know that widgets are really useful. We can use the almost everywhere we want, and we can use the same code a lot of times ( Almost OOP ).
In this case we are going to create a really useful and simple widget. A GoBack button.
Why a widget ? Simple, we can extend the variables and make it as complex as we want, but will not be this case ;). We are going to pass just 1 variable if we need it.
Under your ext folder or widget folder ( mine under protected/ext/data ) create the following widget:
class EBackButtonWidget extends CWidget {
public $width = "150px";
public function run() {
echo CHtml::button('Back', array(
'name' => 'btnBack',
'class' => 'uibutton loading confirm',
'style' => 'width:'.$this->width.';',
'onclick' => "history.go(-1)",
)
);
}
}
Where: <br/>
- Back is the text that the button will show. <br/>
- name will be the name of the button <br/>
- class just in case that you want to do it pretty :).
- styles that you want to use. In my case I will change the width.
- onclick will execute our JS. In this case to go back 1 page.
To call this widget we simple:
<?
$this->widget('application.ext.data.EBackButtonWidget',
array(
'width' => "100%",
));
?>
Where :
- application.ext.data.EBackButtonWidget is the path to our widget.
- width will be the width param that we give to the widget.
And that is it !!
Here's a very readable link in spanish to the original [tutorial][original]. [original]: http://www.cristiantala.cl/crear-un-widget-en-yii-boton-volver/
return false;
for CHtml::link I used
'onclick' => "history.go(-1);return false;"
otherwise the page is just reloading.
widget not useful
its not advisable to create this in a widget, just a waste. just used onclick='history.go(-1); return false'
Bryglet
The all idea of a widget is use it whenever and wherever you want it. If you prefer to code it each time, just do it.
This is a simple widget that you can extend to make it better if you like, if you dont, so sad ;).
I just dont like the idea of copy & paste each time that I need something. In my case I use something more complex for the go back button, but is not the idea to show everything in this how to.
Have a nice day !
Kind of overkill?
It's a nice idea to have a common design and behavior for a Back Button, but the common design should be done with a simple CSS class, and the common behavior is just
'onclick' => "history.go(-1);return false;".
Anything else seems bloatted code to me. But I can be wrong, of course. I'd like to know in which scenarios a back button will need further added functionality (not design, because design should be CSS based)
I'ts Cool
Thank you , it's help me to learn basic widget structure
Not required widget
Not required to create any widget for back button, just need to write single line of code..
echo CHtml::button('Back',array('name' => 'btnBack','onclick'=>'js:history.go(-1);returnFalse;','class'=>'uibutton loading confirm'));
Thank you ...
@Rohit, this is for the ones like me that at the beginning did not understand the basic concepts of a widget. But thank you for the destructive Feedback.
If you have any questions, please ask in the forum instead.
Signup or Login in order to comment.