案例36-商品添加页面类别ajax显示

Posted jepson6669

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了案例36-商品添加页面类别ajax显示相关的知识，希望对你有一定的参考价值。

1 add.jsp代码

<%@ page language="java" pageEncoding="UTF-8"%>
<html>
    <HEAD>
        <meta http-equiv="Content-Language" content="zh-cn">
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <LINK href="${pageContext.request.contextPath}/css/Style1.css" type="text/css" rel="stylesheet">
        <script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-1.11.3.min.js"></script>
        <script type="text/javascript">
            $(function(){
                //页面加载完毕后异步获得分类数据
                $.post(
                    "${pageContext.request.contextPath }/admin?method=findAllCategory",
                    function(data){
                        //[{"cid":"xxx","cname":"xxx"},{},{}]
                        //拼接多个<option value=""></option>
                        var content="";
                        for(var i=0;i<data.length;i++){
                            content += "<option value=‘"+data[i].cid+"‘>"+data[i].cname+"</option>";
                        }
                        $("#cid").html(content);
                    },
                    "json"
                );
            });
        </script>
    </HEAD>
    
    <body>
        <!--  -->
        <form id="userAction_save_do" name="Form1" action="${pageContext.request.contextPath}/adminProduct_save.action" method="post" enctype="multipart/form-data">
            &nbsp;
            <table cellSpacing="1" cellPadding="5" width="100%" align="center" bgColor="#eeeeee" style="border: 1px solid #8ba7e3" border="0">
                <tr>
                    <td class="ta_01" align="center" bgColor="#afd1f3" colSpan="4"
                        height="26">
                        <strong><STRONG>添加商品</STRONG>
                        </strong>
                    </td>
                </tr>

                <tr>
                    <td width="18%" align="center" bgColor="#f5fafe" class="ta_01">
                        商品名称：
                    </td>
                    <td class="ta_01" bgColor="#ffffff">
                        <input type="text" name="pname" value="" id="userAction_save_do_logonName" class="bg"/>
                    </td>
                    <td width="18%" align="center" bgColor="#f5fafe" class="ta_01">
                        是否热门：
                    </td>
                    <td class="ta_01" bgColor="#ffffff">
                        <select name="is_hot">
                            <option value="1">是</option>
                            <option value="0">否</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td width="18%" align="center" bgColor="#f5fafe" class="ta_01">
                        市场价格：
                    </td>
                    <td class="ta_01" bgColor="#ffffff">
                        <input type="text" name="market_price" value="" id="userAction_save_do_logonName" class="bg"/>
                    </td>
                    <td width="18%" align="center" bgColor="#f5fafe" class="ta_01">
                        商城价格：
                    </td>
                    <td class="ta_01" bgColor="#ffffff">
                        <input type="text" name="shop_price" value="" id="userAction_save_do_logonName" class="bg"/>
                    </td>
                </tr>
                <tr>
                    <td width="18%" align="center" bgColor="#f5fafe" class="ta_01">
                        商品图片：
                    </td>
                    <td class="ta_01" bgColor="#ffffff" colspan="3">
                        <input type="file" name="upload" />
                    </td>
                </tr>
                <tr>
                    <td width="18%" align="center" bgColor="#f5fafe" class="ta_01">
                        所属分类：
                    </td>
                    <td class="ta_01" bgColor="#ffffff" colspan="3">
                        <select id="cid" name="cid">
                            
                        </select>
                    </td>
                </tr>
                <tr>
                    <td width="18%" align="center" bgColor="#f5fafe" class="ta_01">
                        商品描述：
                    </td>
                    <td class="ta_01" bgColor="#ffffff" colspan="3">
                        <textarea name="pdesc" rows="5" cols="30"></textarea>
                    </td>
                </tr>
                <tr>
                    <td class="ta_01" style="WIDTH: 100%" align="center"
                        bgColor="#f5fafe" colSpan="4">
                        <button type="submit" id="userAction_save_do_submit" value="确定" class="button_ok">
                            &#30830;&#23450;
                        </button>

                        <FONT face="宋体">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</FONT>
                        <button type="reset" value="重置" class="button_cancel">&#37325;&#32622;</button>

                        <FONT face="宋体">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</FONT>
                        <INPUT class="button_ok" type="button" onclick="history.go(-1)" value="返回"/>
                        <span id="Label1"></span>
                    </td>
                </tr>
            </table>
        </form>
    </body>
</HTML>

2 AdminServlet代码

package www.test.web.servlet;

import java.io.IOException;
import java.util.List;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.google.gson.Gson;

import www.test.domain.Category;
import www.test.service.AdminService;

public class AdminServlet extends BaseServlet {

    // 1 页面加载完毕后异步获得分类数据
    public void findAllCategory(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        //提供一个List<Category>转成json字符串
        AdminService service = new AdminService();
        List<Category> categoryList = service.findAllCategory();
        
        //将List<Category>转换成json格式
        Gson gson = new Gson();
        String json = gson.toJson(categoryList);
        
        //解决乱码并写出
        response.setContentType("text/html;charset=UTF-8");
        response.getWriter().write(json);
        
    }
}

3 AdminService代码

package www.test.service;

import java.sql.SQLException;
import java.util.List;

import www.test.dao.AdminDao;
import www.test.domain.Category;

public class AdminService {

    // 获取分类
    public List<Category> findAllCategory() {
        AdminDao dao = new AdminDao();
        try {
            return dao.findAllCategory();
        } catch (SQLException e) {
            e.printStackTrace();
            return null;
        }
    }

}

4 AdminDao代码

package www.test.dao;

import java.sql.SQLException;
import java.util.List;

import org.apache.commons.dbutils.QueryRunner;
import org.apache.commons.dbutils.handlers.BeanListHandler;

import www.test.domain.Category;
import www.test.utils.C3P0Utils;

public class AdminDao {

    // 获取分类
    public List<Category> findAllCategory() throws SQLException {
        QueryRunner qr = new QueryRunner(C3P0Utils.getDataSource());
        String sql = "select * from category";
        return qr.query(sql, new BeanListHandler<Category>(Category.class));
    }

}

 

以上是关于案例36-商品添加页面类别ajax显示的主要内容，如果未能解决你的问题，请参考以下文章

ajax 上的 JS 警报添加到购物车以获取 Woocommerce 中的特定产品类别计数

Visualforce页面根据案例类别显示案例计数，单击每个类别我想获得案例的详细视图。怎么样？

第15章WEB15-AJAX和JQuery案例篇

php和ajax分页小案例

PHP Magento Ajax Based从类别页面添加到购物车

在 WooCommerce 中将购物车商品限制为来自同一产品类别