程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> JAVA編程 >> 關於JAVA >> SSH框架網上商城項目第12戰之添加和更新商品功效

SSH框架網上商城項目第12戰之添加和更新商品功效

編輯:關於JAVA

SSH框架網上商城項目第12戰之添加和更新商品功效。本站提示廣大學習愛好者:(SSH框架網上商城項目第12戰之添加和更新商品功效)文章只能為提供參考,不一定能成為您想要的結果。以下是SSH框架網上商城項目第12戰之添加和更新商品功效正文


添加商品部門道理和添加商品種別是一樣的,參考文章:添加和更新商品種別,不外要比商品種別龐雜,由於商品的屬性有許多,對應的數據庫中的字段也就多了,添加商品還有個選項是上傳圖片,這一小塊內容會鄙人一篇文章中零丁解釋,由於這觸及到一個常識點,就是Struts2完成文件上傳功效。其他空話不多說了,如今開端完美添加商品部門的代碼:
1. 添加商品
1.1 添加商品的UI完成
起首完成query.jsp中添加商品部門的代碼:

接上去我們看save.jsp中的詳細完成:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
 <head> 
 <%@ include file="/public/head.jspf" %> 
 <style type="text/css"> 
 form div { 
  margin:10px; 
 } 
 </style> 
 <script type="text/javascript"> 
 $(function(){ 
  //自界說驗證辦法向validatebox.defaults.rules中注冊新函數 
  $.extend($.fn.validatebox.defaults.rules,{ 
  //函數的稱號:{函數的完成體(又是一個json對象,外面包含函數的完成,和毛病新聞的設置)} 
  format:{ 
   //函數完成,假如前往為false,則驗證掉敗 
   validator: function(value,param){ 
   //獲得以後文件的後綴名 
   var ext = value.substring(value.lastIndexOf('.') + 1); 
   //獲得支撐的文件後綴名,然後比擬便可 
   var arr = param[0].split(","); 
   for(var i = 0; i < arr.length; i++) { 
    if(ext == arr[i]) 
    return true; 
   } 
   return false; 
   }, 
   //毛病新聞 
   message: '文件後綴必需為:{0}' 
  } 
  }); 
  
  //對商品種別的下拉列表框停止長途加載 
  $("#cc").combobox({ 
  //將要求發送給categoryAction中的query辦法處置,這裡須要將處置好的數據前往到這邊來顯示了 ,所今後台須要將數據打包成json格局發過去 
  url:'category_query.action', 
  valueField:'id', 
  textField:'type', //我們下拉列表中顯示的是一切的商品種別 
  panelHeight:'auto', //自順應高度 
  panelWidth:120,//下拉列表是兩個組件構成的 
  width:120, //要同時設置兩個寬度才行 
  editable:false, //下拉框不許可編纂 
  //combobox繼續combo繼續validatebox,所以可以直接在這裡設置驗證 
  required:true, 
  missingMessage:'請選擇所屬種別' 
  }); 
   
  $("input[name=name]").validatebox({ 
  required:true, 
  missingMessage:'請輸出商品稱號' 
  }); 
 
  $("input[name=price]").numberbox({ 
  required:true, 
  missingMessage:'請輸出商品價錢', 
  min:0, 
  precision:2, //保存兩位小數 
  prefix:'$' 
  }); 
  $("input[name='fileImage.upload']").validatebox({ 
  required:true, 
  missingMessage:'請上傳商品圖片', 
  //設置自界說辦法 
  validType:"format['gif,jpg,jpeg,png']"//中括號外面是參數 
  }); 
 
  $("textarea[name=remark]").validatebox({ 
  required:true, 
  missingMessage:'請輸出商品的簡略描寫' 
  }); 
  
  $("textarea[name=xremark]").validatebox({ 
  required:true, 
  missingMessage:'請輸出商品的簡略描寫' 
  }); 
  
  //窗體彈出默許時禁用驗證 
  $("#ff").form("disableValidation"); 
  
  //注冊button的事宜 
  $("#submit").click(function(){ 
  //開啟驗證 
  $("#ff").form("enableValidation"); 
  //假如驗證勝利,則提交數據 
  if($("#ff").form("validate")) { 
   //挪用submit辦法提交數據 
   $("#ff").form('submit', { 
   url: 'product_save.action', 
   success: function(){ 
    //假如勝利了,封閉以後窗口 
    parent.$("#win").window("close"); 
    parent.$("iframe[title='商品治理']").get(0).contentWindow.$("#dg").datagrid("reload"); 
   } 
   }); 
  } 
  }); 
  
  //注冊button的事宜 
  $("#reset").click(function(){ 
  $("#ff").form("disableValidation");//重置不須要表單驗證 
  //重置以後表雙數據 
  $("#ff").form("reset"); 
  }); 
 }); 
 </script> 
 </head> 
 
 <body> 
 <form title="添加商品" id="ff" method="post" enctype="multipart/form-data"> 
 <div> 
  <label>商品稱號:</label> <input type="text" name="name" /> 
 </div> 
 
 <div> 
  <label>商品價錢:</label> <input type="text" name="price" /> 
 </div> 
 <div> 
  <label>圖片上傳:</label> <input type="file" name="fileImage.upload" /> 
 </div> 
 
 <div> 
  <label>所屬種別:</label> 
  <input id="cc" name="category.id"/> 
 </div> 
  
 <div> 
  <label>參加推舉:</label> 推舉:<input type="radio" name="commend" 
  checked="checked" value="true" /> 不推舉:<input type="radio" 
  name="commend" value="false" /> 
 </div> 
 <div> 
  <label>能否有用:</label> 
  上架:<input type="radio" name="open" checked="checked"value="true" /> 
  下架:<input type="radio" name="open" value="false" /> 
   
 </div> 
  
 <div> 
  <label>簡略描寫:</label> 
  <textarea name="remark" cols="40" rows="4"></textarea> 
 </div> 
 <div> 
  <label>具體描寫:</label> 
  <textarea name="xremark" cols="40" rows="8"></textarea> 
 </div> 
 <div> 
  <a id="submit" href="#" class="easyui-linkbutton">添 加</a> 
  <a id="reset" href="#" class="easyui-linkbutton">重 置</a> 
 </div> 
 </form> 
 </body> 
