Note, you are not limited to passing just the text of the flash message via 
response.flash -- instead, you can send any arbitrary HTML. So, a simpler 
strategy is just to build the entire HTML DOM for the flash message and 
send that in response.flash. You then just need to make two adjustments in 
your layout/CSS: (1) change the HTML markup so it includes a div with just 
the "flash" class and nothing else, and (2) create a CSS rule to hide the 
#closeflash element automatically created by web2py.js (assuming you don't 
want it). For example:

In layout.html:

<div class="flash">{{=response.flash or ''}}</div>

Add a CSS rule (in the head of layout.html or in a CSS file):

#closeflash {display: none;}

Create a flash helper function (in a model or module):

def flash(message, status='default'):
    return DIV(message, BUTTON(SPAN('Close', _class='sr-only'),
                               data=dict(dismiss='alert'),
                               _type='button', _class='close'),
               _class='alert alert-dismissable alert-%s' % status)

Then to set the flash message, just do:

    response.flash = flash('This is a default alert')

or:

    response.flash = flash('This is a warning alert', 'warning')

Anthony

On Friday, June 27, 2014 at 10:59:39 AM UTC-4, Leonel Câmara wrote:
>
> Hey,
>
> I wanted to change web2py response.flash to use bootstrap3 alerts.
>
> I started by creating an alert-default in my css since bootstrap3 doesn't 
> have one and I wanted it, then I placed this in my layout.html
>
>
> <div class="{{='flash alert alert-dismissable ' + ('alert-' + 
> (response.flash_status or 'default'))}}">{{if response.flash:}}
>                   {{=response.flash}}
>                   <button type="button" class="close" 
> data-dismiss="alert"><span aria-hidden="true">&times;</span><span 
> class="sr-only">Close</span></button>
>                   {{pass}}</div>
>
> response.flash_status was my solution so the controllers were able to 
> determine what kind of flash they would want the view to show, this was 
> working quite well until I started having stuff working via ajax. If a 
> request was done using ajax all my alerts were being shown with default. 
> After a bit of digging I found that  $.web2py.flash also had a "status" 
> argument that could add a class so I thought this would be quite simple. 
> Nothing could be further from the truth. In the end I had to do this:
>
> 1. Add this to my models
>
> def ajax_flash_status(view):
>     import urllib2
>     if response.flash:
>         if not response.flash_status:
>              response.flash_status = 'default'
>         response.headers['web2py-component-flash-status'] = \
>             urllib2.quote('alert-'+xmlescape(response.flash_status)\
>                               .replace('\n',''))
>     return view
> if request.ajax:
>     response.postprocessing.append(ajax_flash_status)
>
>
> 2. Add a js file to the project which I add after all the other js files 
> containing this:
>
> $.web2py.after_ajax = function (xhr) {
>     /* called whenever an ajax request completes */
>     var command = xhr.getResponseHeader('web2py-component-command');
>     var flash = xhr.getResponseHeader('web2py-component-flash');
>     var flash_status = 
> xhr.getResponseHeader('web2py-component-flash-status');
>     if(command !== null) {
>         eval(decodeURIComponent(command));
>     }
>     if(flash) {
>         $.web2py.flash(decodeURIComponent(flash), 
> decodeURIComponent(flash_status));
>     }
> };
>
> $.web2py.flash = function (message, status) {
>     var flash = $('.flash');
>     $.web2py.hide_flash();
>
>     flash.html(message);
>     if (typeof status !== 'undefined') {
>         flash.removeClass('alert-default alert-success alert-info 
> alert-warning alert-danger').addClass(status);
>     }
>     if(flash.html()) {
>       flash.append(
>         '<button type="button" class="close" data-dismiss="alert">' +
>         '<span aria-hidden="true">&times;</span><span class="sr-only">' +
>         w2p_ajax_close_message +
>         '</span>' +
>         '</button>'
>       ).slideDown();
>     }
> };
>
>
> Anyway, my question is, am I doing something wrong here? Wasn't there a 
> simpler way to implement this?
>
>
>
>
>
>
>

-- 
Resources:
- http://web2py.com
- http://web2py.com/book (Documentation)
- http://github.com/web2py/web2py (Source code)
- https://code.google.com/p/web2py/issues/list (Report Issues)
--- 
You received this message because you are subscribed to the Google Groups 
"web2py-users" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to web2py+unsubscr...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Reply via email to