通过file->new…->web->双击jsp图标,弹出创建jsp向导的对话框,如下图所示:
图 3 通过向导创建login.jsp |
·web module:如果一个工程下有多个web模块,你可以通过这儿指定jsp所要加入到的web模块,因为我们的工程中只有一个webmodule,所以是向导将默认设置为webmodule。
·name :键入jsp文件名,你可以键入.jsp后缀,也可以不写后缀,直接键入login就可以了。
generate sample bean选项勾选后jbuilder将生成一个示例的bean并在jsp中引入这个bean。对于初学者来说,可以通过该选项查看jsp如何引用一个bean,而generate error page选项将自动为jsp创建一个配套的错误处理jsp文件,这里,我们不勾选它们。
直接点击finish创建login.jsp,login.jsp文件出现在内容窗格的编译器中,如下图所示:
图 4 向导创建的jsp文件 |
jsp编译窗口的左右两边都有一个可以通过 和 按钮控制的竖栏,左边栏为放置jsp标签和html标签的面板,可以像可视化ui设计器中一样用拖拽方式往jsp文件中放置各种标签,如上图中,我们从面板中选择表单的html标签放置到login.jsp文件中。
而右边竖栏中是jsp文件中当前光标所在标签的属性编译器,如下图所示:
图 5 设置jsp标签属性编辑器 |
属性编辑器是动态的,光标移到不同的标签上,属性编辑器就显示这个标签所有可设置的属性。如上图中对应的是html 表单标签的属性编辑器,我们将其action属性设置为switch.jsp,指定用post方式发送请求数据。
我们在login.jsp中提供一个用户名下拉框、一个密码输入框以及一个登录提交按钮,其代码如下:
代码清单 4 login.jsp
1. <%@page contenttype=”text/html; charset=gbk” %> 2. <html> 3. <head> 4. <title>login</title> 5. </head> 6. <body bgcolor=”#ffffff”> 7. <表单 name=”表单1″ method=”post” action=”switch.jsp”> 8. 用户名: <select name=”userid”> 9. <option value=”” selected>–登录用户–</option> 10. <option value=”100000″>姜子牙</option> 11. <option value=”100001″>鲍叔牙</option> 12. <option value=”100002″>竖牙</option> 13. </select> 14. 密 码:<input name=”password” type=”password”> 15. <input type=”submit” name=”submit” value=”登录”> 16. </表单> 17. </body> 18. </html> |
表单标签代表网页中的一个表单,表单可以包含多个组件,这些组件的数据在网页表单提交后,以http协议发送给action属性所指定的jsp文件处理。表单的数据一般以post发送,post发送方式对数据量的大小没有限制,且保密性更强。
login.jsp的效果页面如下图所示:
图 6 login.jsp录入页面 |
实战经验:
jsp文件代码包含静态和动态两部分,即一部分是html代码,而另一部分为jsp标签和scriptlet代码。jsp一般是动态逻辑的网页,jbuilder对jsp标签及scriptlet这些动态代码部分支持得非常好,你可以使用codeinsight和taginsight等工具快速而正确地完成编码,同时还可以对jsp进行编译调试。在jsp静态html代码编写及可视化设计方面,jbuilder却显得力不从心,dreamweaver在静态代码和可视化设计方面明显优于jbuilder。 |
事情的复杂促进了分工,分工的精细促进了专业的发展,在编写jsp时,并不是一旦拥有jbuilder就别无所求了。韩信善兵、萧何善谋,如果能够将dreamweaver和jbuilder结合起来,用dreamweaver开发jsp的可视化部分,用jbuilder开发jsp的动态代码部分,两者互补有无,相得益彰,jsp开发工作将变得更加行云流水。