php框架排行symfony 图片加载不了

安装php+symfony环境+第一个项目hello
PHP开发环境安装---三合一(AppServ)
1. 安装Mysql+PHP+APACHE的集成环境
下载我们为你准备好的Mysql+php+apache的集成包,并解压出来,点击目录夹中唯一的一个执行安装文件,进入环境向导安装。
开始apache 2.4.10服务器安装,点击下一步【NEXT】
接受协议,我想大家在这种完全免费的GNU协议下会毫不犹豫的同意吧!点击【I Agree】
选择安装目录夹,这个由你自己决定吧。最好可用空间大点哦!点击下一步【Next】
这个不用多考虑,全选即可。继续点击【Next】
Apache HTTP Server 阿帕奇WEB/HTTP服务器
MySQL Database MySQL数据库PHP Hypertext Preprocessor &PHPphpMyAdmin 管理MySQL数据库的Web应用程序
这个步骤稍微要添点内容
Server Name 服务器名称,可以随你意写一个。Administrator’s Email Address 管理员邮件地址,这个填你的吧Apache HTTP Port 默认为80端口,在你确信80端口没有占时候可以不填,如果安装IIS的朋友最好设一个其他的端口,为了后面的学习,最好统一为8080。
点击下一步【Next】
设置MySQL数据库
Enter root password 输入数据库访问密码,下面再输。即为root账号的密码下面打勾 Enable InnoDB 可以使用数据库事务处理引擎。其他无需变动了。
点击【Install】,等待安装完毕。
最后面板,就是告诉你已经安装完成了,点【Finish】,就开始启动Apache与MySQL服务了。如果安装安全卫士360,会弹出对话框询问 是否开机时启动,建议开机时自动启动,我在测试时没有选择开机自动启动AppServ,导致时常AppServ无法运行,每次手工启动后一段时 间,APACHE或MYSQL即停止服务,需要再行启动,这可能和杀毒软件有关。
2. 测试安装环境
安装之后,我们还要小作一下测试,打开你的浏览器,在地址栏里键入 ,是否可以正常显示页面
如果可以看到这个结果,点击
,弹出对话框,输入账号与密码,账号是root,密码你自己清楚,之前填的。
进入这个页面,后面需要用phpMyAdmin来查看数据库的一些信息。
下面测试命令提示符下php的可用性。
打开命令提示符界面,输入 php –v
如果没猜错,你会弹出类似的错误对话框,这个是安装包安装后的一个小BUG,所以我们需要纠正一下。
在运行下,输入php.ini 打开 php的配置文件。
通过查找php_mbstring.dll 定位到该行,我们需要剪切掉这行,并把它放到上面去,如下图所示。
保存,再在命令提示符下键入 php –v
该命令显示PHP的版本信息,OK了。
PHP开发框架---symfony环境安装
1. 安装PHP的pear环境
Pear是什么?pear是一种分享可用的PHP组件的框架分布系统。意思,我们可以使用pear直接去寻找和下载我们想要的php有用代码或者组件,这里你可以认为Symfony就是可用的一个组件,我们后面会使用pear来安装Symfony环境,不过先得安装pear。Pear是基于php环境的,所以下面就简单多了。GO!
打开你的AppServ的安装目录夹,找到这个地址
点击,go-pear.bat 批处理文件,进入命令行提示符,在这里我就不再细讲了,你就一直打回车就可以了。注意第二下回车后需要等待pear的安装,完了,继续回车。最后,点击在当前目录下的注册文件PEAR_ENV.reg。
如果要测试pear的是否正常工作,可以在命令行提示符下键入pear。
2. 使用pear安装Symfony开发环境
打开命令提示符,按步骤键入以下命令
注册symfony pear 频道:
&&&&&& pear channel-discoverpear.symfony-project.com
列出可用的安装包:
&&&&&& pear remote-list -c symfony
安装symfony 1.4.x:
&&&&&& pear install symfony/symfony
最后一步请耐心等待吧。。。。安装包不是很大,估计4M以内,看你的网路速度如何。
3. 调试Symfony开发环境
最后我们调试一下symfony环境是否正常运行了,这步很简单,在命令提示符下键入
symfony –V
至此,symfony就安装成功了。
使用Symfony快速生成项目---Hello World
1. 安装一个PHP开发工具,建议 Eclipse For PHP
为了让项目开发更加方便,还是需要一个优秀的开发工具做辅助,我们这里选择了Eclipse,这个工具有 许多的版本,Zend版,绿色版等等,我们这里用一个简易的安装版叫 EasyEclipse。以后大家可以考虑特性更好的版本。安装的方法很简单,运行安装程序,就一步到位,无需安装JDK,因为这个工具是java应 用。&&&&&
这是其大致的外观,至于这个工具使用,我们这里不作详解,只是应项目开发所需稍作介绍。
2. 在命令提示符下操作Symfony的CLI 命令。
Symfony开发与其他框架技术有所不同,它带有内置的CLI命令(而且可以自定义),许多事情只要需要敲几下命令操作就能完成,作为一个专业的开发员,这是个天大的福音啊。对于初学者,也不用怕,其实和DOS命令没啥区别,只是需要花点时间记记单词而已。好了,来吧。
打 开命令提示符,创建Symfony项目工作目录夹,symfony,后面所有项目都放在此目录夹中。进入symfony目录夹,继续建 一个项目目录夹 hello进入目录夹,然后输入 symfony generate:project hello,创建项目hello,这个命令会生成Symfony项目目录架构,这个以后详解。继续命令,输入 symfony generate:app frontend 创建项目的一个应用 frontend,这个命令会生成Symfony应用的目录架构,这个也以后详解。
接下来,把hello项目加入Eclipse中。
切换Eclipse工作目录夹,确定后,工具重启。
新建PHP项目,在对话框选择PHP项目,下一步。
键入hello,结束,加入生成的Symfony项目。
这是最终的项目目录结构,我们以后会作详解。
3. 为项目配置独立的访问域名
因为生成的项目没有在APACHE 的WWW目录下,所以我们无法用常规方式访问,这里需要配置Apache服务的配置文件,为hello项目配置独立的一个子域名。这对我们以后多个项目开发很有利。
打开Apache的配置文件目录夹
用记事本打开httpd.conf配置文件,在 最下方输入以下内容。注意自己的AppServ的安装目录夹。
IndexIgnore .??* *~ *# HEADER* README* RCS CVS *,v *,t
NameVirtualHost 127.0.0.1:8080
#设置localhost还是解析到WWW目录夹
&VirtualHost 127.0.0.1:8080&
&& &ServerName localhost
& &&& DocumentRoot&C:/appServ/www&
& &&& DirectoryIndex index.php
&& &&Directory&C:/appServ/www&&
&& &&&& AllowOverride All
&& &&&& &&&Allow from All
&& &&/Directory&
&/VirtualHost&
#设置hello.localhost解析到symfony工作目录夹,hello/web
&VirtualHost 127.0.0.1:8080&
&& &ServerName hello.localhost
& &&& DocumentRoot&C:/symfony/hello/web&
& &&& DirectoryIndex index.php
&& &&Directory&C:/symfony/hello/web&&
&& &&&& AllowOverride All
&& &&&& &&&Allow from All
&& &&/Directory&
#引用symfony的内置资源文件,包括CSS,JS等等
&& &Alias /sfC:/AppServ/php5/data/symfony/web/sf
&& &&Directory&C:/AppServ/php5/data/symfony/web/sf&&
&& &&&& &AllowOverrideAll
&& &&&& &&&&Allow from All
&& &&/Directory&
&/VirtualHost&
#如果有多个项目,再配置一份VirtualHost就行,比如现在还有一个cms的项目,在此配置文件中再加入以下代码就行:
&VirtualHost 127.0.0.1:8080&
&& &ServerName cms.localhost
& &&& DocumentRoot&C:/symfony/cms/web&
& &&& DirectoryIndex index.php
&& &&Directory&C:/symfony/cms/web&&
&& &&&& AllowOverride All
&& &&&& &&&Allow from All
&& &&/Directory&
&& &Alias /sfC:/AppServ/php5/data/symfony/web/sf
&& &&Directory&C:/AppServ/php5/data/symfony/web/sf&&
&& &&&& &AllowOverrideAll
&& &&&& &&&&Allow from All
&& &&/Directory&
&/VirtualHost&
下面来完成hello.localhost,cms.localhost的解析配置。
打开目录夹,C:\WINDOWS\system32 \drivers\etc\,
用记事本打开hosts文件,此文件用于配置主机域名解析。
在下 方填写hello.localhost,这里无需端口号,上面那行的你已经猜到什么了吧。
好了,现在重启apache服务:
在浏览器中键入,显示该页面,成功提示你已经创建了一个symfony项目。这是个临时页面,下面可以来写点代码了。
4. 编写代码,实现Hello World。
下面我们继续命令提 示符下的symfony命令
symfony generate:module frontend home
在frontend应用下生成module(模块) home
回到工具刷新项目
或者选择项目按F5
打开图示目录 夹下的文件actions.class.php,注释掉唯一的一行代码。按图示编写代码。
打 开图示目录夹下的文件indexSuccess.php,此文件是一个模板文件,按图示编写代码。
在浏览器地址栏中输入
,至此,我们已经完成这个小小的经典范例。
最后:这个我看了视频之后要写这个的,但是我的同事--元茂童鞋已经写好了,我就拿过来直接用了。写在博客里方便自己查看,也可以让大家共享一下资源。感谢元茂童鞋。
看过本文的人也看了:
我要留言技术领域:
取消收藏确定要取消收藏吗?
删除图谱提示你保存在该图谱下的知识内容也会被删除,建议你先将内容移到其他图谱中。你确定要删除知识图谱及其内容吗?
删除节点提示无法删除该知识节点,因该节点下仍保存有相关知识内容!
删除节点提示你确定要删除该知识节点吗?twig是一个很棒的模板引擎,最棒的php模板引擎。它能够很灵活的组织我们的html代码并能够自定义函数等,给用户呈现一个很友好的页面。现在开始,还记得上一章节的代码吗?今天我们就把它按部就班的放到twig中并用symfony运行喽!
第一步,新建一个bundle
新建一个bundle,要输入以下命令
php app/console generate:bundle --namespace=Nlc/InformationBundle
php app/console generate:bundle --namespace=Nlc/InformationBundle
会出现以下配置信息,下面详细解释如何填写配置
Welcome to the Symfony2 bundle generator
//欢迎使用symfony2 bundle
In your code, a bundle is often referenced by its name. It can be the
concatenation of all namespace parts but it's really up to you to come
up with a unique name (a good practice is to start with the vendor name).
Based on the namespace, we suggest NlcInformationBundle.
//建议使用NlcInformationBundle作为namespace名称
Bundle name [NlcInformationBundle]:
//你的bundle名称
The bundle can be generated anywhere. The suggested default directory uses
the standard conventions.
//bundle能够放置到任意位置.建议还是不要更改遵循惯例.
Target directory [C:/webroot/Symfony/src]:
Determine the format to use for the generated configuration.
//确定生成配置的格式
Configuration format (yml, xml, php, or annotation): annotation
//配置格式(在这里我们选择 annotation )
To help you get started faster, the command can generate some
code snippets for you.
//为了让你更快上手,这个命令给你生成了一些代码段。
Do you want to generate the whole directory structure [no]? yes
//你是否要生成整个目录结构
这里我们需要改写成 yes
Summary before generation
You are going to generate a "Nlc\InformationBundle\NlcInformationBundle" bundle
in "C:/webroot/Symfony/src/" using the "annotation" format.
//你要生成一个Nlc\InformationBundle\NlcInformationBundle在C:/webroot/symfony/src文件夹并使用annotation格式
Do you confirm generation [yes]?
//你确定吗?
Bundle generation
Generating the bundle code: OK
//生成bundle代码已经ok
Checking that the bundle is autoloaded: OK
//检查这个bundle的自动加载情况已经ok
Confirm automatic update of your Kernel [yes]?
//是否自动更新你的Kernel?
Enabling the bundle inside the Kernel: OK
//bundle已经在Kernel内部
Confirm automatic update of the Routing [yes]?
//是否自动更新路由器?
Importing the bundle routing resource: OK
//已经添加了bundle路由文件
You can now start using the generated code!
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
&&Welcome to the Symfony2 bundle generator&&//欢迎使用symfony2 bundle&&&In your code, a bundle is often referenced by its name. It can be theconcatenation of all namespace parts but it's really up to you to comeup with a unique name (a good practice is to start with the vendor name).Based on the namespace, we suggest NlcInformationBundle.//建议使用NlcInformationBundle作为namespace名称&Bundle name [NlcInformationBundle]://你的bundle名称The bundle can be generated anywhere. The suggested default directory usesthe standard conventions.//bundle能够放置到任意位置.建议还是不要更改遵循惯例.Target directory [C:/webroot/Symfony/src]://目录Determine the format to use for the generated configuration.//确定生成配置的格式Configuration format (yml, xml, php, or annotation): annotation//配置格式(在这里我们选择 annotation )To help you get started faster, the command can generate somecode snippets for you.//为了让你更快上手,这个命令给你生成了一些代码段。Do you want to generate the whole directory structure [no]? yes//你是否要生成整个目录结构&&这里我们需要改写成 yes&&&Summary before generation&&You are going to generate a "Nlc\InformationBundle\NlcInformationBundle" bundlein "C:/webroot/Symfony/src/" using the "annotation" format.//你要生成一个Nlc\InformationBundle\NlcInformationBundle在C:/webroot/symfony/src文件夹并使用annotation格式Do you confirm generation [yes]?//你确定吗?&&&Bundle generation&&Generating the bundle code: OK//生成bundle代码已经okChecking that the bundle is autoloaded: OK//检查这个bundle的自动加载情况已经okConfirm automatic update of your Kernel [yes]?//是否自动更新你的Kernel?Enabling the bundle inside the Kernel: OK//bundle已经在Kernel内部Confirm automatic update of the Routing [yes]?//是否自动更新路由器?Importing the bundle routing resource: OK//已经添加了bundle路由文件&&&You can now start using the generated code!
第二步,将html代码装载到twig引擎中
在 src\Nlc\InformationBundle\Resources\views 路径下创建两个twig文件,作为login和admin的基础模板
base.html.twig 作为login页面的基础模板
src\Nlc\InformationBundle\Resources\views\base.html.twig
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=utf-8" /&
&meta name="viewport" content="width=device-width, initial-scale=1"&
&title&信息资料管理&/title&
&!-- 新 Bootstrap 核心 CSS 文件 --&
&link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.2.0/css/bootstrap.min.css"&
&!-- 可选的Bootstrap主题文件(一般不用引入) --&
&link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.2.0/css/bootstrap-theme.min.css"&
&!-- jQuery文件。务必在bootstrap.min.js 之前引入 --&
&script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"&&/script&
&!-- 最新的 Bootstrap 核心 JavaScript 文件 --&
&script src="http://cdn.bootcss.com/bootstrap/3.2.0/js/bootstrap.min.js"&&/script&
{% block itembody %}
{% endblock %}
12345678910111213141516171819202122232425
&!DOCTYPE html&&html&&head&&&&&&meta http-equiv="Content-Type" content="text/ charset=utf-8" /&&&&&&meta name="viewport" content="width=device-width, initial-scale=1"&&&&&&title&信息资料管理&/title&&&&&&!-- 新 Bootstrap 核心 CSS 文件 --&&&&&&link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.2.0/css/bootstrap.min.css"&&&&&&!-- 可选的Bootstrap主题文件(一般不用引入) --&&&&&&link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.2.0/css/bootstrap-theme.min.css"&&&&&&!-- jQuery文件。务必在bootstrap.min.js 之前引入 --&&&&&&script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"&&/script&&&&&&!-- 最新的 Bootstrap 核心 JavaScript 文件 --&&&&&&script src="http://cdn.bootcss.com/bootstrap/3.2.0/js/bootstrap.min.js"&&/script&&/head&&&body&&&{% block itembody %}{% endblock %}&&&/body&&/html&
layout.html.twig作为admin页面的基础模板
src\Nlc\InformationBundle\Resources\views\layout.html.twig
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=utf-8" /&
&meta name="viewport" content="width=device-width, initial-scale=1"&
&title&信息资料管理&/title&
&!-- 新 Bootstrap 核心 CSS 文件 --&
&link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.2.0/css/bootstrap.min.css"&
&!-- 可选的Bootstrap主题文件(一般不用引入) --&
&link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.2.0/css/bootstrap-theme.min.css"&
&!-- jQuery文件。务必在bootstrap.min.js 之前引入 --&
&script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"&&/script&
&!-- 最新的 Bootstrap 核心 JavaScript 文件 --&
&script src="http://cdn.bootcss.com/bootstrap/3.2.0/js/bootstrap.min.js"&&/script&
{% block itemtophead %}
{% endblock %}
&div class="container-fluid"&
{% block itemcontent %}Index{% endblock %}
itemadd %}{% endblock %}
itemupdate %}{% endblock %}
12345678910111213141516171819202122232425262728
&!DOCTYPE html&&html&&head&&&&&&meta http-equiv="Content-Type" content="text/ charset=utf-8" /&&&&&&meta name="viewport" content="width=device-width, initial-scale=1"&&&&&&title&信息资料管理&/title&&&&&&!-- 新 Bootstrap 核心 CSS 文件 --&&&&&&link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.2.0/css/bootstrap.min.css"&&&&&&!-- 可选的Bootstrap主题文件(一般不用引入) --&&&&&&link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.2.0/css/bootstrap-theme.min.css"&&&&&&!-- jQuery文件。务必在bootstrap.min.js 之前引入 --&&&&&&script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"&&/script&&&&&&!-- 最新的 Bootstrap 核心 JavaScript 文件 --&&&&&&script src="http://cdn.bootcss.com/bootstrap/3.2.0/js/bootstrap.min.js"&&/script&&/head&&&body&{% block itemtophead %}{% endblock %}&div class="container-fluid"&&&&&{% block itemcontent %}Index{% endblock %}&/div&{% block&&itemadd %}{% endblock %}{% block&&itemupdate %}{% endblock %}&&&/body&&/html&
然后把不同的布局模块化,分别把 顶部导航、左导航、列表区域、添加页面和编辑页面分成不同的twig模板,当程序需要时将其引入到相应的模板中。
顶部导航页面命名为itemtophead.html.twig,在src\Nlc\InformationBundle\Resources\views中新建一个文件夹Information,并把itemtophead.html.twig放入其中
src\Nlc\InformationBundle\Resources\views\Information\itemtophead.html.twig
@media (min-width: 970px) {
.container-fluid .nav-sidebar{display:}
.nav-sidebar & .active & a, .nav-sidebar & .active & a:hover, .nav-sidebar & .active & a:focus {
background-color: #428
&nav id="navbar-example" class="navbar navbar-default navbar-static" role="navigation"&
&div class="container-fluid"&
&!--手机浏览时显示--&
&button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".nav-collapse"&
&span class="sr-only"&Toggle navigation&/span&
&span class="icon-bar"&&/span&
&span class="icon-bar"&&/span&
&span class="icon-bar"&&/span&
&!--手机浏览时显示 结束--&
&a class="navbar-brand" href="#"&信息管理&/a&
&ul class="nav pull-right" &
&!-- 登录的用户信息 --&
&li class="dropdown"&
&a href="#" class="dropdown-toggle" data-toggle="dropdown"&
&img alt="" src="images/avatar1_small.jpg"&
&span&XMAN&/span&
&span class="caret"&&/span&
&ul class="dropdown-menu"&
&li&&a href="login.html"&&i class="icon-key"&&/i&退出&/a&&/li&
&!-- 登录的用户信息 结束 --&
&/div&&!-- /.container-fluid --&
123456789101112131415161718192021222324252627282930313233343536
&style&&&&&@media (min-width: 970px) {&&&&&&&&.container-fluid .nav-sidebar{display:}&&&&}&&&&.nav-sidebar & .active & a, .nav-sidebar & .active & a:hover, .nav-sidebar & .active & a:focus {&&&&&&&&color: #fff;&&&&&&&&background-color: #428bca;&&&&}&/style&&nav id="navbar-example" class="navbar navbar-default navbar-static" role="navigation"&&&&&&div class="container-fluid"&&&&&&&&&&!--手机浏览时显示--&&&&&&&&&&button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".nav-collapse"&&&&&&&&&&&&&&span class="sr-only"&Toggle navigation&/span&&&&&&&&&&&&&&span class="icon-bar"&&/span&&&&&&&&&&&&&&span class="icon-bar"&&/span&&&&&&&&&&&&&&span class="icon-bar"&&/span&&&&&&&&&&/button&&&&&&&&&&!--手机浏览时显示 结束--&&&&&&&&&&a class="navbar-brand" href="#"&信息管理&/a&&&&&&&&&&ul class="nav pull-right" &&&&&&&&&&&&&&!-- 登录的用户信息 --&&&&&&&&&&&&&&li class="dropdown"&&&&&&&&&&&&&&&&&&a href="#" class="dropdown-toggle" data-toggle="dropdown"&&&&&&&&&&&&&&&&&&&&&&img alt="" src="images/avatar1_small.jpg"&&&&&&&&&&&&&&&&&&&&&&span&XMAN&/span&&&&&&&&&&&&&&&&&&&&&&span class="caret"&&/span&&&&&&&&&&&&&&&&&&/a&&&&&&&&&&&&&&&&&&ul class="dropdown-menu"&&&&&&&&&&&&&&&&&&&&&&li&&a href="login.html"&&i class="icon-key"&&/i&退出&/a&&/li&&&&&&&&&&&&&&&&&&/ul&&&&&&&&&&&&&&/li&&&&&&&&&&&&&&!-- 登录的用户信息 结束 --&&&&&&&&&&/ul&&&&&&/div&&!-- /.container-fluid --&&/nav&
左导航页面命名为itemleftmenu.html.twig,也把它放入到src\Nlc\InformationBundle\Resources\views\Information路径中
src\Nlc\InformationBundle\Resources\views\Information\itemleftmenu.html.twig
class="col-sm-2"&
&ul class="nav nav-sidebar nav-collapse collapse in"&
&li class="active"&&a href="#"&全公司人员&/a&&/li&
&li&&a href="#"&&&&&销售人员&/a&&/li&
&li&&a href="#"&&&&&技术人员&/a&&/li&
&li&&a href="#"&&&&&后勤人员&/a&&/li&
&div&&class="col-sm-2"&&&&&&ul class="nav nav-sidebar nav-collapse collapse in"&&&&&&&&&&li class="active"&&a href="#"&全公司人员&/a&&/li&&&&&&&&&&li&&a href="#"&&&&&销售人员&/a&&/li&&&&&&&&&&li&&a href="#"&&&&&技术人员&/a&&/li&&&&&&&&&&li&&a href="#"&&&&&后勤人员&/a&&/li&&&&&&/ul&&/div&
列表区域页面命名为itemrightlist.html.twig,也把它放入到src\Nlc\InformationBundle\Resources\views\Information路径中
src\Nlc\InformationBundle\Resources\views\Information\itemrightlist.html.twig
&div class="col-sm-10" &
&div class="row"&
&div class="col-xs-6" &&input type="text" class="form-control" placeholder="检索姓名"&&/div&
&div class="col-xs-3" &&input class="btn btn-default" type="submit" value="搜索"&&/div&
&div class="col-xs-3 "&&input class="btn btn-default pull-right" type="submit" data-toggle="modal" data-target="#myModal" value="资料录入"&&/div&
&div class="row"&
&table class="table"&
&th&#&/th&
&th&照片&/th&
&th&姓名&/th&
&th&性别&/th&
&th&年龄&/th&
&th&学历&/th&
&th&简历下载&/th&
&td&1&/td&
&td&&img src="images/avatar1_small.jpg" /&&/td&
&td&张三&/td&
&td&男&/td&
&td&25&/td&
&td&研究生&/td&
&td&张三简历&a&下载&/a&&/td&
&td&&a href="javascript:;" data-toggle="modal" data-target="#myModalUpdate"&编辑&/a&&/td&
&td&2&/td&
&td&&img src="images/avatar1_small.jpg" /&&/td&
&td&李四&/td&
&td&女&/td&
&td&26&/td&
&td&研究生&/td&
&td&李四简历&a&下载&/a&&/td&
&td&&a href="javascript:;" data-toggle="modal" data-target="#myModalUpdate"&编辑&/a&&/td&
&td&3&/td&
&td&&img src="images/avatar1_small.jpg" /&&/td&
&td&王五&/td&
&td&男&/td&
&td&46&/td&
&td&研究生&/td&
&td&王五简历&a&下载&/a&&/td&
&td&&a href="javascript:;" data-toggle="modal" data-target="#myModal"&编辑&/a&&/td&
&div class="row"&
&ul class="pagination"&
&li&&a href="#"&&&/a&&/li&
&li&&a href="#"&1&/a&&/li&
&li&&a href="#"&2&/a&&/li&
&li&&a href="#"&3&/a&&/li&
&li&&a href="#"&4&/a&&/li&
&li&&a href="#"&5&/a&&/li&
&li&&a href="#"&&&/a&&/li&
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768
&div class="col-sm-10" &&&&&&div class="row"&&&&&&&&&&div class="col-xs-6" &&input type="text" class="form-control" placeholder="检索姓名"&&/div&&&&&&&&&&div class="col-xs-3" &&input class="btn btn-default" type="submit" value="搜索"&&/div&&&&&&&&&&div class="col-xs-3 "&&input class="btn btn-default pull-right" type="submit" data-toggle="modal" data-target="#myModal" value="资料录入"&&/div&&&&&&&/div&&&&&&div class="row"&&&&&&&&&&table class="table"&&&&&&&&&&&&&&thead&&&&&&&&&&&&&&tr&&&&&&&&&&&&&&&&&&th&#&/th&&&&&&&&&&&&&&&&&&th&照片&/th&&&&&&&&&&&&&&&&&&th&姓名&/th&&&&&&&&&&&&&&&&&&th&性别&/th&&&&&&&&&&&&&&&&&&th&年龄&/th&&&&&&&&&&&&&&&&&&th&学历&/th&&&&&&&&&&&&&&&&&&th&简历下载&/th&&&&&&&&&&&&&&&&&&th&&/th&&&&&&&&&&&&&&/tr&&&&&&&&&&&&&&/thead&&&&&&&&&&&&&&tbody&&&&&&&&&&&&&&tr&&&&&&&&&&&&&&&&&&td&1&/td&&&&&&&&&&&&&&&&&&td&&img src="images/avatar1_small.jpg" /&&/td&&&&&&&&&&&&&&&&&&td&张三&/td&&&&&&&&&&&&&&&&&&td&男&/td&&&&&&&&&&&&&&&&&&td&25&/td&&&&&&&&&&&&&&&&&&td&研究生&/td&&&&&&&&&&&&&&&&&&td&张三简历&a&下载&/a&&/td&&&&&&&&&&&&&&&&&&td&&a href="javascript:;" data-toggle="modal" data-target="#myModalUpdate"&编辑&/a&&/td&&&&&&&&&&&&&&/tr&&&&&&&&&&&&&&tr&&&&&&&&&&&&&&&&&&td&2&/td&&&&&&&&&&&&&&&&&&td&&img src="images/avatar1_small.jpg" /&&/td&&&&&&&&&&&&&&&&&&td&李四&/td&&&&&&&&&&&&&&&&&&td&女&/td&&&&&&&&&&&&&&&&&&td&26&/td&&&&&&&&&&&&&&&&&&td&研究生&/td&&&&&&&&&&&&&&&&&&td&李四简历&a&下载&/a&&/td&&&&&&&&&&&&&&&&&&td&&a href="javascript:;" data-toggle="modal" data-target="#myModalUpdate"&编辑&/a&&/td&&&&&&&&&&&&&&/tr&&&&&&&&&&&&&&tr&&&&&&&&&&&&&&&&&&td&3&/td&&&&&&&&&&&&&&&&&&td&&img src="images/avatar1_small.jpg" /&&/td&&&&&&&&&&&&&&&&&&td&王五&/td&&&&&&&&&&&&&&&&&&td&男&/td&&&&&&&&&&&&&&&&&&td&46&/td&&&&&&&&&&&&&&&&&&td&研究生&/td&&&&&&&&&&&&&&&&&&td&王五简历&a&下载&/a&&/td&&&&&&&&&&&&&&&&&&td&&a href="javascript:;" data-toggle="modal" data-target="#myModal"&编辑&/a&&/td&&&&&&&&&&&&&&/tr&&&&&&&&&&&&&&/tbody&&&&&&&&&&/table&&&&&&/div&&&&&&div class="row"&&&&&&&&&&ul class="pagination"&&&&&&&&&&&&&&li&&a href="#"&&&/a&&/li&&&&&&&&&&&&&&li&&a href="#"&1&/a&&/li&&&&&&&&&&&&&&li&&a href="#"&2&/a&&/li&&&&&&&&&&&&&&li&&a href="#"&3&/a&&/li&&&&&&&&&&&&&&li&&a href="#"&4&/a&&/li&&&&&&&&&&&&&&li&&a href="#"&5&/a&&/li&&&&&&&&&&&&&&li&&a href="#"&&&/a&&/li&&&&&&&&&&/ul&&&&&&/div&&/div&&/div&
添加页面命名为itemadd.html.twig,也把它放入到src\Nlc\InformationBundle\Resources\views\Information路径中
src\Nlc\InformationBundle\Resources\views\Information\itemadd.html.twig
&!-- Modal 录入表单--&
&div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"&
&div class="modal-dialog"&
&div class="modal-content"&
&div class="modal-header"&
&button type="button" class="close" data-dismiss="modal"&&span aria-hidden="true"&&&/span&&span class="sr-only"&关闭&/span&&/button&
&h4 class="modal-title" id="myModalLabel"&人员信息录入&/h4&
&div class="modal-body"&
&!--内容区域--&
&form role="form"&
&div class="form-group col-xs-4"&
&label for="exampleInputName"&姓名&/label&
&input type="text" class="form-control" id="exampleInputName" placeholder="请输入姓名"&
&div class="form-group col-xs-4"&
&label for="exampleInputSex"&性别&/label&
&input type="password" class="form-control" id="exampleInputSex" placeholder="请输入性别"&
&div class="form-group col-xs-4"&
&label for="exampleInputAge"&年龄&/label&
&input type="password" class="form-control" id="exampleInputAge" placeholder="请输入年龄"&
&div class="form-group col-xs-12"&
&label for="exampleInputEducation"&学历&/label&
&input type="password" class="form-control" id="exampleInputEducation" placeholder="请输入学历"&
&div class="form-group"&
&label for="exampleInputImage"&上传照片&/label&
&input type="file" id="exampleInputImage"&
&p class="help-block"&不要上传超过1M的照片并且上传完成后不可编辑.&/p&
&div class="form-group"&
&label for="exampleInputFile"&上传简历&/label&
&input type="file" id="exampleInputFile"&
&p class="help-block"&不要上传超过1M的附件并且上传完成后不可编辑.&/p&
&!--内容区域结束--&
&div class="modal-footer"&
&button type="button" class="btn btn-default" data-dismiss="modal"&关闭&/button&
&button type="button" class="btn btn-primary"&保存&/button&
&!--end Modal 录入表单--&
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
&!-- Modal 录入表单--&&div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"&&&&&&div class="modal-dialog"&&&&&&&&&&div class="modal-content"&&&&&&&&&&&&&&div class="modal-header"&&&&&&&&&&&&&&&&&&button type="button" class="close" data-dismiss="modal"&&span aria-hidden="true"&&&/span&&span class="sr-only"&关闭&/span&&/button&&&&&&&&&&&&&&&&&&h4 class="modal-title" id="myModalLabel"&人员信息录入&/h4&&&&&&&&&&&&&&/div&&&&&&&&&&&&&&div class="modal-body"&&&&&&&&&&&&&&&&&&!--内容区域--&&&&&&&&&&&&&&&&&&form role="form"&&&&&&&&&&&&&&&&&&&&&&div&&&&&&&&&&&&&&&&&&&&&&&&&&div class="form-group col-xs-4"&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&label for="exampleInputName"&姓名&/label&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&input type="text" class="form-control" id="exampleInputName" placeholder="请输入姓名"&&&&&&&&&&&&&&&&&&&&&&&&&&/div&&&&&&&&&&&&&&&&&&&&&&&&&&div class="form-group col-xs-4"&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&label for="exampleInputSex"&性别&/label&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&input type="password" class="form-control" id="exampleInputSex" placeholder="请输入性别"&&&&&&&&&&&&&&&&&&&&&&&&&&/div&&&&&&&&&&&&&&&&&&&&&&&&&&div class="form-group col-xs-4"&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&label for="exampleInputAge"&年龄&/label&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&input type="password" class="form-control" id="exampleInputAge" placeholder="请输入年龄"&&&&&&&&&&&&&&&&&&&&&&&&&&/div&&&&&&&&&&&&&&&&&&&&&&/div&&&&&&&&&&&&&&&&&&&&&&div class="form-group col-xs-12"&&&&&&&&&&&&&&&&&&&&&&&&&&label for="exampleInputEducation"&学历&/label&&&&&&&&&&&&&&&&&&&&&&&&&&input type="password" class="form-control" id="exampleInputEducation" placeholder="请输入学历"&&&&&&&&&&&&&&&&&&&&&&/div&&&&&&&&&&&&&&&&&&&&&&div class="form-group"&&&&&&&&&&&&&&&&&&&&&&&&&&label for="exampleInputImage"&上传照片&/label&&&&&&&&&&&&&&&&&&&&&&&&&&input type="file" id="exampleInputImage"&&&&&&&&&&&&&&&&&&&&&&&&&&p class="help-block"&不要上传超过1M的照片并且上传完成后不可编辑.&/p&&&&&&&&&&&&&&&&&&&&&&/div&&&&&&&&&&&&&&&&&&&&&&div class="form-group"&&&&&&&&&&&&&&&&&&&&&&&&&&label for="exampleInputFile"&上传简历&/label&&&&&&&&&&&&&&&&&&&&&&&&&&input type="file" id="exampleInputFile"&&&&&&&&&&&&&&&&&&&&&&&&&&p class="help-block"&不要上传超过1M的附件并且上传完成后不可编辑.&/p&&&&&&&&&&&&&&&&&&&&&&/div&&&&&&&&&&&&&&&&&&&&&&&!--内容区域结束--&&&&&&&&&&&&&&/div&&&&&&&&&&&&&&div class="modal-footer"&&&&&&&&&&&&&&&&&&&button type="button" class="btn btn-default" data-dismiss="modal"&关闭&/button&&&&&&&&&&&&&&&&&&button type="button" class="btn btn-primary"&保存&/button&&&&&&&&&&&&&&/div&&&&&&&&&&&&&&/form&&&&&&&&&&/div&&&&&&/div&&/div&&!--end Modal 录入表单--&
编辑页面命名为itemupdate.html.twig,也把它放入到src\Nlc\InformationBundle\Resources\views\Information路径中
src\Nlc\InformationBundle\Resources\views\Information\itemupdate.html.twig
&!-- Modal 编辑表单--&
&div class="modal fade" id="myModalUpdate" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"&
&div class="modal-dialog"&
&div class="modal-content"&
&div class="modal-header"&
&button type="button" class="close" data-dismiss="modal"&&span aria-hidden="true"&&&/span&&span class="sr-only"&关闭&/span&&/button&
&h4 class="modal-title" id="myModalLabel"&人员信息录入&/h4&
&div class="modal-body"&
&!--内容区域--&
&form role="form"&
&div class="row"&
&div class="form-group col-xs-4"&
&label for="exampleInputName"&姓名&/label&
&input type="text" class="form-control" id="exampleInputName" placeholder="请输入姓名"&
&div class="form-group col-xs-4"&
&label for="exampleInputSex"&性别&/label&
&input type="password" class="form-control" id="exampleInputSex" placeholder="请输入性别"&
&div class="form-group col-xs-4"&
&label for="exampleInputAge"&年龄&/label&
&input type="password" class="form-control" id="exampleInputAge" placeholder="请输入年龄"&
&div class="row"&
&div class="form-group col-xs-12"&
&label for="exampleInputEducation"&学历&/label&
&input type="password" class="form-control" id="exampleInputEducation" placeholder="请输入学历"&
&!--内容区域结束--&
&div class="modal-footer"&
&button type="button" class="btn btn-default" data-dismiss="modal"&关闭&/button&
&button type="button" class="btn btn-primary"&保存&/button&
&!--end Modal 编辑表单--&
12345678910111213141516171819202122232425262728293031323334353637383940414243444546
&!-- Modal 编辑表单--&&div class="modal fade" id="myModalUpdate" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"&&&&&&div class="modal-dialog"&&&&&&&&&&div class="modal-content"&&&&&&&&&&&&&&div class="modal-header"&&&&&&&&&&&&&&&&&&button type="button" class="close" data-dismiss="modal"&&span aria-hidden="true"&&&/span&&span class="sr-only"&关闭&/span&&/button&&&&&&&&&&&&&&&&&&h4 class="modal-title" id="myModalLabel"&人员信息录入&/h4&&&&&&&&&&&&&&/div&&&&&&&&&&&&&&div class="modal-body"&&&&&&&&&&&&&&&&&&!--内容区域--&&&&&&&&&&&&&&&&&&form role="form"&&&&&&&&&&&&&&&&&&&&&&div class="row"&&&&&&&&&&&&&&&&&&&&&&&&&&&div class="form-group col-xs-4"&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&label for="exampleInputName"&姓名&/label&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&input type="text" class="form-control" id="exampleInputName" placeholder="请输入姓名"&&&&&&&&&&&&&&&&&&&&&&&&&&/div&&&&&&&&&&&&&&&&&&&&&&&&&&div class="form-group col-xs-4"&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&label for="exampleInputSex"&性别&/label&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&input type="password" class="form-control" id="exampleInputSex" placeholder="请输入性别"&&&&&&&&&&&&&&&&&&&&&&&&&&/div&&&&&&&&&&&&&&&&&&&&&&&&&&div class="form-group col-xs-4"&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&label for="exampleInputAge"&年龄&/label&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&input type="password" class="form-control" id="exampleInputAge" placeholder="请输入年龄"&&&&&&&&&&&&&&&&&&&&&&&&&&/div&&&&&&&&&&&&&&&&&&&&&&/div&&&&&&&&&&&&&&&&&&&&&&div class="row"&&&&&&&&&&&&&&&&&&&&&&&&&&div class="form-group col-xs-12"&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&label for="exampleInputEducation"&学历&/label&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&input type="password" class="form-control" id="exampleInputEducation" placeholder="请输入学历"&&&&&&&&&&&&&&&&&&&&&&&&&&/div&&&&&&&&&&&&&&&&&&&&&&/div&&&&&&&&&&&&&&&&&&&&&&&&!--内容区域结束--&&&&&&&&&&&&&&/div&&&&&&&&&&&&&&div class="modal-footer"&&&&&&&&&&&&&&&&&&&button type="button" class="btn btn-default" data-dismiss="modal"&关闭&/button&&&&&&&&&&&&&&&&&&button type="button" class="btn btn-primary"&保存&/button&&&&&&&&&&&&&&/div&&&&&&&&&&&&&&/form&&&&&&&&&&/div&&&&&&/div&&/div&&!--end Modal 编辑表单--&
好了基本的我们已经完成了,下面我们把它们组装到一起吧。
在 src\Nlc\InformationBundle\Resources\views\Information 新建一个login.html.twig 作为登录页面
src\Nlc\InformationBundle\Resources\views\Information\login.html.twig
{% extends "NlcInformationBundle::base.html.twig" %}
{% block itembody %}
form{max-width: 330 margin:0}
form .form-control{ padding-bottom:10}
&div class="container"&
&form role="form"&
&h2&请在这里登录吧!&/h2&
&input type="email" class="form-control" placeholder="用户名" required autofocus&
&input type="password" class="form-control" placeholder="密码" required&
&button class="btn btn-lg btn-primary btn-block" type="submit"&登陆&/button&
&/div& &!-- /container --&
{% endblock %}
12345678910111213141516171819
{% extends "NlcInformationBundle::base.html.twig" %}&{% block itembody %}&&&&&style&&&&&&&&&form{max-width: 330px; margin:0 auto;}&&&&&&&&form .form-control{ padding-bottom:10px;}&&&&&/style&&&&&&div class="container"&&&&&&&&&&&form role="form"&&&&&&&&&&&&&&h2&请在这里登录吧!&/h2&&&&&&&&&&&&&&input type="email" class="form-control" placeholder="用户名" required autofocus&&&&&&&&&&&&&&input type="password" class="form-control" placeholder="密码" required&&&&&&&&&&&&&&&button class="btn btn-lg btn-primary btn-block" type="submit"&登陆&/button&&&&&&&&&&/form&&&&&&&/div& &!-- /container --&{% endblock %}
在 src\Nlc\InformationBundle\Resources\views\Information 新建一个admin.html.twig 作为管理页面,把需要的模块加入进来
src\Nlc\InformationBundle\Resources\views\Information\admin.html.twig
{% extends "NlcInformationBundle::layout.html.twig" %}
{% block itemtophead %}
{% include "NlcInformationBundle:Information:itemtophead.html.twig" %}
{% endblock %}
{% block itemcontent %}
{% include "NlcInformationBundle:Information:itemleftmenu.html.twig" %}
{% include "NlcInformationBundle:Information:itemrightlist.html.twig" %}
{% endblock %}
itemadd %}
{% include "NlcInformationBundle:Information:itemadd.html.twig" %}
{% endblock %}
itemupdate %}
{% include "NlcInformationBundle:Information:itemupdate.html.twig" %}
{% endblock %}
123456789101112131415
{% extends "NlcInformationBundle::layout.html.twig" %}&{% block itemtophead %}&&&&{% include "NlcInformationBundle:Information:itemtophead.html.twig" %}{% endblock %}{% block itemcontent %}&&&&{% include "NlcInformationBundle:Information:itemleftmenu.html.twig" %}&&&&{% include "NlcInformationBundle:Information:itemrightlist.html.twig" %}{% endblock %}{% block&&itemadd %}&&&&{% include "NlcInformationBundle:Information:itemadd.html.twig" %}{% endblock %}{% block&&itemupdate %}&&&&{% include "NlcInformationBundle:Information:itemupdate.html.twig" %}{% endblock %}
第三步,在controller中渲染模板并浏览页面
打开 DefaultController.php 添加以下代码
src\Nlc\InformationBundle\Controller\DefaultController.php
* @Route("/login")
* @Template("NlcInformationBundle:Information:login.html.twig")
public function LoginAction()
return array();
* @Route("/admin")
* @Template("NlcInformationBundle:Information:admin.html.twig")
public function AdminAction()
return array();
1234567891011121314151617181920
&& ...&& ...&& /**&&&& * @Route("/login")&&&& * @Template("NlcInformationBundle:Information:login.html.twig")&&&& */&&&&public function LoginAction()&&&&{&&&&&&&&return array();&&&&}&&&&/**&&&& * @Route("/admin")&&&& * @Template("NlcInformationBundle:Information:admin.html.twig")&&&& */&&&&public function AdminAction()&&&&{&&&&&&&&return array();&&&&}&& ...&& ...
因为使用annotation,所以@Route(“”)
指引应用程序的路由,@Template(“”) 来渲染应用程序的模板。
具体控制器的annotation配置和使用可查看
http://symfony.com/doc/current/bundles/SensioFrameworkExtraBundle/index.html
好了,我们打开浏览器,访问 http://nlcinformation.local/login和http://nlcinformation.local/admin
第四步,生成资源文件
虽然http://nlcinformation.local/admin页面可以浏览,但是还是有一些问题,也就是说图片不能显示,我们把图片资源拷贝到目录(src\Nlc\InformationBundle\Resources\public\images\avatar1_small.jpg)
再次浏览还是没有,为什么呢,因为我们的web目录资源下还没有图片资源,那怎么办
我们只需要生成相应的资源即可,要输入下面的命令:
php app/console assets:install web --symlink
php app/console assets:install web --symlink
你的资源会生成到web\bundles\nlcinformation目录下
然后修改img的src代码
将 itemtophead.html.twig 和 itemrightlist.html.twig 中
&img src="images/avatar1_small.jpg" /&
&img src="images/avatar1_small.jpg" /&
&img alt="" src="{{ asset('bundles/nlcinformation/images/avatar1_small.jpg') }}" /&
&img alt="" src="{{ asset('bundles/nlcinformation/images/avatar1_small.jpg') }}" /&
ok再次浏览已经可以看到图片了。}

我要回帖

更多关于 使用symfony框架 的文章

更多推荐

版权声明:文章内容来源于网络,版权归原作者所有,如有侵权请点击这里与我们联系,我们将及时删除。

点击添加站长微信