Published in 21:03 of 08/12/2012 by

Published in 21:03 of 08/12/2012

←Home

Loading html elements dynamically with web2py and ajax

Put this code in a view /views/default/index.html

only works if you have static/js/web2py.js, normally comes with welcome app

<!-- begin -->
<button class="load_content" data-url="{{=URL('default', 'otherthing1')}}" data-target="ajax_container"> Click to load content1 </button>
<button class="load_content" data-url="{{=URL('default', 'otherthing2')}}" data-target="ajax_container"> Click to load content2 </button>
<button class="load_content" data-url="{{=URL('default', 'otherthing3')}}" data-target="ajax_container"> Click to load content3 </button>
<button class="load_content" data-url="{{=URL('default', 'otherthing4')}}" data-target="ajax_container"> Click to load content4 </button>


<div id="ajax_container"> <!-- CONTENT COMES HERE --> </div>

<script>
$(function () {
   $('.load_content').on('click', function (e) {
        elem = $(this); // elem = $(e.target)
        url = elem.attr("data-url");
        target = elem.attr("data-target");
        web2py_ajax_page("GET", url, "", target);
        return false; // e.preventDefault()
      });
})
</script>
<!-- end -->

When the user clicks on buttons, the content is ajax-loaded in to ajax_container

  • O Natal Animal 2013 está no ar in Home · 23:24 of 12/10/2013
  • Desenvolvendo protótipos para startups com Python e web2py in web2py · 20:25 of 11/19/2013
  • Gravando logs de aplicativos web2py in web2py · 00:29 of 01/21/2013

  • comments powered by Disqus Go Top