- Back to Docs
- Install and Configure
- Image
- Server Upload
- Server Delete
- S3 Upload
- Resize
- Validation
- Image Manager
- Simple Server
- File
- Server Upload
- Server Delete
- S3 Upload
- Validation
- References
- Image
- File
- S3
Python File Server Delete
How it works
- Your code intercepts the file being removed from the javascript editor.
- When an file is removed, a request is made to the server telling it to delete the file from disk.
- Once the request hits the server, it deletes the file.
Intercept file being removed
When an file is being removed from the javascript editor, it triggers two events: froalaEditor.file.beforeRemove
and froalaEditor.file.removed
. You could use either of them to delete the file from server, however we recommend the second one because at that point you're sure that the file was removed from the editable area.
Send request to the server
There is no built-in feature that makes the request to the server, however it can easily be done using an AJAX request.
<script> $(function() { // Catch the file being removed. $('.selector').on('froalaEditor.file.unlink', function (e, editor, file) { $.ajax({ // Request method. method: 'POST', // Request URL. url: '/delete_file', // Request params. data: { src: file.getAttribute('href') } }) .done (function (data) { console.log ('File was deleted'); }) .fail (function (err) { console.log ('File delete problem: ' + JSON.stringify(err)); }) }); }); </script>
Delete the file
The server implementation is responsible for receiving the request and handling it appropriately. Using the code from the previous step, makes the file path available in the body of the request: request.body.src
. The File.delete
method from the Python SDK is expecting the path of the file to remove from disk.
Note: The path of the file is relative to the root of your application.
File.delete(src)
Complete Example
<script> $(function() { // Catch the file being removed. $('.selector').on('froalaEditor.file.unlink', function (e, editor, file) { $.ajax({ // Request method. method: 'POST', // Request URL. url: '/delete_file', // Request params. data: { src: file.getAttribute('href') } }) .done (function (data) { console.log ('File was deleted'); }) .fail (function (err) { console.log ('File delete problem: ' + JSON.stringify(err)); }) }); }); </script>
# Django from django.http import HttpResponse import json from froala_editor import File def delete_file(request): src = request.POST.get('src', '') try: File.delete(src) return HttpResponse('ok', content_type="application/json") except: raise Exception('Could not delete file')
# Flask from flask import request import json from froala_editor import File @app.route('/delete_file', methods=['POST']) def delete_file(): src = request.form.get('src') try: File.delete(src) return json.dumps('ok') except: raise Exception('Could not delete file')
# Pyramid from pyramid.response import Response import json from froala_editor import File def delete_file(request): src = request.POST.get('src') try: File.delete(src) return Response(json.dumps('ok')) except: raise Exception('Could not delete file')