I was going to buy it for personal use anyway. What I'm trying to score here is a commercial enterprise license by getting my superiors to see the value of it - and they'll only see it if I manage to demo all their desired functionality in one go. When I do this, the development won't be finished - I work on an enterprise level web application used by 100k active users every day. The profit for EasyUI would thus not stop on this one license.

Now if we can please stay on topic? If you can't constructively contribute to the problem at hand, please don't post.

I found out something interesting.

In your example, when your datagrid has no rows (i.e. I delete them all), then this call:
$("#dg").datagrid('getRows');
returns "[]";

In my example, when I delete all rows,
$("#dg").datagrid('getRows');
returns "undefined";

The row doesn't get appended at all. All I get is that error if I don't have
return {rows: data.response || [], total: data.total || 0}
and if I do have it nothing happens at all.

If the code was unobfuscated I could tell you exactly where the problem occurs, but it's really hard like this.

If I try to run appendRow manually on a datagrid without rows, I get this

Code:

var rowLength = $(target).datagrid('getRows').length;  // line 100 in datagrid-detailview.js 

But if I run it on a datagrid that HAS rows, everything is fine.

Downloaded the new detailview script, everything is the same.

I don't understand this:
"Please confirm your appended data can be post and saved properly."
Could you explain?

Which appended data? The appended data should only be an empty row, and it should go fetch the detailview from my detailview URL. But it never even makes the request, it just falls silent. I have tracked the problem to function _40b in the obfuscated source, but I could get no further.

My response always returns the array object, even if empty, like so:

{"response":[],"total":"0"}

However, if I do the fix you suggested, I don't get an error any more, but the new row still isn't appended.
I tried doing a console.log before and after the appendRow action, and both console.logs trigger, but the append never happens. The table stays the same and doesn't get a new row.

Certainly.

I have a datagrid made like this:

Code:

var identifier = some table
var dataURL = some url from which I fetch data
var getURL = some url from which I get detailview

                       $(identifier).datagrid({
				striped: true,
				method: 'get',
				pagination: "true",
				pageSize: 20,
				fitColumns: true,
				loadFilter: function(data) {
					return {rows: data.response, total: data.total}
				},

				url: 'dataURL',

				view: detailview,  
				detailFormatter:function(index,row){
					return '<div class="ddv"></div>';  k
				},
				onExpandRow:function(index,row){
					var ddv = $(this).datagrid('getRowDetail',index).find('div.ddv');
					$.get(getURL, {slug: row.slug, index: index}, function(data){
						$(ddv).html(data);
						$(identifier).datagrid('fixRowHeight');
						$(identifier).datagrid('fixDetailRowHeight', index);
					}, "html");
				}

			});

The code that creates a new row is this:

Code:

function ui_datagrid_newRow(identifier) {
	$(identifier).datagrid('appendRow',{
		isNewRecord:true
	});
	var index = $(identifier).datagrid('getRows').length - 1;
	$(identifier).datagrid('expandRow', index);
	$(identifier).datagrid('selectRow', index);
}

If the table is empty when I call "function ui_datagrid_newRow", I get this error:

Code:

rows is undefined
for(var i=0; i<rows.length; i++) {

on line 60 of jquery.datagrid-detailview.js

Does this help?

I am using the detailview script to create and edit rows through an expanded row with a detailed form helper.
This is the error I get when I want to create a new row and there are no rows in the grid currently present:

Code:

rows is undefined
[Break On This Error] 	

for(var i=0; i<rows.length; i++) {

I could hack my way through detailview to make a hotfix, but I'd rather avoid it if it is possible.

Interesting, thank you! That might come in handy later on.

Removing the idField from datagrid worked, thanks!
What does that option do, anyway? I couldn't figure it out from the documentation.

When I add a new row to my datagrid with the detailview helper, the values are populated properly because I call "reload" immediately afterwards. But the new row, as an object, has only one value: Object { isNewRecord=true}. Now, when I punch delete, it tells me it can't find the given index,

Code:

data.rows[_49f] is undefined
[Break On This Error] 	

_3ca(_4a2,opts.idField,data.rows[_49f][opts.idField]);

Now, if I refresh, this row is ok and can be deleted. But I can't delete it IMMEDIATELY after creating it, and I would like to.

Let me say right off the bat, I love this library. It's insanely powerful and it replaced jQueryUI completely as far as I'm concerned. My company will be buying a commercial license as soon as I get all things working properly and get the approval of the CEO.

What I have a problem with, though, is getting the column headers to align with the width of the data columns automatically. I guess I could fix it by editing the plugin (I had to edit it already to force the click on a collapsed panel to Expand instead of Resize because resize didn't resize back when I moused-out; editing was hell, since the plugin is obfuscated, but with some experimentation I was able to get it all working), but I'd rather ask just in case there's an option that makes the headers force-width to the width of the widest data in the table.

For example, I would like the picture from attachment 1 look like the picture in attachment 2 automatically.
I would also like the last column to fill up all remaining space in the grid.

I don't want to have to specify "width" in the columns, because my back end is used on many resolutions and many devices - so I want the table to scale to fit the data columns automatically, and I want all remaining space to the right to be filled by the last column. Can this be done natively or should I try and edit the plugin?