</html> 

        我們重要來看一下下面js代碼中中自界說辦法部門,重要是界說對上傳的圖片的驗證,詳細剖析以下:

然後在圖片驗證這塊便可以應用自界說的辦法了:

1.2 添加商品的後台完成

@Controller("productAction") 
@Scope("prototype") 
public class ProductAction extends BaseAction<Product> { 
 
 //省略其他代碼…… 
 
 public void save() throws Exception { 
 //處置上傳的圖片,下一篇博客專門剖析struts2文件上傳 
  
 model.setDate(new Date()); //設置一下以後時光,由於前台沒有把時光字段傳出去,這裡本身設置一下便可 
 System.out.println(model); 
 //商品信息入庫 
 productService.save(model); 
 } 
} 

2. 更新商品
2.1 更新商品的UI完成
起首看下query.jsp中更新商品部門的代碼:

接上去看看update.jsp的內容:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
 <head> 
 <%@ include file="/public/head.jspf" %> 
 <style type="text/css"> 
 form div { 
  margin:5px; 
 } 
 </style> 
 <script type="text/javascript"> 
 $(function(){ 
  //iframe中的datagrid對象 
  var dg = parent.$("iframe[title='商品治理']").get(0).contentWindow.$("#dg"); 
  
  //對商品類的下拉列表框停止長途加載 
  $("#cc").combobox({ 
  //將要求發送給categoryAction中的query辦法處置,這裡須要將處置好的數據前往到這邊來顯示了 ,所今後台須要將數據打包成json格局發過去 
  url:'category_query.action', 
  valueField:'id', 
  textField:'type', //我們下拉列表中顯示的是商品的種別名 
  panelHeight:'auto', //自順應高度 
  panelWidth:120,//下拉列表是兩個組件構成的 
  width:120, //要同時設置兩個寬度才行 
  editable:false, //下拉框不許可編纂 
  //combobox繼續combo繼續validatebox,所以可以直接在這裡設置驗證 
  required:true, 
  missingMessage:'請選擇所屬種別' 
  }); 
  
  // 完成數據的回顯,更新時,用戶確定先選擇了要更新的那一行,起首我們得拿到那一行 
  var rows = dg.datagrid("getSelections"); 
  //將拿到的那一行對應的數據字段加載到表單裡,完成回顯 
  $("#ff").form('load',{ 
  id:rows[0].id, 
  name:rows[0].name, 
  price:rows[0].price, 
  remark:rows[0].remark, 
  xremark:rows[0].xremark, 
  commend:rows[0].commend, 
  open:rows[0].open, 
  'category.id':rows[0].category.id //EasyUI不支撐account.id這類點操作,所以要加個引號 
  }); 
 
  //回顯完了數據後,設置一下驗證功效 
  $("input[name=name]").validatebox({ 
  required:true, 
  missingMessage:'請輸出種別稱號' 
  }); 
  $("input[name=price]").numberbox({ 
  required:true, 
  missingMessage:'請輸出商品價錢', 
  min:0, 
  precision:2, //保存兩位小數 
  prefix:'$' 
  }); 
  $("input[name='fileImage.upload']").validatebox({ 
  required:true, 
  missingMessage:'請上傳商品圖片', 
  //設置自界說辦法 
  validType:"format['gif,jpg,jpeg,png']"//中括號外面是參數 
  }); 
 
  $("textarea[name=remark]").validatebox({ 
  required:true, 
  missingMessage:'請輸出商品的簡略描寫' 
  }); 
  
  $("textarea[name=xremark]").validatebox({ 
  required:true, 
  missingMessage:'請輸出商品的簡略描寫' 
  }); 
  //窗體彈出默許時禁用驗證 
  $("#ff").form("disableValidation"); 
  //注冊button的事宜 
  $("#btn").click(function(){ 
  //開啟驗證 
  $("#ff").form("enableValidation"); 
  //假如驗證勝利,則提交數據 
  if($("#ff").form("validate")) { 
   //挪用submit辦法提交數據 
   $("#ff").form('submit', { 
   url: 'product_update.action', //提交時將要求傳給productAction的update辦法履行 
   success: function(){ 
    //假如勝利了,封閉以後窗口,並刷新頁面 
    parent.$("#win").window("close"); 
    dg.datagrid("reload"); 
   } 
   }); 
  } 
  }); 
 }); 
 </script> 
 </head> 
 
 <body> 
 <form title="更新商品" id="ff" method="post" enctype="multipart/form-data"> 
 <div> 
  <label for="name">商品稱號:</label> <input type="text" name="name" /> 
 </div> 
 <div> 
  <label for="price">商品價錢:</label> <input type="text" name="price" /> 
 </div> 
 <div> 
  <label>更新圖片:</label> <input type="file" name="fileImage.upload" /> 
 </div> 
 <div> 
  <label for="account">所屬商品類:</label> 
  <!-- 長途加載治理員數據 --> 
  <input id="cc" name="category.id" /> 
 </div> 
 <div> 
  <label for="remark">簡略描寫:</label> 
  <textarea name="remark" cols="40" rows="4"></textarea> 
 </div> 
 <div> 
  <label for="xremark">具體描寫:</label> 
  <textarea name="xremark" cols="40" rows="8"></textarea> 
 </div> 
 <div> 
  <label for="commend">推舉商品:</label> 
  是:<input type="radio" name="commend" value="true" /> 
  否:<input type="radio" name="commend" value="false" /> 
 </div> 
 <div> 
  <label for="open">有用商品:</label> 
  上架:<input type="radio" name="open" value="true" /> 
  下架:<input type="radio" name="open" value="false" /> 
   
 </div> 
  
 <div> 
  <a id="btn" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-edit'">更新</a> 
  <input type="hidden" name="id" /> 
 </div> ` 
 </form> 
 </body> 
</html> 

 更新部門與商品種別的更新根本雷同,不再贅述,上面是後台更新部門的完成:
2.2  更新商品的後台完成

@Controller("productAction") 
@Scope("prototype") 
public class ProductAction extends BaseAction<Product> { 
 
 //省略其他代碼…… 
 
 public void update() throws Exception { 
 //處置上傳的圖片,下一篇博客專門剖析struts2文件上傳 
  
 model.setDate(new Date()); //設置一下以後時光,由於前台沒有把時光字段傳出去,這裡本身設置一下便可 
 System.out.println(model); 
 //更新商品 
 productService.update(model); 
 } 
} 

        跟更新商品種別比擬,獨一多了個圖片上傳的操作,要在後台處置上傳的圖片,我們鄙人一篇文章具體剖析struts2的文件上傳功效。

以上就是本文的全體內容,願望對年夜家的進修有所贊助,也願望年夜家多多支撐。

  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved