I'm drawing on a canvas and then I upload the drawing to a database (Django). I have made this work by creating a Blob and sending a Form with XMLHttpRequest. But once uploaded, how do I navigate to the page that shows this new file? I would like the server to send a redirect, but that doesn't work and apparently that's not how you should do it. But how otherwise?
Here's the Javascript:
function submitFunction() {
canvas = document.getElementById('myCanvas');
var dataURL = canvas.toDataURL("image/jpeg");
form = document.getElementById('myForm');
formData = new FormData(form);
blob = dataURItoBlob(dataURL);
url = window.location.href;
xhr = new XMLHttpRequest();
xhr.open('POST', url, true);
formData.set('artwork_img', blob, 'artwork.jpeg');
xhr.send(formData);
}
And here's the Django View:
def create (request, id):
artwork = get_object_or_404(Artwork, pk=id)
context = {'artwork' : artwork}
if request.method == 'POST':
form = ArtworkForm2(request.POST, request.FILES)
if form.is_valid():
newChild = Artwork()
newChild.parent = artwork
newChild.artwork_img = form.cleaned_data['artwork_img']
newChild.artwork_title = form.cleaned_data['artwork_title']
newChild.ancestors = artwork.ancestors+1
newChild.save()
newChild.updateAncestors()
# ---> this is kind of what I'd like to do:
return redirect('showwork', newChild.id)
else:
print(form.errors)
else:
form = ArtworkForm2()
context.update({'form' : form})
return render(request, 'exp/create.html', context)