EasyUI Forum
May 17, 2024, 06:53:35 AM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: datagrid header  (Read 8526 times)
jaimi
Full Member
***
Posts: 119


View Profile
« on: December 30, 2013, 03:33:31 AM »

Hello,

i'd like to create some kind of header in the datagrid.
I allready created the search fields and search function as shown within the demos and tutorial.

Now i'd like to paste some information at the header, for example aggregation of content which comes with the query result for the grid content itself.

How can i solve this?

thanks. Jaimi
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #1 on: December 30, 2013, 06:24:55 PM »

What do you mean the datagrid header? Is it the panel header or the column header? If it is the panel header, try the code below to get panel header object.
Code:
var header = $('#dg').datagrid('getPanel').panel('header');
Logged
jaimi
Full Member
***
Posts: 119


View Profile
« Reply #2 on: January 18, 2014, 12:50:15 AM »

Thanks for the hint.

I tried the following as I did with the datagrid-pagination.
But it doesn't work. What's wrong?

var CurriculumVitaePager = $('#edgCurriculumVitae').edatagrid('getPager');   
 
 CurriculumVitaePager.pagination({
  showPageList: true,
  displayMsg  : '{from} bis {to} von {total} Einträgen',
  buttons     :[
   {iconCls:'icon-add'   ,handler:function(){addCurriculumVitae();}},
   {iconCls:'icon-edit'  ,handler:function(){editCurriculumVitae();}},
   {iconCls:'icon-remove',handler:function(){removeCurriculumVitae();}},
   {iconCls:'icon-save'  ,handler:function(){saveCurriculumVitae();}},
   {iconCls:'icon-undo'  ,handler:function(){undoCurriculumVitae();}}
  ]
 });//CurriculumVitaePager
 
 var CurriculumVitaePanel = $('#edgCurriculumVitae').edatagrid('getPanel').panel('header');
 
 $('#CurriculumVitaePanel').panel({
  width:500,
  height:150,
  title:'My Panel',
  tools:[{
  iconCls:'icon-add',
  handler:function(){alert('new')}
  },{
  iconCls:'icon-save',
  handler:function(){alert('save')}
  }]
 });//CurriculumVitaePanel
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #3 on: January 18, 2014, 07:05:53 AM »

The datagrid extends from panel. All the properties of panel can be used in datagrid. To apply tools to the datagrid header, create datagrid with 'tools' property definition.
Code:
$('#CurriculumVitaePanel').datagrid({
width:500,
height:150,
title:'My Panel',
tools:[{
iconCls:'icon-add',
handler:function(){alert('new')}
},{
iconCls:'icon-save',
handler:function(){alert('save')}
}]
});
Logged
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!