`
wanggeying
  • 浏览: 66468 次
  • 性别: Icon_minigender_2
  • 来自: 济南
社区版块
存档分类
最新评论

动态绑定详情按钮 另一种方式打开modal窗口

 
阅读更多
伪代码如下:
    			{
    				field: 'operate',
    				title: '操作',
    				width: '150px',
    				align:"center",
    				formatter: operateFormatter
    			},

function operateFormatter(value, row, index) {
	var id=row.id;
	return [
		'<button id="btn_detail" type="button" data-toggle="modal" data-target="#detailModal" onclick="detailModal(\''+id+'\');" class="RoleOfA btn-default bt-select">详情</button>',
	].join('');
}
//onclick="detailModal(\''+id+'\');"  ,其中的id也可以传递row的喲, 有兴趣的试试

function detailModal(id){
	 $.ajax({ 
         type:"post",
         data: {id:id},
         url:projectpath+"/certificate/cjjl/queryDetails.do",
         dataType:"json",
         async :false,
         success:function(data){ 
        	 console.log(data);
//        		var row=getSelectRows[0];
//        		$("#d_id").val(row.id);
//        		$("#d_zslx").val(row.zslx);
//        		$("#d_zshm").val(row.zshm);
//        		$("#d_yscmc").val(row.yscmc);
//        		$("#d_jcr").val(row.jcr);
//        		$("#d_jcjg").val(row.jcjg);
//        		$("#d_bk").val(row.bk);
//        		var sczp=row.sczp;
//        		var base = new Base64();
//        		var images=base.decode(sczp);   
//        		d_imagestr=images;
//        	    var img = '<img src="'+d_imagestr+'" width="200px" height="200px"/>';
//        	    $("#d_images_show").empty().append(img);
         }
     })

}


个人建议,用我的第一个方案("动态绑定详情按钮")。
分享到:
评论

相关推荐

    带多种CSS3过渡动画的jquery模态窗口插件modal.js.zip

    2. **CSS3过渡动画**:CSS3的过渡(Transition)特性允许元素从一种样式平滑地过渡到另一种样式。在modal.js中,CSS3被用来创建各种动态效果,比如淡入淡出、滑动等,使模态窗口的打开和关闭过程更加吸引人。 3. **...

    实现了弹出窗口后背景变灰并屏蔽

    在ASP.NET开发中,"实现了弹出窗口后背景变灰并屏蔽"这一功能通常涉及到对话框(Modal Dialog)的使用,以及页面动态效果的实现。这个功能的主要目的是在弹出一个窗口时,使得主页面变得不可操作,以引导用户专注于...

    jQuery炫酷点击变形全屏放大的模态窗口

    3. **CSS3过渡**:`transition`属性控制元素从一种样式平滑过渡到另一种样式所需的时间,如`transition: all 0.5s ease`表示所有属性将在0.5秒内以缓动效果完成过渡。 4. **DOM操作**:可能涉及到动态修改元素的...

    Bootstrap4 多步骤向导模态窗口插件

    Bootstrap4的多步骤向导模态窗口插件,如"MultiStep",是开发者们在构建Web应用程序时常用的一种交互元素。它旨在提供一个分步的用户体验,引导用户完成复杂或涉及多个阶段的操作,比如贷款申请流程。这个插件充分...

    浅析BootStrap中Modal(模态框)使用心得

    在本文中,我们将深入探讨Bootstrap框架中的Modal模态框,这是一种强大的UI元素,可以极大地提升网站的用户体验。Bootstrap模态框是基于jQuery插件构建的,它允许开发者创建交互式的模态窗口,用于显示额外信息、...

    用JQuery 自己写的一个锁屏

    另一种可能是点击特定按钮后立即解锁,这种情况下只需简单的事件触发即可。 模态窗口(Modal Window)是另一个关键组件,它是一种弹出式的用户界面,能够暂时中断用户的操作流程,直到用户与之交互或关闭为止。在...

    cw-modal:AngularJS 模态对话框

    在描述中提到的“工作正在进行中”,可能是指 cw-modal 支持连续打开多个模态,或者在当前模态未关闭的情况下显示另一个模态。这种功能对于处理多步骤流程或展示一系列信息很有用。实现方式通常涉及到队列管理,确保...

    bootstrap.dialog

    1. **模态对话框(Modal)**:模态对话框是一种阻塞用户与页面其他部分交互的窗口,直到用户关闭该对话框。在Bootstrap Dialog中,你可以设置模态对话框的标题、内容、按钮等属性,使其适应不同的应用场景,如信息...

    asp.net多层弹出showDialog

    ASP.NET是一种基于微软.NET Framework的Web应用程序开发框架,它提供了丰富的功能和工具,使得开发者能够构建动态、数据驱动的Web应用程序。在ASP.NET中,"多层弹出showDialog"通常指的是在网页交互中实现多级对话框...

    jQuery使用模式窗口实现在主页面和子页面中互相传值的方法

    模式窗口是一种在用户与主页面交互时弹出的覆盖层,它通常用来提供额外的用户界面元素,比如弹出表单、对话框或者确认框,以便用户能够进行额外的输入或选择。这种模式窗口出现时会阻塞背景页面的操作,直到它被关闭...

    Bootstrap响应式模态登录框插件

    总之,Bootstrap响应式模态登录框插件结合了Bootstrap的响应式布局、模态组件和jQuery的交互功能,提供了一种高效、易于集成的登录解决方案。开发者可以根据自己的需求对插件进行自定义,以满足各种项目的需求,同时...

    vc++实现修改数据,弹出新对话框,刷新原始对话框的简单示例

    在Windows应用程序中,对话框是一种特殊的窗口,通常用于收集用户输入或显示信息。VC++提供了两种主要类型的对话框:模态对话框(Modal Dialog)和非模态对话框(Modeless Dialog)。在这个例子中,我们可能会使用...

    弹出层2,可以弹出多个层,并实现数据交互

    在IT领域,弹出层(通常称为Modal窗口或Dialog)是一种常见的用户界面设计元素,用于在用户当前操作的页面上显示额外的信息或者进行特定的交互。"弹出层2"可能是一个专门设计的插件,它允许开发者创建并管理多个同时...

    jquery ui 帮助文档

    滑块控件提供一种直观的方式来选择数值,可以是单手柄或多手柄,适用于音量控制、评分系统等场景。 5. **日期选择器(Datepicker)** 日期选择器是jQuery UI的一个强大工具,提供了方便的日期选择功能,支持多种...

    AmazeUI中模态框的实现

    在AmazeUI中,模态框(Modal)是一种非常实用的元素,用于在当前页面上弹出一个临时的对话窗口,通常用于显示警告、确认或提供额外信息。模态框的设计理念是尽可能不打断用户的浏览流程,同时又能提供必要的交互。 ...

    Flex开发实例--学习必备

    - 柱状图是另一种常见的图表类型,可以清晰地展示不同类别之间的对比。 #### 26. 简单动画效果 - Flex支持创建简单的动画效果,如淡入淡出、滑动等。 - 可以通过ActionScript编程实现复杂的动画逻辑。 ### Flex ...

    html的遮罩层原理

    - **被遮罩内容**:被遮罩的内容通常包含在另一个元素内,如`&lt;div id="modal"&gt;&lt;/div&gt;`,并使用CSS进行定位。 4. **响应式设计** - 为了确保在不同设备和屏幕尺寸上的效果,可以使用媒体查询(`media queries`)进行...

    谷歌android+ui设计技巧共五部分

    5. **暗黑模式**:为用户提供另一种视觉体验,降低在暗环境下使用手机的不适。 **第五部分:图标与指导说明** 1. **图标设计**:图标应简洁、直观,传达清晰的功能信息。 2. **图标的统一性**:保持图标风格一致,...

    js实现非常棒的弹出div

    标题所提到的"js实现非常棒的弹出div"是一种常见的网页交互设计,用于在用户触发某个事件(如点击按钮)时,弹出一个浮动的div元素,展示额外的信息或者进行交互操作。在这个实例中,我们看到一个简单的JavaScript和...

Global site tag (gtag.js) - Google Analytics