![]() |
|
Snippets |
|
For ergonomic and graphism reasons, I sometimes prefer to use link rather than buttons and/or button rather than links...
To do so, I created this small function :
<?php # File : JsHelper.php // use of "normal" Javascript Helper use_helper('Javascript'); /*! * Create a link that submit the closest parent form * * @param $string string : text to display * @param $options mixed : options to be pass to the tag * @return string : HTML code for the link */ function link_to_submit( $string, $options = null ) { $func = ";var a=this.ancestors();for(var i in a){if(a[i].tagName=='FORM'){try{a[i].onsubmit();} catch(err){a[i].submit();}break;}}"; return link_to_function( $string, $func, $options ); } /*! * Create a button that act as a link * * @param $string string : text to display in the button * @param $url string : URL of the link * @param $options mixed : options to be pass to the tag * @return string : HTML code for the link */ function button_to_link( $string, $url, $options = null ) { $url = url_for($url); $func = ";document.location = '$url';return false;"; if ( is_string($options) ) $options.= " onclick=$func"; else $options['onclick'] = $func; return tag('button', $options ).htmlspecialchars($string).'</button>'; }
Then, you simply use it as a normal link_to function :
<? use_helper('Js') ?> <?=form_tag('module/action')?> <?=input_tag('text')?> <?=link_to_submit('Validate')?> <?=link_to('Cancel','module/index')?> </form>
Or :
<? use_helper('Js') ?> <?=form_tag('module/action')?> <?=input_tag('text')?> <?=submit_tag('Validate')?> <?=button_to_link('Cancel','module/index')?> </form>
In these two examples, links/buttons of the form are graphicly consistents. For a better user experience ;)
PS : works as well with AJAX forms form_remote_tag()
PPS : Don't forget that thanks to CSS, you can make a button looking like a link (et vice-versa).
PPPS : Don't forget that buttons and links doesn't have the same meaning for search engine bots.
PPPPS : Don't forget that this rely on the fact that user is using javascript!!!
This helper used JavascriptHelper. It create a div which open a another onclick with a visual effect. The content of the div is the template's result of a call to a module/action.
/** * Fonction my_div_to_remote * @author Julien Levasseur * @since - 13 sept. 07 * Extend of my_button_to_remote. return a div. * * Returns an html button to a remote action defined by 'url' (using the * 'url_for()' format) that's called in the background using XMLHttpRequest. * * See link_to_remote() for details. * */ function my_div_to_remote($name, $options = array(),$effect, $html_options = array()) { return my_div_to_function($name, $effect, remote_function($options), $html_options); } function my_div_to_function($name,$effect, $function, $html_options = array()) { $html_options = _parse_attributes($html_options); $html_options['onclick'] = $function.';'.$effect['onclickadd'].';return false;'; return content_tag('div', $name, $html_options); }
Example:
<?php echo my_div_to_remote('div de test',array('url'=>'principal/pret'),array('onclickadd' => visual_effect('toggle_blind', 'rem', array('duration' => 4.0))),array('style'=>'border: solid 1px;width:40px;height:40px;')) ?> <div id="rem" style="display:none;height:300px;border:solid 1px;">youpi</div>