Recent Posts

This issue has been fixed. Please update to the latest version.

Hello

I have a datagrid and subgrid as below

Code:

var conf = {
						
	options:{
		fitColumns:true,
		toolbar:'#toolbar',
		columns:[[
			{field:'name',title:'name',width:12},
			{field:'amt1',title:'amt1',width:10,align:'right'},									
			{field:'amt2',title:'amt2',width:10,align:'right'},
			{field:'total',title:'Total',width:10,align:'right',		
			styler: function(value,row,index){     
				if (value.charAt(0) == '-'){
			return 'color:red;';}
			}},
			{field:'adjust',title:'Adjust',width:10,align:'right',
			styler: function(value,row,index){     
				if (value.charAt(0) == '-'){
			return 'color:red;';}
			}},	
			{field:'balance',title:'Balance',width:10,align:'right',
			styler: function(value,row,index){     
				if (value.charAt(0) == '-'){
			return 'color:red;';}
			}},	
			]],
			},

			subgrid:{
				options:{
					fitColumns:true,
					singleSelect:true,
					autoUpdateDetail:false,
					url:'scripts/database/get_costs.php',
					foreignField:function(row){
					var dp = $('#yearCombo').combobox('getValue');
                    return {
                        name:row.name,
                        year:dp
                    }},								
					columns:[[
						{field:'date',title:'Date',width:8},	
						{field:'cst1',title:'Cost 1',width:7,halign:'center',align:'right',
						 styler: function(value,row,index){     
 	 				              if (value.charAt(0) == '-'){
     					return 'color:red;';}
					        	}},									
						{field:'cst2',title:'Cost 2',width:7,halign:'center',align:'right'},
						{field:'total_cst',title:'Total',width:7,halign:'center',align:'right'},
                        ]],
						}
					}
	};

I have a form to to edit the values from the sub grid, however this enatils adding a button to each subgrid line

Is there a way to get the row values from a selected sub grid line, without adding a button on each sub grid line..., instead by using a button on the toolbar

Thank you

Please see below additional code in the hope this will help

Code:

var conf = {
						
	options:{
		fitColumns:true,
		toolbar:'#toolbar',
		columns:[[
			{field:'name',title:'name',width:12},
			{field:'amt1',title:'amt1',width:10,align:'right'},									
			{field:'amt2',title:'amt2',width:10,align:'right'},
			{field:'total',title:'Total',width:10,align:'right',		
			styler: function(value,row,index){     
				if (value.charAt(0) == '-'){
			return 'color:red;';}
			}},
			{field:'adjust',title:'Adjust',width:10,align:'right',
			styler: function(value,row,index){     
				if (value.charAt(0) == '-'){
			return 'color:red;';}
			}},	
			{field:'balance',title:'Balance',width:10,align:'right',
			styler: function(value,row,index){     
				if (value.charAt(0) == '-'){
			return 'color:red;';}
			}},	
			]],
			},

			subgrid:{
				options:{
					fitColumns:true,
					singleSelect:true,
					autoUpdateDetail:false,
					url:'scripts/database/get_costs.php',
					foreignField:function(row){
					var dp = $('#yearCombo').combobox('getValue');
                    return {
                        name:row.name,
                        year:dp
                    }},								
					columns:[[
						{field:'date',title:'Date',width:8},	
						{field:'cst1',title:'Cost 1',width:7,halign:'center',align:'right',
						 styler: function(value,row,index){     
 	 				              if (value.charAt(0) == '-'){
     					return 'color:red;';}
					        	}},									
						{field:'cst2',title:'Cost 2',width:7,halign:'center',align:'right'},
						{field:'total_cst',title:'Total',width:7,halign:'center',align:'right'},
                        ]],
						}
					}
	};

Hi Jarry.

Nice, thanks

Jesper

Here is the extended method that will be included into next version.

Code:

(function ($) {
	function findBy(target, field, value) {
		var state = $.data(target, 'treegrid');
		var result = null;
		$.easyui.forEach(state.data, true, function (node) {
			if (node[field] == value) {
				result = node;
				return false;
			}
		});
		return result;
	}
	$.extend($.fn.treegrid.methods, {
		findBy: function (jq, param) {
			return findBy(jq[0], param.field, param.value);
		}
	})
})(jQuery)

Hello

I have a nested Grid

The following styler works fine on the main grid, but not the sub grid

Code:

columns:[[
{field:'adjust',title:'Adjust',width:10,align:'right',
          styler: function(value,row,index){     
 	 	    if (value.charAt(0) == '-'){
                    return 'color:red;';}
}},	
]],

Any suggestions why ??

Thank you

Hi.

In tree there is a findby, but not in treegrid.  

Hello,
I have a problem when cancelling an edit in datagrid, I have bootstrap 5.
It displays an error `No method named "destroy"`.
I know the error is caused by trying to use the method '$(_5b3).tooltip("destroy");' but it looks like bootstrap "overrides" this method

Is this a known problem?

Code:

Uncaught TypeError: No method named "destroy"
    at HTMLInputElement.<anonymous> (bootstrap.min.js:6:49629)
    at Function.each (jquery.min.js:2:2573)
    at w.fn.init.each (jquery.min.js:2:1240)
    at w.fn.init.jQueryInterface [as tooltip] (bootstrap.min.js:6:49527)
    at _5b2 (jquery.easyui.min.js:7827:9)
    at HTMLInputElement.<anonymous> (jquery.easyui.min.js:8041:1)
    at Function.each (jquery.min.js:2:2573)
    at w.fn.init.each (jquery.min.js:2:1240)
    at Object.destroy (jquery.easyui.min.js:8040:11)
    at $.fn.validatebox (jquery.easyui.min.js:8019:38)

Hi.

Happy New Year.

Just say it. Your question is fundamental javascript and is off topic in this forum. You can find javascript programming on thousands of other sites.

Everyone in this forum looks for Q and A about easyui for jquery/vue/angular/react. ;-)

Solved

var name = $('#name').val();