Recently, while working on a project, I encountered a need to download an XLS file upon clicking a button. Due to the large volume of data involved, we opted to use Drupal's Batch system to generate the file, minimizing the risk of errors such as page timeouts or memory issues.
Typically, initiating a batch process redirects to the batch window, which can disrupt user experience and confuse non-technical users. To enhance usability, we implemented an AJAX callback to start the batch process without redirecting to the batch window, thereby improving clarity and user interaction.
For example
Let’s take a very generic scenario, in which the node title will be updated(prepend “Update” text before node title) by a batch process based on the content type selected in the form by the user.
Default Batch process workflow: Here you can notice when the batch initiates the execution, and then redirects to the batch page.
Batch process workflow: that initiates using Ajax request
Here you can notice when the batch initiates the execution, then remains on the same page (i.e. desired behavior that tried to be achieved)
Implementation steps to run batch through jquery ajax request
1. Create custom module in which custom_module.routing.yml file will be created
in which batch API endpoints path will be defined
2. Create controller in which batch API executing code will be added that defined in custom_module.routing.yml file
Here: “BatchBuilder()” called & “setFinishCallback()” defined
Added below custom logic:
check whether therequest to batch controller by
post method or not so that the batch process not redirect to the batch
window itself (i.e. by default core functionality)
“batch_set()” called then gets currently completed “batch” object using “batch_get()”
Then get “batch id” from the batch object , pass to the returned ajax response.
Make sure return “ajax response” (as this endpoint 'll be call/initiate by ajax request: step-4)
3. Create custom_module.libraries.yml file & attach library file to the page.
4. Then call the batch API endpoint through jquery ajax request that initiates batch process
for eg: “click on download btn” call the batch API endpoint using ajax request
5. After the batch completed its execution by checking progress of batch 100%, then call the batch finished callback endpoint through the jquery ajax request
Note: if you ‘ll skip above mentioned step 5, then code added in batch finished callback ‘ll never execute.
Let's take example : I want to “export xls” file so I 'll add the code for "write the file content in xls file" in custom function of batch API & download file code 'll be written in the finish callback of batch API
In this scenario if we skip the step5 then file 'll never 'll be download
In similar fashion, this step is taken care/execute by the default implementation of Batch API, can observe in this file:
root_folder_project/web/core/misc/batch.js
User interactive batch
If you want to pass some dynamic user selected values to batch then you need to add some additional steps along with above mentioned steps
1. Create custom form & on submit form, call the ajax callback which ‘ll send user submit data from “form to jquery”.
Buildform(): where click on submit button, ajax callback “nodeUpdateBatchCallback()” called
Note: Make sure attached jquery file to the form so that call the batch process
Ajax callback(): Click on submit button, pass the user selected value to js using ajax “SettingsCommand” command.
2. Then in the attached jquery file get the user submit form values & pass these values to the batch controller by jquery ajax post request.
Get user submitted values from “form to js” using following code:
Here “Settings.user_submit_val.fields” defined the in “form file” then pass these values to the ajax request
3. Fetch the user submit form values in batch controller & use it as per requirementGet user submitted values from “request” object using following code:
$all_values = $request->request->all();
$fields = $all_values['fields'];
Here “fields” denotes variables that are defined in the js file to pass data to the batch while calling batch API endpoint.
Conclusion
Batch can run in the same window without redirection to the batch window itself by using an approach in which initiates the batch process using ajax.
This approach allows you to leverage the core Batch API implementation & integration to desired functionality that gives better user interface experience to end users while interacting/performing following actions which are implemented using Batch API:
Download csv file,
Updating data in bulk, etc.
Reference links: To get more detail about the batch process, can follow links:
* Github Demo link : Demo example, in this eg. node title data 'll updated on the basis of content type selected in the form by the user by batch process that initiates using ajax request.
* Batch API: documentation