FIX Refactor JS bulk action handling

JS bulk action handling now works for any custom action

code/GridFieldBulkManager.php

@@ -260,7 +260,8 @@ class GridFieldBulkManager implements GridField_HTMLProvider, GridField_ColumnPr
 	function getColumnContent($gridField, $record, $columnName)
 	{
 		$cb = CheckboxField::create('bulkSelect_'.$record->ID)
-			->addExtraClass('bulkSelect no-change-track');
+			    ->addExtraClass('bulkSelect no-change-track')
+			    ->setAttribute('data-record', $record->ID);
 		return $cb->Field();
 	}
 	
@@ -287,6 +288,7 @@ class GridFieldBulkManager implements GridField_HTMLProvider, GridField_ColumnPr
 	{				
 		Requirements::css(BULK_EDIT_TOOLS_PATH . '/css/GridFieldBulkManager.css');
 		Requirements::javascript(BULK_EDIT_TOOLS_PATH . '/javascript/GridFieldBulkManager.js');
+		Requirements::add_i18n_javascript(BULK_EDIT_TOOLS_PATH . '/javascript/lang');
 		
 		if ( !count($this->config['actions']) )
 		{
@@ -324,11 +326,6 @@ class GridFieldBulkManager implements GridField_HTMLProvider, GridField_ColumnPr
     	'Colspan' => (count($gridField->getColumns()) - 1)
     );
 
-    if ( !$this->config['actions'][$firstAction]['config']['isAjax'] )
-    {
-    	$templateData['Button']['href'] = $gridField->Link('bulkaction') . '/' . $firstAction;
-    }
-
 		$templateData = new ArrayData($templateData);
 
 		return array(

javascript/GridFieldBulkManager.js

@@ -29,17 +29,30 @@
 			onunmatch: function(){				
 			},
 			onclick: function(e) {
+				$('#bulkSelectAll').prop('checked', '');
 			}
 		});
 		
