作业部分代码

1. table id="dataList" class="table table-bordered table-striped table-hover dataTable">
     <thead>
         <tr>
             <th class="" style="padding-right:0px">
                 <input id="selall" type="checkbox" class="icheckbox_square-blue">
             </th> 
             <th class="sorting_asc">规格ID</th>
             <th class="sorting">规格名称</th>                                                                                     
             <th class="text-center">操作</th>
         </tr>
     </thead>
     <tbody>
         <tr ng-repeat="entity in list">
             <td><input type="checkbox" ng-click="updateSelection($event, entity.id)"></td>
             <td>{{ entity.id }}</td>
             <td>{{ entity.specName }}</td>
             <td class="text-center">                                           
                 <button type="button" class="btn bg-olive btn-xs" data-toggle="modal" data-target="#editModal">修改</button>                                           
             </td>
         </tr>
     </tbody>
   </table>
   <!--数据列表/-->
   
   <!-- 分页 -->
   <tm-pagination conf="paginationConf"></tm-pagination>

新增规格

新增行的实现

1. 修改specificationController.js新增以下代码

   // 增加规格选项行
   $scope.addTableRow=function(){
       $scope.entity.specificationOptionList.push({});            
   }

   • 1
   • 2
   • 3
   • 4

2. 修改specification.html的“新建选项”按钮和加载表格编辑框列表

   <!-- 规格选项 -->
   <div class="btn-group">
       <button type="button" class="btn btn-default" title="新建" ng-click="addTableRow()"><i class="fa fa-file-o"></i> 新增规格选项
       </button>
   
   </div>
   
   <table class="table table-bordered table-striped table-hover dataTable">
       <thead>
       <tr>
           <th class="sorting">规格选项</th>
           <th class="sorting">排序</th>
           <th class="sorting">操作</th>
       </thead>
       <tbody>
       <tr ng-repeat="pojo in entity.specificationOptionList">
           <td>
               <input ng-model="pojo.optionName" class="form-control" placeholder="规格选项">
           </td>
           <td>
               <input ng-model="pojo.orders" class="form-control" placeholder="排序">
           </td>
           <td>
               <button type="button" class="btn btn-default" title="删除"><i class="fa fa-trash-o"></i> 删除
               </button>
           </td>
       </tr>
       </tbody>
   </table>

3. 修改“新建”按钮，弹出窗口时对entity进行初始化，否则添加规格选项会报错

   <button type="button" class="btn btn-default" title="新建" data-toggle="modal" data-target="#editModal" ng-click="entity={'specificationOptionList':[]}"><i class="fa fa-file-o"></i> 新建 </button>

   • 1

删除行的实现

1. 修改specificationController.js新增以下代码

   //删除规格选项行
   $scope.deleTableRow=function(index){
       $scope.entity.specificationOptionList.splice(index,1);
   }

   • 1
   • 2
   • 3
   • 4

2. 修改每行的删除按钮，使用$index 用于获取ng-repeat指令循环中的索引

   <button type="button" class="btn btn-default" title="删除" ng-click="deleTableRow($index)"><i class="fa fa-trash-o"></i> 删除 </button>

   • 1

提交保存

1. 思路: 将规格和规格选项数据合并成一个对象来传递，需要用一个对象将两个对象组合起来。在业务逻辑中，得到组合对象中的规格和规格选项列表，插入规格返回规格ID，然后循环插入规格选项。

2. 增加规格选项，必须知道新增规格的ID，需要修改pinyougou-dao的TbSpecificationMapper.xml，在insert节点后添加

   <insert id="insert" parameterType="com.huangwangxin.pojo.TbSpecification" >
       <selectKey resultType="java.lang.Long" order="AFTER" keyProperty="id">
           SELECT LAST_INSERT_ID() AS id
       </selectKey>
       insert into tb_specification (id, spec_name)
       values (#{id,jdbcType=BIGINT}, #{specName,jdbcType=VARCHAR})
   </insert>

3. 在pinyougou-pojo新增group包，创建Specificatio类

   package com.huangwangxin.group;
   
   import com.huangwangxin.pojo.TbSpecification;
   import com.huangwangxin.pojo.TbSpecificationOption;
   
   import java.io.Serializable;
   import java.util.List;
   
   
   /**
    * 规格组合实体类
    * @author Administrator
    *
    */
   public class Specification implements Serializable{
   
       private TbSpecification specification;
   
       private List<TbSpecificationOption> specificationOptionList;
   
       public TbSpecification getSpecification() {
           return specification;
       }
   
       public void setSpecification(TbSpecification specification) {
           this.specification = specification;
       }
   
       public List<TbSpecificationOption> getSpecificationOptionList() {
           return specificationOptionList;
       }
   
       public void setSpecificationOptionList(List<TbSpecificationOption> specificationOptionList) {
           this.specificationOptionList = specificationOptionList;
       }
   
   }