1.添加购票按钮
对应的html代码
因为列表是js函数动态填充的,故添加按钮应该在js函数中,完整代码如下:
1 /** 2 * 注意在调用该函数时必须输入参数 3 * 查询+ 分页 4 * */ 5 function query(_pageSize,_currentPage){ 6 // alert("------query------"); 7 //1.获取参数 8 var startStation = $("#startStation").val(); 9 var stopStation = $("#stopStation").val(); 10 //2.发送请求 11 var params = { 12 startStation:startStation, 13 stopStation:stopStation, 14 _pageSize:_pageSize,//分页需要的数据 15 _currentPage:_currentPage//分页需要的数据 16 }; 17 var url = 'http://localhost:8080/ticket2/data3'; 18 jQuery.ajax({ 19 type: 'POST', 20 contentType: 'application/x-www-form-urlencoded', 21 url: url, 22 data: params, 23 dataType: 'json', 24 success: function (data) { 25 //取出列表 26 var ticketList = data.list; 27 //取出分页数据 28 var currentPage= data.currentPage; 29 var count= data.count; 30 var pageSize= data.pageSize; 31 var totalPage= data.totalPage; 32 var html='<tr>'+ 33 '<td>编号</td>'+ 34 '<td>开始车站</td>'+ 35 '<td>到达车站</td>'+ 36 '<td>余票数</td>'+ 37 '<td>操作</td>'+ //添加购票按钮 38 '</tr>'; 39 //解析数据到table表中 40 for (var i=0;i<ticketList.length;i++){ 41 //取出一个对象 java里面的内省机制 42 var ticket = ticketList[i]; 43 var id = ticket.id; 44 var startStation= ticket.startStation; 45 var stopStation= ticket.stopStation; 46 var standby = ticket.standby; 47 html+='<tr>'+ 48 '<td>'+id+'</td>'+ 49 '<td>'+startStation+'</td>'+ 50 '<td>'+stopStation+'</td>'+ 51 '<td>'+standby+'</td>'+ 52 '<td><button onclick="buyTicket('+id+')">购买</button></td>'+ //添加购票按钮 53 '</tr>'; 54 } 55 //3.填充数据 56 //填充列表 57 $("#ticketList").html(html); 58 //填充分页数据 59 $("#totalPage").html(totalPage); 60 $("#pageSize").html(pageSize); 61 $("#count").html(count); 62 $("#currentPage").html(currentPage); 63 }, 64 error: function (data) { 65 alert("失败啦"); 66 } 67 }); 68 }