 Show Posts
|
|
Pages: 1 [2]
|
|
16
|
General Category / General Discussion / Complex Toolbar on Datagrid with javascript declaration
|
on: June 10, 2014, 12:07:17 PM
|
Hi partner's I need create complex toolbar ( Buttons and DateBox, InputText , search button) the documentation says:
The top toolbar of datagrid panel. Possible values:
1) an array, each tool options are same as linkbutton.
2) a selector that indicate the toolbar.
Define toolbar within a <div> tag:
$('#dg').datagrid({
toolbar: '#tb'
});
<div id="tb">
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true"/a>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-help',plain:true"/a>
</div>
Define toolbar via array:
$('#dg').datagrid({
toolbar: [{
iconCls: 'icon-edit',
handler: function(){alert('edit')}
},'-',{
iconCls: 'icon-help',
handler: function(){alert('help')}
}]
});
[/i] My declaration is it in Javascript have the datagrid declaration
var edit_mode = false;
var editingIndex;
var tbl = $('#tt');
tbl.datagrid({
width: 780,
height: 285,
url: '../Controllers/c_ejercicio_diario.php?action=READ_EJERCICIO_DIARIO',
singleSelect:true,
toolbar:[
{
text:'Editar',
iconCls:'icon-edit',
handler: function(){
edit_mode = true;
var record = tbl.datagrid('getSelected'); //Renglon seleccionado
var rowIndex = tbl.datagrid("getRowIndex", record);//Indice del renglón seleccionado
if(record){
editRow(rowIndex);
} else{
editRow(0);
}
}
},{
text:'Cambia Fecha',
iconCls:'icon-edit',
handler: function(){
$('#datedlg').dialog('open');
}
}
,
{
text:'Cancela',
iconCls:'icon-cancel',
handler: function(){
edit_mode = false;
tbl.datagrid('endEdit',editingIndex);
}
},
{
text:'Grabar',
iconCls:'icon-save',
handler: function(){
edit_mode = false;
tbl.datagrid('endEdit',editingIndex);
tbl.datagrid('acceptChanges');
saveRecords();
}
}
],
columns:[[
{
field:'id_concepto',
title:'ID',
width:20
},
{
field:'presupuesto_concepto',
title:'Concepto',
width:160
},
{
field:'sociedad',
title:'Sociedad',
width:60
},
{
field:'division',
title:'Division',
width:60
},
{
field:'fecha_previa',
title:'Fecha Previa',
width:80
},
{
field:'importe',
title:'Importe',
width:100,
align:'right',
editor:{
type:'numberbox',
options:{
precision:2,
disabled:true
}
}
},
{
field:'fecha_actual',
title:'Fecha Actual',
width:80,
editor:{
type:'datebox',
options:{
disabled:true
}
}
},
{
field:'importe_actual',
title:'Importe',
width:100,
align:'right',
editor:{
type:'numberbox',
options:{
precision:2,
required: true
}
}
},
{
field:'diferencia',
title:'Diferencia',
width:100,
align:'right',
editor:{
type:'numberbox',
options:{
precision:2,
disabled:true
}
}
}
]],
onSelect:function(index){
editRow(parseInt(index));
}
});
Like this example <div id="tb" style="padding:5px;height:auto">
<div style="margin-bottom:5px">
<a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true"></a>
<a href="#" class="easyui-linkbutton" iconCls="icon-edit" plain="true"></a>
<a href="#" class="easyui-linkbutton" iconCls="icon-save" plain="true"></a>
<a href="#" class="easyui-linkbutton" iconCls="icon-cut" plain="true"></a>
<a href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true"></a>
</div>
<div>
Date From: <input class="easyui-datebox" style="width:80px">
To: <input class="easyui-datebox" style="width:80px">
Language:
<select class="easyui-combobox" panelHeight="auto" style="width:100px">
<option value="java">Java</option>
<option value="c">C</option>
<option value="basic">Basic</option>
<option value="perl">Perl</option>
<option value="python">Python</option>
</select>
<a href="#" class="easyui-linkbutton" iconCls="icon-search">Search</a>
</div>
</div>
Tnx in advance  |
|
|
|
|
17
|
General Category / General Discussion / Re: How to put an href on tree or treegrid
|
on: December 17, 2013, 12:55:04 PM
|
Sorry is no styler, is formatter. <th data-options="field:'url',width:450,editor:'text',formatter:cellStyler">Attribute</th> where cellStyler is a Javascript function formatter function cellStyler(value,row,index){
return '<span><a href="'+ value+'" class="easyui-linkbutton">'+ row.url+'</a></span>';
} |
|
|
|
|
18
|
General Category / General Discussion / Re: How to put an href on tree or treegrid
|
on: December 17, 2013, 12:52:41 PM
|
Hi get the answer using treegrid and one formatter on my URL column <script type="text/javascript">
function cellStyler(value,row,index){
return '<span><a href="'+ value+'" class="easyui-linkbutton">'+ row.url+'</a></span>';
}
</script>
<table title="Menú de Opciones Editable"
class="easyui-treegrid"
style="width:1200px;height:auto "
data-options="
url: 'armaArbol?action=GETROLE',
rownumbers: true,
idField: 'menu_id',
treeField: 'name',
queryParams:{idrole: 1,idsistema:1}"
id='tg'>
<thead>
<tr>
<th field="rolename" width="100">RoleName</th>
<th field="idrole" width="50">IDRole</th>
<th field="idsistema" width="50">IDSistema</th>
<th field="menu_id" width="50">MenuID</th>
<th field="padre" width="50">Padre</th>
<th data-options="field:'name',width:'250',editor:'text'">Nombre</th>
<!--<th data-options="field:'url',width:450,editor:'text',styler:cellStyler">Attribute</th> -->
<th data-options="field:'url',width:450,editor:'text',formatter:cellStyler">Attribute</th>
<th field="action" width="50">Permisos</th>
<th field="activo" width="50">Activo</th>
</tr>
</thead>
</table> However i have doubt, how to get it result in a tree |
|
|
|
|
19
|
General Category / General Discussion / How to put an href on tree or treegrid
|
on: December 17, 2013, 10:20:31 AM
|
I was working with tree and treegrid, my code is based on http://www.jeasyui.com/tutorial/tree/treegrid5.php, but i need to add an URL column to link to some place ( One menu item option). My HTML LoadFilter is the same of example cited on top. <table id="test" title="Lazy Loading" class="easyui-treegrid" style="width:700px;height:600px"
data-options="
url: 'data/treegrid_data.json',
method: 'get',
rownumbers: true,
idField: 'id',
treeField: 'name',
loadFilter: myLoadFilter
">
<thead>
<tr>
<th field="name" width="220">Name</th>
<th field="size" width="100" align="right">Size</th>
<th field="date" width="150">Modified Date</th>
<th field="url" width="150">URL</th>
</tr>
</thead>
</table>
My JSON format is this [{
"id":1,
"name":"C",
"size":"",
"date":"02/19/2010",
"children":[{
"id":2,
"name":"Program Files",
"size":"120 MB",
"date":"03/20/2010",
"children":[{
"id":21,
"name":"Java",
"size":"",
"date":"01/13/2010",
"state":"closed",
"children":[{
"id":211,
"name":"java.exe",
"size":"142 KB",
"date":"01/13/2010",
"url":"http://www.mkyong.com/author/mkyong/"
},{
"id":212,
"name":"jawt.dll",
"size":"5 KB",
"date":"01/13/2010",
"url":"http://viralpatel.net/blogs/"
}]
},{
"id":22,
"name":"MySQL",
"size":"",
"date":"01/13/2010",
"state":"closed",
"children":[{
"id":221,
"name":"my.ini",
"size":"10 KB",
"date":"02/26/2009",
"url": "http://www.jeasyui.com/demo/main/index.php?plugin=TreeGrid"
},{
"id":222,
"name":"my-huge.ini",
"size":"5 KB",
"date":"02/26/2009",
"url":"http://www.jeasyui.com/demo/main/index.php?plugin=NumberSpinner&theme=default&dir=ltr&pitem="
},{
"id":223,
"name":"my-large.ini",
"size":"5 KB",
"date":"02/26/2009",
"url":"http://www.mysql.com/"
}]
}]
},{
"id":3,
"name":"eclipse",
"size":"",
"date":"01/20/2010",
"children":[{
"id":31,
"name":"eclipse.exe",
"size":"56 KB",
"date":"05/19/2009"
},{
"id":32,
"name":"eclipse.ini",
"size":"1 KB",
"date":"04/20/2010"
},{
"id":33,
"name":"notice.html",
"size":"7 KB",
"date":"03/17/2005"
}]
}]
}]The question is How to add <a href> </a> in this column, not only text, i need URL for launch some process |
|
|
|
|
