Select ALL Delete Checkboxes

[billkay]

I've got an updatable grid... nothing special.

I have the "delete" checkbox enabled on the right hand side to allow the user to check the box and then click Submit below to delete the selected records.

However, I would like to be able to quickly check ALL the delete checkboxes to save time (as often ALL will be be needing selecting). This is very time consuming on hundreds of records.

I've looked and looked for a feature in the editing properties for the delete box, but I can't find anything.

Any ideas?

Thanks,
Bill

[DBM]

Re: Select ALL Delete Checkboxes

Bill,

This recent post provides detail on adding buttons to a grid and talks about checked rows and how to make use of ajax callbacks / javascript.

http://msgboard.alphasoftware.com/al...ad.php?t=84932

It's only a thought but could the same metholdolgy be used to check all of delete checkboxes in the grid?

Using the button html code example in the customization part of the update settings of the grids creates a button in the heading of the delete column.

Can the experts help with the next bit?

David.

[billkay]

Re: Select ALL Delete Checkboxes

Thanks David, for that.

Funny that there are two features that get things 1/2 way there...

1) The "has checkbox select column" (on the left) (in Properties->Layout options, that displays a checkbox up above on the left, when checked selects ALL the records... (this would be great if there was an easy way to parse these and delete the corresponding records)

2) AND there is the delete checkbox on the right, but no option to automatically include the same select all option (as #1) for the delete checkbox.

I'm really surprised that the fine people at Alpha don't have this need covered as a "standard" option to just click and it appears, like everything else.

I will take a look at that example... at first blush looks complicated... I'm not a pro developer, so I'm looking for something simple and dirty.

Thanks again!
Bill

[billkay]

Re: Select ALL Delete Checkboxes

OK,

I've got a button created at the top of the column of delete checkboxes...

With

<button style="GlassBlue" onclick="myAjaxCallBack()">Select All Delete</button>

in the "Delete Checkbox Label"

Anyone have an idea how to use select all the DELETE checkboxes in the column when clicking that button?

Thanks,
Bill

[Bob Moore]

Re: Select ALL Delete Checkboxes

Something like this ...

http://screencast.com/t/NDJiODQwM

It wasn't simple and it's not dirty .. although it makes the grid dirty! This is all done in JavaScript.

I'm sure this functionality will be native to the grid when the A Team gets the time.

[billkay]

Re: Select ALL Delete Checkboxes

YES... that is EXACTLY what I need to accomplish.

Any tips would be appreciated!
Thanks,
Bill

[Peter.Greulich]

Re: Select ALL Delete Checkboxes

However, I would like to be able to quickly check ALL the delete checkboxes to save time (as often ALL will be be needing selecting). This is very time consuming on hundreds of records.

One other way is to do a simple AJAX callback to an a5w page w. a delete script.

[DBM]

Re: Select ALL Delete Checkboxes

Bill,

This is not as elegant as Bob's solution but sort of works. (The intitial click in the checkbox takes a short while to populate the checks boxes for each grid row)

Put the following in the Delete Checkbox Label setting in Update Settings

Delete</br><input type="checkbox" name="MyDeleteBox" onclick="MyDeleteFunction()"/>


Place the following code in Javascript Function Declarations in Grid Properties settings

function MyDeleteFunction(){

	PageRows={grid.object}._rowsInGrid
	
	if (MyDeleteBox.checked){
		DeleteFlag='1';
	}else {
		DeleteFlag='0'
	}

	
	for (MyRowNum=1;MyRowNum<=PageRows;MyRowNum++) 
		{
		{grid.object}._setValue('G','__Delete',MyRowNum,DeleteFlag);
		}
		
}

Maybe won't be quite good enough for what you need but perhaps someone could enhance.

David.

[Bob Moore]

Re: Select ALL Delete Checkboxes

David,

Your solution is very close to mine. The problem with your solution is that it will not work if the grid is called from the tabbed UI.

If you remove the function and use inline Javascript in the onclick event it will work anywhere.

I am planning to do a "How to" video on this as soon as I can find the time.

Well done!

[billkay]

Re: Select ALL Delete Checkboxes

Thank you David for that! I've tried it in a number of browsers, and so far it only works in Opera and IE (partially).
Firefox doesn't do anything, and same with Chrome.

In Opera and IE, once the selectorbox is checked, it properly selects all checkboxes in the column. However after the "Submit" button is pressed, there are a number of screen redraws, and bouncing around as all records are removed... after the screen finally redraws, the scrollbar on the right bounces everytime you attempt to move it, and attempting to use the Delete checkbox a second time is hit and miss.

You are definitely on the right track... this feature is EXACTLY what I need... Hopefully we can figure this out.

Thanks,
Bill

[Bob Moore]

Re: Select ALL Delete Checkboxes

Here is a video that describes the HTML/Javascript code that I've used to implemment a select all/de-select all rows for deletion.

http://screencast.com/t/OThjMTRkM

Here's the referenced JavaScript :

// Javascript to check all deleted check boxes in grid

if ($('d1').checked ){ 
   d_flag=true; 
}
else {
   d_flag=false;
}

for (i=1;i<={Grid.object}._rowsInGrid;i++){
   {grid.Object}._setValue('G','__Delete',i,d_flag);
}

And here is the full HTML/Inline JavaScript for the Delete Checkbox Label, using the technique described in the video:

Delete<br><input type ="checkbox" id="d1" onclick="if  ($('d1').checked) {d_flag=true;}else {d_flag=false;}for (i=1;i<={Grid.object}._rowsInGrid;i++){{grid.Object}._setValue('G','__Delete',i,d_flag);} ">

[DBM]

Re: Select ALL Delete Checkboxes

Bob,

Thanks for the very informative video.

David.

[billkay]

Re: Select ALL Delete Checkboxes

Bob... thanks for the video and code!

It even works in Chrome. Interesting.

I'd just like to point something out, as it may not be apparent, and I can't explain "why" this is happening. When displaying LARGER number of items in the grid 25+ (I sometimes need to prune back 200+ items at a time), after selecting all, and submitting, then after the grid redraws to show nothing there, then after it refreshes with the next 200 items, it is IMPOSSIBLE to reselect the checkall box. There seem to be a number of callbacks or refreshes taking place that are queued up. Although the refreshed grid is visible, selecting any of the delete checkboxes just has them unselect immediately on their own. This seems to "last" for up to 5 minutes. Then all of a sudden, everything works again.

In testing, seems that the server side is busy, as any attempted refresh of the grid, or calling another page is dead slow (or impossible). I can understand the server may be busy deleting 200 records, however somehow the grid shouldn't show it is "ready" for more user interaction, when it is not.

I've attempted to disable any possible callbacks, but to no avail. Any ideas ??

[Bob Moore]

Re: Select ALL Delete Checkboxes

Bill,

In the grid Update Settings, Editing properties, uncheck Refresh data on row dirty.

This will eliminate an Ajax callback that fires when each row is made dirty with the delete checkbox toggle.

Also, here's a "tighter", possibly more efficient version of the code to insert for the Delete label.

Delete<br><input type ="checkbox" id="d1" onclick="d_flag = $('d1').checked?true:false;for (i=1;i<={Grid.object}._rowsInGrid;i++){{grid.Object}._setValue('G','__Delete',i,d_flag);}">

[billkay]

Re: Select ALL Delete Checkboxes

Hi Bob,

Thanks for that update. Works too!

I've confirmed that the "Refresh data on row dirty" is NOT enabled, and it is acting as above described...

I wonder if this is a bug or not, as it definitely keeps the server processor busy (pinned), and refreshing, for quite some time after submit).