當前位置：首頁 > 编程资源 > 综合教程 >内容正文

综合教程

使用PHP开发HR系统（5）

發布時間：2024/2/2 综合教程 35 生活家

生活随笔收集整理的這篇文章主要介紹了使用PHP开发HR系统（5）小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

本節講述如何拆分頁面以及使用jquery和ajax實現局部刷新。

==================================================================================================

從我們的頁面來看，左邊的菜單是不變的，右邊的內容區根據不同的菜單來變化，我們就想到是否可以只針對

右邊做局部刷新呢，可以使用ajax技術來完成。

1 拆分主頁

我們把頁面結構分成四塊區域：1、頁面上端Top區域；2、頁面左側Menu區域；3、頁面中部區域；4、頁面底端footer區域；

根據這種劃分，我們把main_list拆分成top，menu，footer，并把頁面head也單獨出來，具體參見以下步驟：

1）在view目錄下創建container.php代替main_list.php文件

<?php

defined('BASEPATH') OR exit('No direct script access allowed');

<!DOCTYPE html>

<?php $this->load->view('templates/header'); ?>

<?php $this->load->view('templates/top'); ?>

<?php $this->load->view('templates/menu'); ?>

<?php $this->load->view('main'); ?>

</div>

<?php $this->load->view('templates/footer'); ?>

</body>

</html>

通過改造，我們的主頁代碼看起來就很簡潔了，其中用到了幾個文件：

i)header.php（view->templates目錄下），用來存放頁面head塊代碼：

<head>

<title>Software Service Manager System</title>

</head>

ii)top.php（view->templates目錄下），用來存放頁面top區域的內容：

</div>

<img src="<?php%20echo%20base_url('assets/img/logo.png')?>" alt="Metro Lab" />

</a>

<!-- <a class="btn btn-navbar collapsed" id="main_menu_trigger" data-toggle="collapse" data-target=".nav-collapse">

</a>-->

</div>

</a>

</li>

</a>

</li>

</a>

<li>

<a href="#">Swing</a></li>

<li>

</ul>

</li>

</ul>

</div>

iii)menu.php（view->templates目錄下），用來存放頁面menu塊代碼：

</form>

</div>

</a>

</li>

<span>人力資源規劃</span>

</a>

</li>

<span>招聘與配置</span>

</a>

</ul>

</li>

<span>培訓與開發</span>

</a>

</li>

</a>

</li>

<span>薪酬福利管理</span>

</a>

</li>

<span>勞動關系管理</span>

</a>

</li>

</a>

</li>

</a>

</ul>

</li>

</div>

iV)footer.php（view->templates目錄下），用來存放頁面footer塊代碼：

2018 © MetroAdmin.

</div>

<!--[if lt IE 9]>

<![endif]-->

V)main.php（view目錄下），用來存放頁面主頁面內容區代碼：

</h3>

<li>

</li>

</div>

</form>

</li>

</ul>

</div>

<div class="status">在職人員總數</div>

</a>

</div>

<div class="status">待招聘人數</div>

</a>

</div>

<div class="status">本月入職人數</div>

</a>

</div>

<div class="status">本月離職人數</div>

</a>

</div>

<div class="status">本月待招聘人數</div>

</a>

</div>

<div class="status">本年薪酬福利</div>

</a>

</div>

<div class="status">本月薪酬福利</div>

</a>

</div>

</div>

</div>

2)目前我們的工程結構如下

2、修改controllers->Main.php文件

<?php

defined('BASEPATH') OR exit('No direct script access allowed');

class Main extends CI_Controller {

public function __construct(){

parent::__construct();

$this->load->helper('url_helper');

}

public function index()

{

$this->load->view('container');

}

3 ajax的應用

為了實現局部刷新，我們引入了ajax來實現；

1）在footer.php文件中增加以下內容

$(document).ready(function(){

$(".sub1").click(function(){

$.ajax({url:"<?php echo site_url('Employee/index')?>",success:function(result){

$("#main-content").html(result);

}});

});

</script>

其中，sub1是與menu.php中的"職員信息"菜單對應的。

3 運行測試

運行主頁如下；

點"職員信息"菜單，頁面如下

總結：

本文首先拆分了主頁，使得模塊更加獨立，頁面代碼也更清晰，同時使用ajax技術，實現了頁面的局部刷新；

====================================The End==========================

總結

以上是生活随笔為你收集整理的使用PHP开发HR系统（5）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。

上一篇： [Python 多线程] 详解daemo
下一篇：如何看电脑显卡性能如何看自己电脑显卡