WordPress: How to Create Layout in WPMVC

In this tutorial I will tell you how to create layout in wpmvc. Layout is very important part of theming.
Below steps to follow to create ajax request. Below steps is describing how to create show ajax request.

Step 1: Create ajax layout under view/layouts/ajax_layout.php

1
<?php $this->render_main_view(); ?>


Step 2: define html link where you click to fire ajax req.

1
2
3
4
5
6
7
8
<a href="javascript:void(0)" id="target-anchor" target-div="#projectTableDiv" target-url="tbl_projects/show/1/">get result</a>

<strong>Step 3:</strong>  Call through controller action.

function show() {
    $this->render_view('tbl_projects/show', array('layout' => 'ajax_layout'));
      exit(0);
    }

Step 4: Create show.php file under view folder.
Step 5: Create js function in js file.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
jQuery("#target-anchor").click(function(e) {
                  if (jQuery(this).attr('href') == null)
                        return;
                  var params = {
                        datatarget : jQuery(this).attr('target-div'),
                        url : jQuery(this).attr('target-url')
                  }
                  e.preventDefault();
                  that.getDetails(params);
            });

that.getDetails = function(params) {
            alert(siteurl + params['url']);
            jQuery.ajax( {
                  url : siteurl + params['url'],
                  dataType : "html",
                  type : 'post',
                  success : function(response) {
                        alert(response);
                        jQuery(params['datatarget']).html(response);
                        // jQuery('#loader').hide();
                  },
                  error : function(xhr, ajaxOptions, thrownError) {
                        alert('status Code:' + xhr.status + 'Error Message :'
                                    + thrownError);
                  }

            });

      }
The following two tabs change content below.
Hi, This is Parvez Alam from India. I am software developer with 4 years’ experience in web development. I have submitted articles on PHP, Mysql, Magento,CSS, HTML, jQuery, web designing and social API. You can subscribe to my blog via RSS/Twitter/Google plus and Facebook. parvez1487(at)gmail(dot)com

Latest posts by Parvez (see all)

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>