点击某一条记录中的页码,填入新的值,鼠标离开后将最新数据更新到数据库
前端代码:
<table class="table table-border table-bordered table-bg">
<thead>
<tr>
<th scope="col" colspan="14">杂志图片列表</th>
</tr>
<tr class="text-c">
<th width="25"><input type="checkbox" name="dellist" value=""></th>
<th width="40">ID</th>
<th width="90">页码</th>
<th width="90">描述</th>
<th width="150">更新时间</th>
</tr>
</thead>
<tbody>
{volist name="lists" id="mi" empty="暂无数据"}
<tr class="text-c">
<td><input type="checkbox" value="{$mi.id}" name=""></td>
<td>{$mi.id}</td>
<td>
<input style="width: 50px;" name="pagenum" id="pagenum{$mi.id}" miid="{$mi.id}" onclick="setid('{$mi.id}')" value="{$mi.page_num}">
</td>
<td>
{$mi.dis}
</td>
<td> {$mi.create_time}</td>
</tr>
{/volist}
</tbody>
</table>
<input type="hidden" value="" id="pagenum"/>
js代码:
<script type="text/javascript">
function setid(id){
$('#pagenum').val("pagenum"+id);
}
$(function(){
$('input[name=pagenum]').change(function(){
var id = $('#pagenum').val();
var values = $('#'+id).val();
var miid = $('#'+id).attr('miid');
layer.confirm('确认要修改吗?',function(index){
//此处请求后台程序,下方是成功后的前台处理……
$.ajax({
type: "GET",
url: "{:url('changeNum')}",
data: {page_num:values,id:miid},
dataType: "json",
async: false,
success: function (res) {
if(res.status==1){
layer.msg(res.msg,{icon:1,time:2000});
}else{
layer.msg(res.msg,{icon:1,time:2000});
}
}
});
});
});
})
</script>