在jsp页面中使用jQuery对选中的复选框行值进行分组

时间:2016-06-14 08:19:47

标签: javascript jquery jsp servlets

我需要帮助在jsp页面中使用jQuery对选中的复选框行值进行分组

在我的jsp页面中,我有品牌名称,产品名称(复选框)和说明(文本框)。单击提交按钮时,选中的复选框行值,即所有选中的ProductName复选框的品牌名称,产品名称和描述应使用jQuery函数组合在一起,并应传递给servlet以进行数据库插入。

帮助我对选中的复选框行值进行分组并将这些值传递给servlet。

我尝试过使用jQuery函数,但我的浏览器控制台中没有打印任何内容。

这是我的代码。

的jQuery

<script>
    $('#btn').live('click', function() {
            var checkedRows = [];
            $(':checkbox:checked').closest('tr').each(function() {
                checkedRows.push(
                  $(this).find('td:gt(0)').map(function() {
                      return $(this).html();
                  }).get()
                ); 
             });        
            console.log( checkedRows );

        });
    </script>

JSP页面

<%@page import="java.util.List"%>
        <%@page import="web.Products"%>
        <%@page import="java.util.ArrayList"%>
        <%@page contentType="text/html" pageEncoding="UTF-8"%>
        <!DOCTYPE html>
        <html>
    <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
    <script type="text/JavaScript" src="JS/jquery-1.4.2.min.js"></script>

    <script>
    $('#btn').live('click', function() {
            var checkedRows = [];
            $(':checkbox:checked').closest('tr').each(function() {
                checkedRows.push(
                  $(this).find('td:gt(0)').map(function() {
                      return $(this).html();
                  }).get()
                ); 
             });        
            console.log( checkedRows );

        });
    </script>

    </head>
  <body>
         <form name="sform" method="post" action="Save_Products"> 
          <table style="width:40%">
              <tr> <th> Brand Name</th>
                  <th> Product Name</th>
                  <th> Description</th>
              </tr>
              <tr>
                   <td><%
      List<Products> pdts = (List<Products>) request.getAttribute("productlist");
      if(pdts!=null){
        for(Products prod: pdts){
      out.println("<input type=\"hidden\" name=\"brand_name\" value=\""  + prod.getBrandname() + "\">");
          out.println("<br/>"+prod.getBrandname());

            } %> </td>
           <td><%
      if(pdts!=null){
        for(Products prod: pdts){
           out.println("<input type=\"checkbox\" name=\"prod\" checked=\"checked\" value=\""  + prod.getProductname() + "\">"  + prod.getProductname()+"<br>");
            } } %> </td>
           <td><%
           if(pdts!=null){
           for(Products prod: pdts){
            out.println("<input type=\"text\" name=\"desc\" style=\"width:50px; height:22px\" value=\""+prod.getDesc()+"\"/><br/>");
        } 
       }  
       } %> </td>  
       </tr>
        <br/>
        <br/>
        <tr>
            <td></td>
            <td align="center">  <input id="btn" type="submit" value="Save" name="save"/> </td></tr> 

          </table>
             </form>
       </body>
        </html>

0 个答案:

没有答案