Create Codeigniter html components

Asked

Viewed 212 times

1

I’m using CodeIgniter and I don’t know how to create components to embed in my views. I think I should create my components using templates, correct? I have many repeated codes on views but I saw that, using parser, server resource consumption is greatly increased. What can I do to increase code reuse in my project?

php html codeigniter

1 answer

1


Yes, use templates is good, and there’s an excellent answer here. But the use of templates for views does not properly implement components HTML. Follow the guidance in the indication and add the mechanism of templates. It will help to increase code reuse, especially if you have different sections within the system.

Components created with helpers

To implement components, I suggest using a helper. Particularly, the HTML Helper. Load it into the application using Autoload.

Within application/config/autoload.php, look for $autoload['helper'] and add the helper html on the list:

$autoload['helper'] = array('html');

Create/extend application/helpers/MY_html_helper.php and insert the following:

if( ! function_exists('bootstrap_alert')){

    function bootstrap_alert($class=null, $msg=null){
        $ci = & get_instance();
        echo '<div class="alert alert-'.$class.' alert-dismissible" role="alert">';
        echo '<button type="button" class="close" data-dismiss="alert"';
        echo 'aria-label="Close"><span aria-hidden="true">&times;</span></button>';
        echo $msg;
        echo '</div>';
    }

}

Ready. With the Function bootstrap_alert() I created a component Alert CSS library Bootstrap v3.3.7. Now just call bootstrap_alert() in any view passing to $msg and the $class CSS desired that this structure will be shown.

That goes for, literally, any type of component HTML that you need to create.

Components from physical files

It may be necessary to load components from written templates on the server. Modals, for example, can be loaded into the document HTML and manipulated with JavaScript to create interactions with the user. Follow the function:

if( ! function_exists('load_modal')){

    /**
     * Carrega conteudo de arquivos no corpo do documento HTML;
     * @return void
     */
    function load_modal() {
        $path = APPPATH . "views/modal/";
        if (file_exists($path)) {
            $iteractor = new DirectoryIterator($path);
            foreach ($iteractor as $entry) {
                if ($entry->isFile()) {
                    $exts = ['php'];
                    if (in_array($entry->getExtension(), $exts)) {
                        include_once($path.$entry->getFilename());
                    }
                }
            }
        }
    }
}

Basically, all the files .php that you save inside the directory $path will be loaded to the HTML at the place where the Function load_modal() is called (which can be immediately after <body>, for example). Knowing this, inside $path, save the file modal.php:

<?php
defined('BASEPATH') OR exit('No direct script access allowed');
$ci = & get_instance();
?>
<!-- modal_alert-->
<div class="modal fade" data-backdrop="static" id="modal_alert" tabindex="-1" role="dialog" aria-labelledby="modal_alert_label">
    <form class="form-horizontal" method="post" action="<?= base_url('users/modal_alert') ?>">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                    <h4 class="modal-title" id="modal_alert_label">
                        <span class="glyphicon glyphicon-exclamation-sign"></span>
                        Aviso
                    </h4>
                </div>
                <div class="modal-body">
                    <div class='alert' role='alert'>
                        <center>
                            <p class='glyphicon glyphicon-exclamation-sign'></p>
                            <br>
                            <h3><b id="modal_alert_content"></b></h3>
                        </center>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" data-dismiss="modal" class="btn btn-default" id="modal_alert_cancel_button">
                        Fechar
                    </button>
                </div>
            </div>
        </div>
    </form>
</div>
<!-- modal_alert-->

I chose to save how .php why I may need/want this modal to print some configuration item, some database data, or anything else (in this case, I used base_url('users/modal_alert') in action form). But that’s not mandatory, as you might see in the above function.

That goes for, literally, any type of component HTML that you need to create from pre-formatted files.

  • Excellent, thank you very much, I’ll take a test.

  • Perfect! , it worked! , thank you...

Browser other questions tagged php html codeigniter

You are not signed in. Login or sign up in order to post.