暑假学习20（8.6 周四）

             今天的学习的工程是实现地址的添加，删除，修改以及设置默认地址，但是在实现的过程中还是遇到了不少问题。由于我们要实现在一个页面上的添加与修改，而添加和修改的都是通过保存按钮来提交的，提交的表单都是receiveForm，同时使用的是一个保存按钮，而添加和修改的区别主要是addressId是否有值，因为修改的数据地址Id都是原本存在的，另外就是注意：对于一个数据类，如果没有给其赋值，它的默认是“”，而不是null，在更新操作中，若没有赋值的话更新结果会是null，但是在出现null是不能通过equals函数来判断是否为空的，这样在比较时就会出现程序崩溃的现象。另外，在注册或者修改的操作结束后，我们要记得将对应的数据类设置为我们需要的值，为我们接下来要执行的操作准备，如果没有很容易出现的现象就是：本想让执行添加的内容执行了修改的controller。（修改初始化页面时，我们始终要保证addressId有值且不空，在修改成功之后要注意把之前的addressId的值修改回添加时的页面数据值，因为在修改时存在一个修改页面初始化，而添加操作没有页面的初始化，我们在进入地址管理时就可以执行添加操作。）

           在管理地址的过程中，要注意用户Id值是否有，没有的话，我们的地址管理就没有依据，因为地址始终要建立在用户的基础上。同时，在实现删除操作时要注意实现的操作是分情况的，在默认地址的情况下，我们除了删除地址表中的对应addressId的数据还要针对用户表中的address值（也就是我们默认的地址Id）进行更新操作，当然此时更新的结果是该值被“”替代。在页面上，我们需要两个隐藏来将对应的addressId值保存传回到后台，这样方便我们判断执行的操作是添加还是修改。另外，在设置默认地址时，用一个判断，来决定是否显示设置默认地址。这需要我们后台传入两个一个地址Id的list和默认的地址Id进行比较。

          在使用checkBox时，因为之前自己猜测的是布尔型的数据类型导致对应的值一直不能传到后台。原因是checkBox复选框的传值并非是布尔型的，而是一个“on”或者”null“的值，所以我们在设置接收值的属性应为字符串，即Striing。在不知道传值的类型是我们大多是使用的String（它对于大多数的数据值都可以正常接收到）。

        设置边框的下边线的style：

       .columnT{ border-bottom:solid 1px;}   //下底边实线1个像素

      设置边框背景颜色和显示背景的位置：

       .columnT-1 i{ background-position: 0 -40px; color: #fac132}

     在设置样式时，我们也可以动态的使用不同的样式表，例如：<div th:class="${typeInfo.css}" >，这里的class的值是通过后台来传递过来的，而这个值是后台一个数据类的属性，可以根据需要在后台动态的设置。这样，我们在循环的过程中除了数据在变化外也可以控制每一项的显示格式的变化，当然这些对应的class值都要在对应的样式表中被定义了才能使用。其具体的写法如下：

<div class="container main" th:each="typeInfo,sts:${commodityType}">

<div th:class="${typeInfo.css}" >

<i class="yh"><span th:text="${typeInfo.count}">1F</span></i><span class="h4 yh" th:text="${typeInfo.commodityTypeName}">粮食</span>

<a th:href="@{initGoods(commodityTypeId=${typeInfo.commodityTypeId})}">更多商品>></a>

</div>

<ul class="goodsList cf">

<li class="col-md-2 col-sm-4 col-xs-6" th:each="goodsInfo,status:${typeInfo.list}" >

<div class="cont">

<a th:href="@{initGoodsDetail(commodityId=${goodsInfo.commodityId})}"><img th:src="@{showImage(pictureId=${goodsInfo.pictureId})}" alt="" style="height:168px;width:168px;" /></a>

<h4 class="h5"><a href="#"><p class="title" th:text="${goodsInfo.commodityName}">品美知糖道阿胶姜汤260g</p></a></h4>

<p class="num">库存:<span th:text="${goodsInfo.stock}">15</span>

每<span th:text="${#strings.concat(goodsInfo.unit).concat(goodsInfo.specifications)}">袋15kg</span>

</p>

<p class="cf">

<span class="price yh">￥<span th:text="${goodsInfo.retailPrice}">15</span>元</span>

<a th:href="@{addCart}" class="btnBuy" title="加入购物车"></a>

</p>

</div>

</li>

</ul>

</div>

           全选复选框功能的实现：

function checkAll(obj) {

var el = document.getElementsByTagName('input');          //找到所有的inpit框

var len = el.length;

for (var key in el) {

if (el[key].type == 'checkbox') {                       //判断input框的类型是复选框

if(obj.checked == true) {

el[key].checked = true;

} else {

el[key].checked = false;

}}}}

          使用循环动态定义每一项的name属性：th:name标签的使用

<td class="chk">

<input type="hidden" th:name="${#strings.concat('listBean[').concat(status.index).concat('].commodityId')}" th:value="${cartsInfo.commodityId}"/>

<input type="checkbox" th:name="${#strings.concat('listBean[').concat(status.index).concat('].checkArray')}" /></td>

          动态的id（这里使用动态Id是为了可以改变对应的商品的购买数目）用th:id来设置，链接的onclick实现动态点击事件：th:onclick（动态只是因为其中的参数在随着循环在变化）：

<a href="javascript:void(0);"   th:οnclick="${#strings.concat('subNum(').concat(cartsInfo.commodityId).concat(')')}"></a>

<input th:id="${cartsInfo.commodityId}" type="text" class="fl inp-t" th:name="${#strings.concat('listBean[').concat(status.index).concat('].countArray')}" th:value="${cartsInfo.count}" value="1" />

<a href="javascript:void(0);" th:οnclick="${#strings.concat('addNum(').concat(cartsInfo.commodityId).concat(')')}"></a>

       下边的代码是对应的改变商品数目的javascript代码：

function addNum(inputId) {

document.getElementById(inputId).value = parseInt(document.getElementById(inputId).value) + 1;

}

function subNum(inputId) {

if (document.getElementById(inputId).value == "1") {

return;

}

document.getElementById(inputId).value = parseInt(document.getElementById(inputId).value) - 1;

}

       在执行一个controller中，如果突然判断需要执行另一个controller的方法是：return "redirect:/"+对应的controller的地址。例如：

return "redirect:/initGuestLogin";

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