Chapter 7. Views

This chapter covers the process flow to render views, the process flow within the view file, different type of views, and their role and usage with several code examples of web applications.

The views are programmatic portions that provide content to the browser to be executed on the client side (that is, the user PC) to make the user-interface session on the local computer.

The PHP view file rendered output returns from the server as an HTTP response content to the requesting browser application (that is, requesting via submitting a URI in the browser navigation area).

Initially, the browser sends a URI request that the user types in, to a default or specific controller method, such as http://mysite.com/myapp/helloworld.

The called controller method processes the request, performs its decision making, and may use the other CI resources, such as helpers, libraries, models, and eventually renders a view back as an HTTP response to the browser HTTP request that initiates the controller operation. The HTML file returned to the browser includes HTML, CSS, and JavaScript. The browser executes the received rendered view from the server, and uses it to perform the user-interface session (visual elements, and UI elements, such as buttons, scrollbars, and navigation elements); we see and operate via the browser to navigate to other page views or get specific information or media by issuing a page anchor, button, clicking on the icon, and so on. The described action causes another HTTP request(s), either synchronous (mostly anchor) or asynchronous AJAX request(s) handled by JavaScript embedded in the web page.

The CI view is a PHP file that may contain part or all of the following: PHP statements, HTML tags, CSS, JavaScript program, Flash, images, and media sources. In CI, a view file may contain the PHP code that uses the controller-provided parameters, or even call the CI helpers, libraries, or model directly to generate the output that is part of the generated HTML file response. The generated PHP output can be strings or numeric values incorporated in the HTML tags, or even a whole HTML page.

This chapter will primarily focus on the following topics:

  • The CI view scope:
    • The CI view resources path
    • The rendering flow
    • Client-side flexibility
    • Accessing libraries/helpers within a view
    • Forms
    • Using AJAX
    • View parser configuration issues
    • Integrating jQuery or other client-side libraries
  • View rendering plugins (view template plugin example)
  • Example 1: HTML5 location powered by Google Maps
  • Example 2: user feedback powered by AJAX and the jQuery UI

We will begin by briefly reviewing the CI view scope, and will proceed with several usage examples covering different use cases that can be combined in a real project.

Scope of the CI view

The CI view is enabled with great flexibility to integrate the client-side third-party resources, as well as accessing the CI resources of the CI libraries, helpers, and models.

This section will focus on the CI view syntax and usage guidelines, as a preface to the coming usage code examples.

We can extend the CI library using the third-party libraries from the CI echo system or develop our own libraries.

The CI view resources path

In a CI project, the view files are located under the application/views/ directory or any subdirectory to this path. For example, we can build under application/views/ subdirectories, for let's say, two different view categories to improve the clarity of the file structure in our project. The following screenshot shows the views location in a CI project directory tree:

The CI view resources path

For example, to render a template file located at Application/views/templates/ named home.php, we shall write the following code:

$this->load->view('templates/home'),
//The following load view call, render a view using all its optional parameters
$this->load->view('view_file', // PHP view file to render
$view_params,  // parameters array for view
FALSE  //  FALSE - default. to output
//   TRUE – back as string
  );

In this example, view_file is referring to the CI resource PHP view file application/views/view_file.php.

$view_params is the array of parameters (scalar/array in each entry) for the view file, as we have demonstrated at several places earlier, so that each array key, let's say, name, becomes the $name PHP variable in the view to use.

In case we wish to get the processed view into a buffer, for, special processing, caching, or any other processing purpose, for example you may call the following example:

$view_buffer=$this->load->view('sectionA/view_file', $params, TRUE);

Note that the third parameter's value is set to TRUE (the default value is set to FALSE, and echoes the view to the standard output; in the case of the controller rendering, this means it will be returned as an HTTP response to the browser, issuing the request from the controller).

The preceding example refers to the following view file: application/views/sectionA/view_file.php.

The rendering flow

The view is rendered by the controller. The controller provides the parameters to the rendered PHP view file to use them.

The controller uses the following built-in CI load library: $this->load->view('my_view',$data);

Otherwise, the controller uses the third-party rendering service library. In this chapter we will use such a library. The CI controller rendering is done by the CI load view library, and that optionally accepts the $data of parameters and objects that the rendered PHP view file can use. See the following code for example:

$data['myval'] = 'Hello';
$this->load->view('my_view',$data);

The rendered PHP view file application/views/my_view.php uses the $data parameters provided via the load library as follows:

<H1><?PHP echo $myval; ?></H1>

Note that the controller defines the data as follows:

$data['myval'] = 'Hello';

While the usage at the PHP view file rendered will be as follows:

<H1><?PHP echo $myval; ?></H1>

Later, the PHP view file will be executed, so that the HTML generated code will be as follows:

<H1>Hello</H1>

The entire PHP view file that is rendered, including the PHP executions, will generate the view HTML file that will be returned to the browser via HTTP to be executed locally.

View flexibility

CI provides the flexibility for the PHP view file code to use any client-side JavaScript/CSS/HTML, or other JavaScript libraries in the view files, without any requirement to declare them at the server-side controller, as it occurs in some other platforms.

Furthermore, the CI view can access any other CI resources, such as the CI libraries, the CI models, or the CI helpers, as if it were the rendering controller of the view; for example, accessing a session parameter directly.

$param = $this->session->userdata('param1' );

Also, the CI view can call a CI library method directly in the same fashion as the rendering controller does (assuming the rendering controller loads this library).

$calc = $this->my_lib->my_lib_calc( $param);
<H1><?PHP echo $calc; ?></H1>
..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
3.149.228.138