快捷導(dǎo)航

jquery ezUI 雙擊行記錄彈窗查看明細(xì)的實現(xiàn)方法

更新時間：2016年06月01日 16:49:19 投稿：jingxian

下面小編就為大家?guī)硪黄猨query ezUI 雙擊行記錄彈窗查看明細(xì)的實現(xiàn)方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧

第一步：給DataGrid綁定onDblClickRow事件；

<table title="" id="dataTable" class="easyui-datagrid" style="height: 500px;" data-options="
 url: '/ajaxget.aspx?_t='+new Date().getTime()+'&_action=SVNGetHandler.GetSearchPageData&searchType=&keyword=*',
 method: 'get', 
 rownumbers: true,
 singleSelect:true,
 border:0, 
 idField: 'Id', 
 columns:[[ 
   {field:'ProjectId',title:'項目Id',width:30,align:'left'},
   {field:'ProjectName',title:'項目名稱',width:150,align:'left'},
   {field:'ProjectNum',title:'項目編號',width:100,align:'left'}
 ]],
 toolbar:'#myToolbar', 
 pagination:true,
 fitColumns: true,
 pageSize:20, 
 onDblClickRow:onDblClickRow
 ">
 </table>

第二步：編寫行雙擊事件

//行雙擊事件
function onDblClickRow() {
var item = $('#dataTable').datagrid("getSelected");
if (item != null) {
editId = item.Id;
var html = "";
html += "項目名稱：" + item.ProjectName + "<br/>";
html += "項目編號：" + item.ProjectNum + "<br/>";
html += "<br/>"; 
show(item.ProjectName + " 項目詳情", html); 
}
}

第三步：彈出窗口顯示詳細(xì)信息：

<div id="details" style="padding: 10px;line-height:20px;font-size:12px"></div>
function show(title, msg) { 
$('#details').html("<div id=\"output\" style=\"width:99%;height:96%;border:0\">" + msg + "</div>");
$('#details').dialog({
title: title,
width: 800,
height: 400,
iconCls: 'icon-custom-eye',
closed: false,
cache: false,
modal: true
});
}

以上這篇jquery ezUI 雙擊行記錄彈窗查看明細(xì)的實現(xiàn)方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

jQuery UI Dialog控件中的表單無法正常提交的解決方法
研究了頁面源碼后發(fā)現(xiàn)，jQuery UI Dialog控件初始化時動態(tài)生成的HTML元素被添加到頁面的尾部、form元素的后面，而原始的Dialog模板部分（其內(nèi)包含表單元素）也被移到了動態(tài)生成的HTML元素內(nèi)。
2010-12-12
JQUERY 設(shè)置SELECT選中項代碼
本篇文章主要是對JQUERY 設(shè)置SELECT選中項的代碼進(jìn)行了介紹，需要的朋友可以過來參考下，希望對大家有所幫助
2014-02-02
jquery的冒泡事件的阻止與允許(三種實現(xiàn)方法)
冒泡或默認(rèn)的事件發(fā)生,在某些時候是不需要的,在此就需要一些可以阻止冒泡和默認(rèn)的事件的方法,本文介紹三種方法做到不同程度的阻止，感興趣的朋友可以了解下，或許對你了解冒泡事件有所幫助
2013-02-02
基于JQuery的類似新浪微博展示信息效果的代碼
滑動向下時，把最后一個節(jié)點copy過去插入在第一節(jié)點中，并在顯示時隱藏，再通過透明漸變顯示出來。附上源碼，需要的朋友可以copy
2012-07-07
jQuery的運行機制和設(shè)計理念分析
jQuery是一個非常優(yōu)秀的JavaScript庫，與Prototype,YUI,Mootools等眾多的Js類庫相比，它劍走偏鋒，從Web開發(fā)實用的角度出發(fā)，拋除了其它Lib中一些不實用的東西，為開發(fā)者提供了短小精悍的類庫。
2011-04-04
jquery操作checkbox示例分享
這篇文章主要介紹了jquery操作checkbox,需要的朋友可以參考下
2014-07-07
十個迅速提升JQuery性能讓你的JQuery跑得更快
jQuery正在成為Web開發(fā)人員首選的JavaScript庫,作為Web開發(fā)者,除了要了解語言和框架的應(yīng)用技巧外如何提升語言的性能,本文提供即刻提升你的腳本性能的十個步驟簡單的幾步讓你的JQuery跑得更快需要的朋友可以參考下
2012-12-12
jQuery $.each的用法說明
jQuery中$.each的用法，學(xué)習(xí)jquery的朋友可以參考下。
2010-03-03
基于JQuery的列表拖動排序?qū)崿F(xiàn)代碼
基于JQuery的拖動插件有幾個都相當(dāng)好用，效果也很好，但再好，還是自己琢磨一個最好。所以，我的理念就是即使實際項目中使用別人的程序，自己也得根據(jù)自己的理解和想法寫一個出來。那么今天，就來看看我的思路是不是可以實現(xiàn)拖動排序的功能
2013-10-10
jQuery 瀑布流絕對定位布局（二）(延遲AJAX加載圖片)
瀑布流-絕對定位布局，與浮動布局的區(qū)別在于布局不一樣,AJAX不一樣
2012-05-05