2012年9月4日 星期二

jquery jsp y mysql 實作

相關設定
   mysql ---使用wamp
   tomcat---下載安裝
   java--j2se jdk
   jquery.js放網頁資料夾
  mysql-connector-java-3.0.17-ga-bin.jar
  mysql-connector-java-3.1.10-bin-g.jar
   以上兩jar檔放入C:\Program Files\Apache Software Foundation\Tomcat 5.5\common\lib

//C:\Program Files\Apache Software Foundation\Tomcat 5.5\webapps\ROOT\WEB-INF
用javabean smart--把WEB-INF copy到網頁資料夾，新增classes資料夾放入com-jspsmart-upload-File.class+Files.class+Request.class+SmartUpload.class+SmartUploadException.class
//

資料連結設定檔querydata.jsp code 如下

<%@ page contentType="text/html; charset=utf-8" language="java" import="java.sql.*" errorPage="" %>
<%@page import="java.util.*"%>
<%!
 public String[][] querydatafun(String databasename,String strsql)
 {
  ResultSet rs=null;
  String[][] resultdata=null;

  try
  {
    Class.forName("org.gjt.mm.mysql.Driver");
  }
  catch(Exception e)
  {
   //out.print("資料庫驅動程式失敗");
  }

  try
  {
 Connection myconn=DriverManager.getConnection("jdbc:mysql://localhost/"+databasename+"?useUnicode=true&characterEncoding=utf-8","root","");
   
 Statement mysmt=myconn.createStatement();
 rs=mysmt.executeQuery(strsql);
 int fieldcount=rs.getMetaData().getColumnCount();
 //out.print("總欄位數:"+fieldcount+"<p>");
 for(int i=0;i<fieldcount;i++)
 {
   //out.print(rs.getMetaData().getColumnName(i+1)+"<p>");
 }
 rs.first();
 rs.last();
 int rowcount=rs.getRow();
 //out.print("總記錄數:"+rowcount+"<p>");

 if(rowcount==0)
 {
resultdata=new String[0][0];
 }
 else
 {
   resultdata=new String[rowcount][fieldcount];
   rs.beforeFirst();

   int j=0;
   while(rs.next())
   {
 for(int i=0;i<fieldcount;i++)
 {
resultdata[j][i]=rs.getString(i+1);
 }
 j++;
   }
   rs.close();
        myconn.close();
 }
  }
  catch(SQLException er)
  {
     //out.print("資料庫管理系統無法啟動");
  }

  return resultdata;
 }
%>
資料送入檔jtestdata.jsp code 如下


<%@ page contentType="text/html; charset=utf-8" language="java" import="java.sql.*" errorPage="" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@include file="jtestdata.jsp"%>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文件</title>
</head>
<script type="text/javascript"  src="./jquery.js"></script>
<script language="javascript" type="text/javascript" >
$(document).ready(function()
{
 var htmlstr2= 
 var table=document.getElementById("tb1");
 $("table img").mousedown(function()
 {
  
  var item_no=$(this).attr('id');//編號
  var altstr=$(this).attr('alt');
  var n=altstr.indexOf(",");
  var storena=altstr.substring(0,n);//商家名
  var itemstr=$(this).attr('title');
  n=itemstr.indexOf(":");
   var item_na=itemstr.substring(0,n);//商品名
  var price=itemstr.substring(n+1,n+3);//單價
  
  var htmlstr1='<table width="300" border="2"><tr><td width="180" >編號：'+item_no+'</td><td width="120" >商家：'+storena+'</td></tr><tr><td>商品：'+item_na+'</td><td>單價：'+price+'</td></tr><tr><td>數量：<input type="text" id="qty" size="8"/></td><td ><input type="button" id="bt1" value="確定" /></td></tr></table>';
    $('#div1').html(htmlstr1);
               

  
  
 });
 
});
</script>
<body>
 <table id="tb1" width="100%" height="100%" border="1" align="center" cellspacing="1" >
<% for(int i=0;i<4;i++){ %>
    <tr><% for(int j=1;j<6;j++){
  int s=j+i*5; String mtr=Menu_item[s];
  //out.print(mtr);
  //out.print(s);
  String k=store_no+"_"+s;%> 
    <td width="140" height="120" align="center" >
    <a href="javascript:;">
    <img id="<%=k%>" src="./pic/<%=k%>.jpg" width="100" height="60" title="<%=mtr%>元" border="1" alt="<%=store_na+","+k%>"/>
    </a></td> <% } %>
 </tr> <% } %> 
 </table> 
 <div id="div1">
 </div>
 <div id="div2">
 <table id=""
 </div>
</body>
</html>


以上只做到按產品圖跑出table以便輸入定購數量
//http://www.9lessons.info/2008/09/jsp-login-page-to-connect-mysql-atabase.html
//http://ithelp.ithome.com.tw/question/10033993
張貼者： 於

沒有留言:

張貼留言

訂閱： 張貼留言 (Atom)