onExpandRow action onClose?

[kavvson]

I have such function

Code:

onExpandRow: function(index,row){
		  $('#jloading').html('<img src="themes/default/images/loading.gif">');
                    var ddv = $(this).datagrid('getRowDetail',index).find('div.ddv');
                    ddv.panel({
                        height:1,
                        border:true,
                        cache:false,
                        href:'listdetail.php?listnumb='+row.number,
                        onLoad:function(){
                            $('#dg').datagrid('fixDetailRowHeight',index);
                        }
                    });
                    $('#dg').datagrid('fixDetailRowHeight',index);
					 $.ajax({
						type: "GET",
						url: 'listdetail.php?listnumb='+row.number,
						success: function (d) {
							// replace div's content with returned data
							$('#jloading').html(d);
						}
					});
                },

As you see I added an ajax that shows the same result but in a div container separately from the table

Code:

$('#jloading').html(d);

, now whenever I click + as the expansion it all works fine, but when I do click the -, I would like to empty the container

Code:

#jloading

Do you have any tips?

[stworthy]

When click the - icon, the 'onCollapseRow' event fires, in which you can write some code logic to do what you want.

[kavvson]

Old Thank you for the onCollapseRow option, but im wondering which can be the most effective way

Code:

.val('') 

would do it properly?[/s]

Code:

onCollapseRow: $('#jinner').html(''),

  also

Code:

.val('') 

doesnt work f.e

[kavvson]

Any ideas on this one?

[stworthy]

How do you define the '#jloading'? And what do you wish to do when collapse a row? Please describe your issue in more detail.

[kavvson]

It only loades a simple data into the div. Onclose I want it to clear the data [http://oi59.tinypic.com/dnj6z9.jpg]

code :

Container

Code:

<div class="easyui-tabs" id="accord" data-options="tabWidth:112" style="height:500px;">
						<div title="Szczegóły" style="padding:10px">
							<div id="jloading"></div>
						</div>
						<div title="Wpisy" style="padding:10px">
							<div id="jinner"></div>
						</div>
					</div>

and my event for onExpand

Code:

                onExpandRow: function(index,row){
					$('#jloading').html('<img src="themes/default/images/loading.gif">');
                    var ddv = $(this).datagrid('getRowDetail',index).find('div.ddv');
                    ddv.panel({
                        height:1,
                        border:true,
                        cache:false,
                        href:'listdetail.php?listnumb='+row.number,
                        onLoad:function(){
                            $('#dg').datagrid('fixDetailRowHeight',index);
                        }
                    });
                    $('#dg').datagrid('fixDetailRowHeight',index);
					 $.ajax({
						type: "GET",
						url: 'listdetail.php?listnumb='+row.number,
						success: function (d) {
							// replace div's content with returned data
							$('#jloading').html(d);
						}
					});
					$.ajax({
						type: "GET",
						url: 'listdetailsub.php?listnumb='+row.number,
						success: function (d) {
							// replace div's content with returned data
							$('#jinner').html(d);
						}
					});
                },

Hope its enough information to help me out.

Whenever I expand I want be able to close it and remove the content ( seems like

Code:

onCollapseRow: $('#jinner').val(''),

doesnt work here )

[stworthy]

If you only want to clear the '#jinner' container, call 'empty' or 'html' method after the row is collapsed.

Code:

$('#dg').datagrid({
	view: detailview,
	onCollapseRow: function(index,row){
		$('#jinner').empty();
	}
})

[kavvson]

Uncaught TypeError: undefined is not a function  after adding the onCollapseRow   VM696:8908 it is

Code:

return $.fn.datagrid.methods[_64d](this,_64e);

whole js.

http://pastebin.com/9VBG7CaU