暑假学习6(7.17周五)

               今天的项目实现的功能就是实现四个页面。一,登陆页面,这个页面有两个输入文本框输入用户ID与用户密码,两个按钮实现页面的登陆提交进行逻辑业务判断并在登陆失败时在页面首部出现提示用户名和密码错误,让用户重新输入并登陆,在这个页面需要注意的是这里有两个按钮,我们需要让它们分别去执行两个不同的方法。 

<body>
<span th:text="${message}"></span><br/>
<form action="init" th:object="${userBean}" method="post">
<input name="userId" type="text" />
<input name="passWord" type="password"/>
<button type="submit" name="login">登陆</button>
</form><br/>
<form action="init4" method="post">
<button type="submit">注册</button>
</form>
</body>

              在上面这段代码中,我们是通过两个<form>来分别执行不同的后台代码。在登陆按钮点击之后我们执行了controller的init这个路径下的方法,也就是核对用户名是否正确的并根据结果,在正确的时候显示第二个页面,即查询数据库中表的所有数据并返回到页面上。在这个过程中需要注意的,我们的第一个表单有传值到后台,所以在<form>中有th:object="${UserBean}"这个属性,它表示要传入一个值,但是具体的传值内容是<input>文本框中的值,这个文本框在传值中一定要加有name属性值,如果没有的话,它就无法传值给后台程序。对于<input >的一个文本框,我们可以将其type属性值设置为hidden,这样在相应的页面上我们虽然看不到,但是在一些页面上我们要让其被绑定使我们可以实现对应属性值的传递,这里设置需要注意th:value而不是th:text,这两个属性值,在input文本框中绑定数据是th:value,在需要直接显示数据值时是th:text,即

     <input name="userId"  type="hidden" th:value="${userBean.userId}"/>

            但是上边的两个按钮的两个form的方法并不好,在业务的修改时比较麻烦,而且前台代码中会过于繁琐,所以我们可以通过按钮的name属性的不同来执行不同的方法,也就是说在controller中可以有一个多个相同路径的执行代码块,但是我们需要区分,这就需要在之前的controller路径中添加一个params属性,这是一个字符串数组,可以用来存放多个字符串,这些字符串的作用就是来判断不同方法的执行,如:@RequestMapping(value = "/init", method = RequestMethod.POST, params="login"),在这个@RequestMapping中,我们可以看到这个代码执行的时候需要对应的name=login按钮点击执行的。在登陆中,我们通过判断通过前台提供的用户名和密码是否有返回值,判断这个用户输入是否正确,在不正确的时候,我们通过model的addAttribute方法来提示出错了。在查询的时候,如果要看一个List是否为空,不能用List的变量名与null比较,而是通过size()这个方法来判断。

            在第一个页面的注册按钮点击之后,我们跳到register.html中,在这个页面我们可以通过插入操作对数据库进行插入数据。在这个页面需要注意的是,密码与确认密码的输入正确判断,在这个判断中,我们输入的字符串,不能直接通过等号判断,而是通过equal方法来判断是否相等。等号的判断在数字型的时候可以,在其他类型的数据判断时,它比较的我们两个变量的id,而不是对应字符值。在一般的注册时,用户名不可以相同,我们可以在注册按钮点击后,让它先执行一个判断,判断通过用户提交的用户名是否在数据库中可以检索到,检索到的话返回用户名已被注册,提示重新注册,否则执行插入操作,进入登录界面,即第一个界面。在这个注册界面,我们有返回按钮,这个按钮实现的功能是跳到页面的首页,写法如下:

<form th:action="@{/}" action="#" method="get">
 <button type="submit">后退</button>
 </form>

             这个与一般的返回是不一样的,是通过th:action="@{/}" ,对于th:的属性值都是一个动态页面属性的标识,在静态页面下是不会显示的。

            在登陆成功之后,我们显示的第三个界面是通过一个表格的形式显示数据库中相应的数据,这需要一个th:each的循环属性值,th:each="goodInfo,status=${list}",不同于Jsp中的jstl标签,<c:forEach>标签,<c:forEach items="${list}" var="goodInfo" varStatus="status">。另外,在这个页面中,我们使用的链接是th:href属性值设置的,th:href="@{init5?(userId=${goodInfo.userId})}",具体使用如下

<td ><a th:href="@{init5?(userId=${goodInfo.userId})}"><span th:text="${goodInfo.userId}">12</span></a></td>

             在点击链接之后,我们跳到一个确认删除界面,提示是否确认删除,确认就返回删除数据之后的第三个界面,即呈现出所有剩余用户信息,主要的问题及时传值,要把链接传过来的值userId传回去给后台,我们通过了一个input隐藏,将其对应的name和th:value属性设置,通过后台获得对应的UserBean,然后用于删除,注意name属性时后台识别的标志,不要写错,导致数据无法正确传入。

             

转载于:https://my.oschina.net/u/2411765/blog/479955

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值