MFlow  Create and maintain dynamic Web applications as easy and fast as console applications
Thou shall not write request handlers
 This release: 11/06/2014.  agocorona@gmail.com (@agocorona) <>< . issues & bugs .  Mflow Source code,     source code of this site




Simple, lightweight AJAX

This example increases the value of a text box each time the box is clicked


Running example

(in the light red box):

Ajax example that increment the value in a box

click the box


Source code:

{-# OPTIONS -XCPP #-} 

module AjaxSample ( ajaxsample) where

import Data.Monoid
import Data.ByteString.Lazy.Char8 as B
-- #define ALONE
#ifdef ALONE
import MFlow.Wai.Blaze.Html.All
main= runNavigation "" $ transientNav ajaxsample
#else
import MFlow.Wai.Blaze.Html.All hiding(page)
import Menu
#endif

ajaxsample= do
   r <- page  $   p << b <<  "Ajax example that increment the value in a box"
            ++> do
                 let elemval= "document.getElementById('text1').value"
                 ajaxc <- ajax $ \n -> return . B.pack $ elemval <> "='" <> show(read  n +1) <>  "'"
                 b <<  "click the box "
                   ++> getInt (Just 0) <! [("id","text1"),("onclick", ajaxc  elemval)] <** submitButton "submit"
   page  $ p << ( show r ++ " returned")  ++> wlink ()  << p <<  " menu"


comments powered by Disqus