Code Review Stack Exchange is a question and answer site for peer programmer code reviews. It's 100% free, no registration required.

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I'm doing a web site in CodeIgniter and I'm loading the content page via jQuery, but I don't know if this is a good practice or not. Could I improve it?

jQuery:

// Another question here: how can I group the repeated code in a function:

$(function() {

var control = '../Indoamericana/Intranet/index/Proceso/';

var loadPage = function(page){
    $(".page-content").load(page);  
};

$("#gestion_directiva").click(function(event) {
    var process = 1;
    loadPage(control + process);
});

$("#gestion_calidad").click(function(event) {
    var process = 2;
    loadPage(control + process);
});

$("#gestion_academica").click(function(event) {
    var process = 3;
    loadPage(control + process);
});

Controller:

/**
* index();
* 
* funcion que carga la información del proceso en la intranet
* @param String $process Identificador del proceso a cargar
* @return Vista del proceso indicado
*/

public function index($process, $idProcess){        

    $data['data'] = $this->intranet_model->getProcessInfo($idProcess);
    $data['member'] = $this->intranet_model->getMembers($idProcess);
    $data['proceso'] = 'GI7';

    $route = '/Modules/Intranet/';
    $route .= $process;

    $this->load->view($route, $data);       
}

View:

<div class="row">
    <div class="col-md-12">
        <h3 class="page-title">
            <?php foreach ($data as $row): ?>
            <?php echo $row->name ?>
            <?php endforeach ?>
        </h3>
        <ul class="page-breadcrumb breadcrumb">
            <li>
                <i class="icon-home"></i>
                <a href="index.html">Página Principal</a> 
                <i class="icon-angle-right"></i>
            </li>
            <li>
                <a href="#">Intranet</a>
                <i class="icon-angle-right"></i>
            </li>
            <li>
                <a href="#"> 
                    <?php foreach ($data as $row): ?>
                    <?php echo $row->name ?>
                    <?php endforeach ?>
                </a>
            </li>
        </ul>
    </div> 
</div>
share|improve this question

migrated from stackoverflow.com Dec 21 '13 at 3:02

This question came from our site for professional and enthusiast programmers.

up vote 2 down vote accepted

You might already know this but you can add a library class called 'template' it allows you to make a kind of a masterpage where you can load all different php files, for example your header - content - footer or anything else, seperately into one page.

Your controller will look like this for example:

 public function example() {
        $partials = array('header' => 'header', 'navigation' => 'navigation', 'content' => 'content');
        $this->template->load('masterpage.php', $partials);
    }

Read more at http://ellislab.com/codeigniter%20/user-guide/libraries/parser.html

It's really use to use once you know how it's done.

For example you could use for every page the same navigation but another index and header.

The masterpage looks like this:

<!DOCTYPE html>
<html lang="en">
    <head>
    </head>
    <body>
<?php echo $navigation; ?>
<?php echo $header; ?>
<?php echo $content; ?>
        <div id="footer">
            <div class="container">
            </div>
        </div>
    </body>
</html>

The last thing you need to do is search for the library file on the net upload it and autoload the library in your configs, file: autoload or just in the constructor of your controller. I recommend autoloading the template library because you normally use it at every end of a controller to make the full view.

share|improve this answer
    
Which will give for this example the same footer on every page but you can choose which php file is shown at the controller for navigation, header and content. – user2103237 Dec 20 '13 at 22:26

Only addressing the jQuery part -

One way to simplify the code is by using the Function.prototype.bind() method.

$(function () {

    var control = '../Indoamericana/Intranet/index/Proceso/';

    var loadPage = function (process) {
        var page = control + process;
        $(".page-content").load(page);
    };

    $("#gestion_directiva").click(loadPage.bind(this, 1));

    $("#gestion_calidad").click(loadPage.bind(this, 2));

    $("#gestion_academica").click(loadPage.bind(this, 3));
});

You could also derive the process from the JavaScript event, but that might be a bit more clumsy.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.