alan3494 2017-10-13 01:09 采纳率: 25%
浏览 3240

通过鼠标点击使用ajax获取table其中一行tr的数据传入action

这个是前端,通过ajax获取团建单位和团检登记时间传到后台action接收,查询到的东西返回页面,通过for in打印到页面

里,现在的问题就是怎么再通ajax获取到刚才打印出来的数据,
(鼠标点击打印出来表格的其中一行获取这行的数据并发送到action)就这步的代码我不会……

需求:
我第一次靠两个参数查询出数据,显示在一个table中,接下来我需要鼠标点击这个table中的tr,以这个tr中的td,查询出另外的数据显示在另一个table,我现在是不会用鼠标点击取得第一次打印出的行的数据

<body>
    <div>
        <table class="table">
            <tr>
                <th>团建单位:</th>
                <td><input type="text" id="comname"></td>
                <th>团检登记时间:</th>
                <td><input type="date" id="date"></td>
                <th><input class="button button-silver" type="button"
                    id="query_comname" value="查询" style="width:40%;">
                </td>
                <th><input class="button button-silver" type="button"
                    value="退选中" style="width:40%;"></th>
            </tr>
        </table>
    </div>
    <div id="itemRefundDiv1">
        <table class="table" id="tab1000">
            <thead>
                <tr>
                    <th class="box"><input type="checkbox" style="zoom:170%;"></th>
                    <th>体检人</th>
                    <th>体检号</th>
                    <th>登记时间</th>
                    <th>开始体检时间</th>
                </tr>
            </thead>
            <tbody>
<!--            打印第一个BOX的内容 -->
            </tbody>
        </table>
    </div>
    <div id="itemRefundDiv2">
        <table border="1px" class="table">
            <tr>
                <td class="box"><input type="checkbox" style="zoom:170%;"></td>
                <th>套餐或项目名称</th>
                <th>数量</th>
                <th>金额</th>
                <th>登记人</th>
                <th>登记时间</th>
            </tr>
        </table>
    </div>

    <script type="text/javascript">
        $(function() {
            $("#query_comname").click(function() {
                var cn = $("#comname").val();
                var dt = $("#date").val();
                $.ajax({
                    url : "itemRefund/query_com",
                    type : "post",
                    data : {
                        "com_name" : cn,
                        "reg_time" : dt
                    },
                    success : function(data) {
                        if (data.NOTFOUND == "true") {
                            alert("找不到合符条件的信息");
                        } else {
                        //alert(data.listRefund[0].emp_name);
                            var listRefund = data.listRefund;
                            var str = "";
                            for (var i in data.listRefund) {
                                str += "<tr id =" + "listRefund" + i + ">";
                                str += "<td class='box'>" + "<input type='checkbox' style='zoom:170%;'>" + "</td>";
                                str += "<td align='center' id=A" + data.listRefund[i].emp_name + ">" + data.listRefund[i].emp_name + "</td>";
                                str += "<td align='center' id=B" + data.listRefund[i].reg_no + ">" + data.listRefund[i].reg_no + "</td>";
                                str += "<td align='center' id=C" + data.listRefund[i].reg_time + ">" + data.listRefund[i].reg_time + "</td>";
                                str += "<td align='center' id=D" + data.listRefund[i].bat_begin + ">" + data.listRefund[i].bat_begin + "</td>";
                                str += "</tr>";
                            }
                            $("#tab1000 tbody").empty();
                            $("#tab1000 tbody").append(str);
                        }
                    }
                });
            });
        });
    </script>
</body>

下面是action类

@Controller
@RequestMapping("itemRefund")
public class itemRefundAction {

    @Autowired
    IItemRefundService iitemRefundService;

    @RequestMapping(value="query_com",method=RequestMethod.POST)
    @ResponseBody
    public Map<String, Object> query(itemRefund it){
        System.out.println("查询公司" + it);
        //通过团检单位和团检登记时间查询内容用来退项
        List<itemRefund> list = iitemRefundService.queryRefund(it);

        Map<String, Object> map = new HashMap<String, Object>();  

        if(!list.isEmpty()){  
            map.put("NOTFOUND", "false");  
            map.put("listRefund", list);  
        }else{  
            map.put("NOTFOUND", "true");  
        }  
        System.out.println("map="+map);
        return map; 
    }

    @RequestMapping(value="query_Refund",method=RequestMethod.POST)
    @ResponseBody
    public Map<String, Object> queryRefund(itemRefund it){
        System.out.println("收到的数值");
    //这里接收第二次发送的数据
        Map<String, Object> map = new HashMap<String, Object>(); 



         return map; 
    }
}

  • 写回答

3条回答 默认 最新

  • 子幽 2017-10-13 01:34
    关注

    不知道是不是你的ajax的路劲是不是有问题啊,控制器/方法

    评论

报告相同问题?

悬赏问题

  • ¥50 导入文件到网吧的电脑并且在重启之后不会被恢复
  • ¥15 (希望可以解决问题)ma和mb文件无法正常打开,打开后是空白,但是有正常内存占用,但可以在打开Maya应用程序后打开场景ma和mb格式。
  • ¥20 ML307A在使用AT命令连接EMQX平台的MQTT时被拒绝
  • ¥20 腾讯企业邮箱邮件可以恢复么
  • ¥15 有人知道怎么将自己的迁移策略布到edgecloudsim上使用吗?
  • ¥15 错误 LNK2001 无法解析的外部符号
  • ¥50 安装pyaudiokits失败
  • ¥15 计组这些题应该咋做呀
  • ¥60 更换迈创SOL6M4AE卡的时候,驱动要重新装才能使用,怎么解决?
  • ¥15 让node服务器有自动加载文件的功能