-    $('.toggleSelectAll').entwine({
+    $('#bulkSelectAll').entwine({
       onmatch: function(){
 			},
 			onunmatch: function(){				
 			},
-      onclick: function(){
+      onclick: function()
+      {
         var state = $(this).prop('checked');
-        $(this).parents('.ss-gridfield-table').find('td.col-bulkSelect input').each(function(){$(this).prop('checked', state);});
+        $(this).parents('.ss-gridfield-table')
+        			 .find('td.col-bulkSelect input')
+        			 .prop('checked', state);
+      },
+      getSelectRecordsID: function()
+      {
+      	return $(this).parents('.ss-gridfield-table')
+				      				.find('td.col-bulkSelect input:checked')
+				      				.map(function() {  
+				      					return parseInt( $(this).data('record') )
+				      				})
+										  .get();
       }
     });
     
@@ -57,15 +70,6 @@
             $icon   = $parent.find('.doBulkActionButton .ui-icon')
 						;
 
-				if ( config[value]['isAjax'] )
-				{
-					$btn.removeAttr('href');
-				}
-				else{
-					$btn.attr('href', $btn.data('url')+'/'+value);
-				}
-
-
 				$.each( config, function( configKey, configData )
 				{
 					if ( configKey != value )
@@ -87,42 +91,40 @@
 			} 
 		});
 		
-		//@TODO prevent button click to call default url request
 		$('.doBulkActionButton').entwine({
 			onmatch: function(){
 			},
 			onunmatch: function(){				
 			},	
-			onmouseover: function(){
+			onclick: function(e)
-				var action, ids = [];
-				action = $(this).parents('.bulkManagerOptions').find('select.bulkActionName').val();
-				if ( action == 'edit' )
 			{
-					$(this).parents('.ss-gridfield-table').find('td.col-bulkSelect input:checked').each(function(){
+				var $parent = $(this).parents('.bulkManagerOptions'),						
-						ids.push( parseInt( $(this).attr('name').split('_')[1] ) );
+						$btn = $parent.find('a.doBulkActionButton'),
-					});
+
-					if(ids.length > 0) $(this).attr('href', $(this).data('url')+'/'+action+'?records[]='+ids.join('&records[]=') );
+						action = $parent.find('select.bulkActionName').val(),
+						config = $btn.data('config'),
+
+						url = $(this).data('url'),	
+
+						ids = $('#bulkSelectAll').getSelectRecordsID(),
+						data = { records: ids },
+
+						cacheBuster = new Date().getTime()
+						;
+
+				if ( ids.length <= 0 )
+				{
+					alert( ss.i18n._t('GridFieldBulkTools.BULKACTION_EMPTY_SELECT') );
+					return;
 				}
-			},			
-			onclick: function(e) {
-				var action, url, data = {}, ids = [], cacheBuster;
-				action = $(this).parents('.bulkManagerOptions').find('select.bulkActionName').val();
 
-				if ( action != 'edit' )
+				if ( config[action]['isAjax'] )
 				{
-					url = $(this).data('url');
+					//if ( url.indexOf('?') !== -1 ) cacheBuster = '&cacheBuster=' + cacheBuster;
-					cacheBuster = new Date().getTime();
+					//else cacheBuster = '?cacheBuster=' + cacheBuster;
-          
-					$(this).parents('.ss-gridfield-table').find('td.col-bulkSelect input:checked').each(function(){
-						ids.push( parseInt( $(this).attr('name').split('_')[1] ) );
-					});				
-					data.records = ids;
-
-					if ( url.indexOf('?') !== -1 ) cacheBuster = '&cacheBuster=' + cacheBuster;
-					else cacheBuster = '?cacheBuster=' + cacheBuster;
 
 					$.ajax({
-						url: url + '/' + action + cacheBuster,
+						url: url + '/' + action + '?cacheBuster=' + cacheBuster,
 						data: data,
 						type: "POST",
 						context: $(this)
@@ -130,6 +132,19 @@
             $(this).parents('.ss-gridfield').entwine('.').entwine('ss').reload();
 					});
 				}
+				else{
+					var records = 'records[]='+ids.join('&records[]=');
+
+					if ( window.location.search )
+					{
+						url = url + '/' + action + window.location.search + '&' + records + '&cacheBuster=' + cacheBuster;
+					}
+					else{
+						url = url + '/' + action + '?' + records + '&cacheBuster=' + cacheBuster;
+					}
+
+					window.location.href = url;
+				}
 				
 			} 
 		});

javascript/lang/en_US.js

@@ -4,6 +4,7 @@ if(typeof(ss) == 'undefined' || typeof(ss.i18n) == 'undefined') {
 	ss.i18n.addDictionary('en_US', {
 		'GridFieldBulkTools.FINISH_CONFIRM': "You have unsaved changes. Continuing will loose all unsaved data.\n\nDo your really want to continue?",
 		'GridFieldBulkTools.EDIT_CHANGED': 'Modified',
-		'GridFieldBulkTools.EDIT_UPDATED': 'Saved'
+		'GridFieldBulkTools.EDIT_UPDATED': 'Saved',
+		'GridFieldBulkTools.BULKACTION_EMPTY_SELECT': 'You must select at least one record.'
 	});
 }

javascript/lang/fr_FR.js

@@ -4,6 +4,7 @@ if(typeof(ss) == 'undefined' || typeof(ss.i18n) == 'undefined') {
 	ss.i18n.addDictionary('fr_FR', {
 		'GridFieldBulkTools.FINISH_CONFIRM': "Vous avez des changements non enregistrés. En continuant vous allez perdre toutes vos données non enregistrées.\n\nVoulez-vous vraiment continuer?",
 		'GridFieldBulkTools.EDIT_CHANGED': 'Changé',
-		'GridFieldBulkTools.EDIT_UPDATED': 'Enregisté'
+		'GridFieldBulkTools.EDIT_UPDATED': 'Enregisté',
+		'GridFieldBulkTools.BULKACTION_EMPTY_SELECT': 'Vous devez séléctionner au moins un élément.'
 	});
 }

javascript/lang/nl_NL.js

@@ -4,6 +4,7 @@ if(typeof(ss) == 'undefined' || typeof(ss.i18n) == 'undefined') {
 	ss.i18n.addDictionary('nl_NL', {
 		'GridFieldBulkTools.FINISH_CONFIRM': "Er zijn niet-opgeslagen wijzigingen.\n\nDoorgaan zal al deze niet-opgeslagen wijzigingen vergeten.\n\nWeet je zeker dat je de pagina wilt verlaten?",
 		'GridFieldBulkTools.EDIT_CHANGED': 'Aangepast',
-		'GridFieldBulkTools.EDIT_UPDATED': 'Opgeslagen'
+		'GridFieldBulkTools.EDIT_UPDATED': 'Opgeslagen',
+		'GridFieldBulkTools.BULKACTION_EMPTY_SELECT': 'U moet minstens een item te selecteren.'
 	});
 }

templates/BulkManagerButtons.ss

@@ -2,12 +2,12 @@
 	<th class="extra bulkmanagerheading" colspan="$Colspan">
 		
 		$Menu
-		<a <% if $Button.href %>href="$Button.href"<% end_if %> data-url="$Button.DataURL" data-config="$Button.DataConfig" class="doBulkActionButton action ss-ui-button cms-panel-link" data-icon="$Button.Icon">
+		<a data-url="$Button.DataURL" data-config="$Button.DataConfig" class="doBulkActionButton action ss-ui-button cms-panel-link" data-icon="$Button.Icon">
 			$Button.Label
 		</a>
 
 	</th>
 	<th class="extra bulkmanagerselect">
-		<input class="toggleSelectAll no-change-track" type="checkbox" title="$Select.Label" name="toggleSelectAll" />
+		<input id="bulkSelectAll" class="no-change-track" type="checkbox" title="$Select.Label" name="toggleSelectAll" />
 	</th>
 </tr>