小左闲谈

Ajax弹窗编辑无刷新查询赋值

当前位置:首页 » 学习 » 本页
In 学习  @2016-03-04

题目很拗口,需求是这样的;
在项目中有一个列表页的右侧的编辑按钮是弹窗式的这时候就没有url跳转,无法使用一般的跳转查询取值,需要通过点击触发取值查询并赋值的过程。

首先封装了一个jQuery的Ajax函数:

function addhidden(id,url){
	var res = 0;
	var data ={"id":id};
	res = $.ajax({
		type:'POST',
		url:url,
		data:data,
		async :false,
		dataType : "json",
		success: function(data){
		},
	})
	res = res.responseText;
	res = eval("("+res+")");
	return res;
	}

调用上面的addhidden函数查询值并返回数据;

//当点击该标签时触发事件
$(".btn.btn-xs.btn-info.addhidden").click(function(){
        //调用ThinkPHP控制器中的isfind函数执行查询
	var url="{:U('Blog/isfind')}";
	//从模板num标签中为id赋值
        var id= $(this).attr("num");
	var data = addhidden(id,url);
	$("#id").val(data.id);
	$("#form-field-mask-2").val(data.title);
	$("#form-field-mask-3").val(data.sort);

Blog控制器类的isfind函数:

//弹窗修改分类取值
public function isfind(){
    if($_POST['id']){
        $blog=M("blog");
        $res=$blog->where(array('id'=>$_POST['id']))->field("id,title,sort")->find();
        $this->ajaxReturn($res);
    }
}

模板文件:

<tbody>
	<volist id="list" name="list">
	<tr>
		<td>{$list.title}</td>
		<td>{$list.time}</td>
		<td>
			<div class="visible-md visible-lg hidden-sm hidden-xs btn-group">
				<a class="btn btn-xs btn-info addhidden" href="#" name="edit" data-toggle="modal" data-target="#Edit" num="{$list.id}" title="编辑">
				<i class="icon-edit bigger-120"></i>
				</a>
				<a class="btn btn-xs btn-danger" name="trash" title="删除" num="{$list.id}">
				<i class="icon-trash bigger-120"></i>
				</a>
				<a class="btn btn-xs btn-warning" href="{:U('Blog/adds',array('pid'=>$list['id'],'title'=>$list['title']))}" name="add" title="添加" num="{$list.id}">
				<i class="icon-plus bigger-120"></i>
				</a>	
				<a class="btn btn-xs btn-success" href="{:U('Blog/mulcolum',array('pid'=>$list['id'],'title'=>$list['title']))}" name="view" title="所属内容" num="{$list.id}">
				<i class="icon-list bigger-120"></i>查看所属内容
				</a>																
			</div>
		</td>
	</tr>
	</volist>
</tbody>
若无特殊声明,表示本文由:小左闲谈.原创
链接地址: http://blog.m1910.com/archives/1459.html
版权所有 © 转载时请以链接形式注明作者和原始出处!
标签: , ,   评论: 抢沙发  被围观 863 次

发表一下你的看法

您将是第一位评论人!

avatar
wpDiscuz