html forms download file django - html

I am stuck with this issue in Django: I want to download a file already existing on my server through a html form. The file to be downloaded is served through a function in views. My problem is with html form and passing the file name to view. How can I pass the name of the file from form toward view without having to select the file?
In html I have:
# 'content' keeps the name of the file to be downloaded
{% block content %}
{{content}}
<table>
<tr>
<td>
<form action="" method="POST" enctype="multipart/form-data">
<input type="file" name="file"/>
<br />
<input type="submit" value="Download File" />
</form>
</td>
</tr>
</table>
{% endblock %}
When I select the file and press submit button, it works but I need a different behavior: the name of the file containing results (downloadable file) to be passed to views into a variable. The views will then serve it.
The view which handled the downloadable file:
def forecast(request):
if request.method == 'POST':
#handle_download_file(request.FILES['file'], str(request.FILES['file']))
print('request.method este: ',request.method)
RESULTS_filename = 'frcst_'+ str(request.FILES['file'])
#download('GET', RESULTS_filename)
file_path = os.path.join(os.path.relpath('forecast/'), RESULTS_filename)
print (file_path)
print(settings.MEDIA_ROOT)
with open(file_path,'rb') as fh:
response = HttpResponse(fh.read(), content_type="application/vnd.ms-excel")
response['content-disposition'] = 'attachment; filename='+RESULTS_filename
print(response)
return response
HttpResponseRedirect('/forecast/')
return render(request,'result_links.html',{'content':'frcst_history.csv'})

Related

django: html form submit without jumping into new page or refreshing/reloading

I am new to django and html. below is my first test web page of a simple online calculator.
I found a problem that when clicking the "submit" button, it tends to jump to a new web page or a new web tab. this is not what I want. Once the user input the data and click "submit" button, I want the "result" field on the page directly show the result (i.e. partially update only this field) without refresh/jump to the new page. Also I want the user input data kept in the same page after clicking "submit".
I saw there might be several different ways to do this work, iframe/AJAX. Since I am new, what is the really simplest way to achieve this goal? BTW, I dont write javascripts.
html:
<form method="POST">
{% csrf_token %}
<div>
<label>num_1:</label>
<input type="text" name="num_1" value="1" placeholder="Enter value" />
</div>
<div>
<label>num_2:</label>
<input type="text" name="num_2" value="2" placeholder="Enter value" />
</div>
<br />
<div>{{ result }}</div>
<button type="submit">Submit</button>
</form>
view.py
def post_list(request):
result = 0
if request.method == "POST":
num1 = request.POST.get('num_1')
num2 = request.POST.get('num_2')
result = int(num1) + int(num2)
print(request.POST)
print(result)
context = {
'result': result
}
return render(request, 'blog/post_list.html', context)
This is a simple example of using Ajax, which I hope will be useful to you.
first you need change post_list view:
view
from django.http import JsonResponse
def post_list(request):
if request.method == "POST":
num1 = request.POST.get('num_1')
num2 = request.POST.get('num_2')
result = int(num1) + int(num2)
return JsonResponse({"result":result})
else:
return render(request, 'blog/post_list.html', context={"result":0})
I use JsonResponse because I just want to get the result data in ajax and display it in the html , for GET request render the html file and for POST request use JsonResponse to return a json like context.
And your html file should to be a look like this:
html
<script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
<form method="POST" id="post-form">
{% csrf_token %}
<div>
<label>num_1:</label>
<input type="text" name="num_1" value="1" placeholder="Enter value" />
</div>
<div>
<label>num_2:</label>
<input type="text" name="num_2" value="2" placeholder="Enter value" />
</div>
<br />
<div id="result" >{{ result }}</div>
<button type="submit" >Submit</button>
</form>
<script>
$(document).ready(
$('#post-form').submit(function(e){
e.preventDefault();
var serializedData = $(this).serialize();
$.ajax({
type:"POST",
url: "/your_url/",
data: serializedData,
success: function(data){
$("#result").text(data["result"]);
}
});
})
);
</script>
First I added jQuery cdn and then your html file, except that I added attribute id=post-form to the form and added id=result, then <script> tag was added and jquery function inside the tag was execute when your form Submited(detect event by the id #post-form).
And get the data(num_1, num_2) by serialize method then use Ajax to send POST reqeust to the view function(post_list), in Ajax you just need to pass serializedData and url(also you can use the Django url tag or set it in action form or...), After that we need to send data to the html(means the result data we received from the View).
in success function Ajax you can add html tag to your html file or
replace the some values,...
In Ajax, you must specify your URL to send the data.
for example if you have this url.py
urls.py
from .views import post_list
urlpatterns = [
path("posts_list/", post_list, name="post_list"),
]
In ajax you can add an address like this:
$.ajax({
type:"POST",
url: "/posts_list/",
....
Or
$.ajax({
type:"POST",
url: "{% url 'post_list' %}",
....
And if you have app_name in urls.py you can added url: "{% url 'app_name:post_list' %}",

How to send a string from python to HTML element using Flask

How to send a sting text data from a python script to a specific HTML element. So that I can display it to users clearly and in a certain place using Flask Python library.
python script
#app.route('/services', methods=['POST', 'GET'])
def upload_image():
if 'file' not in request.files:
flash('No file part')
return redirect(request.url)
file = request.files['file']
if file.filename == '':
flash('No image selected for uploading')
return redirect(request.url)
if file and allowed_file(file.filename):
filename = secure_filename(file.filename)
full_path = os.path.join(app.config['UPLOAD_FOLDER'], filename)
file.save(full_path)
# print('upload_image filename: ' + filename)
flash('Image successfully uploaded and displayed')
get_image(file.filename)
get_image_path()
data = 'render some text sting here'
print(data)
return render_template('services.html', filename=filename, dataToRender=data)
else:
flash('Allowed image types are -> png, jpg, jpeg, gif')
return redirect(request.url)
HTML
<form method="post" action="{{ url_for('upload_image') }}" enctype="multipart/form-data">
<label for="img" style="margin-bottom: 40px;font-size: 30px">choose image:</label>
<input type="file" onchange="preview(event)" autocomplete="off" required name="file"><br>
<img class="card-img-top" src="img/inttion.jpg" id="imgg" alt="Card image cap">
<p>
<input type="submit" value="Submit">
<h3>Your Recognition Result IS</h3>
<input type="text" name="result">
<h1>here is the result {{ dataToRender }}</h1>
</p>
</form>
To do what you are asking, you will have to make use of flask's ability to integrate with a templating engine (flask uses Jinja2 by default). This would look something like this:
In your main file with your routes in it, you will have to define a route on which you want to render a template
from flask import render_template
#app.route('/')
def index():
data = someFunction()
return render_template('index.html', dataToRender=data)
In another file called templates/index.html you will have to define the template and this is where you can dictate where the information that you provided will show up.
<!DOCTYPE html>
<title>Hello from Flask</title>
<h1>Hello {{ dataToRender }}!</h1>
I hope this helps. Flask also has some great documentation on the subject that can be found here

Issues in uploading image from user without django ModelForm

I am trying to create a form without using ModelForm. I using the input elements in HTML for the purpose (to upload name and image). But I am having trouble uploading images with this process.
The name is getting saved but not the image.
My code:
models.py
class Register(models.Model):
name = models.CharField(max_length=50, null=True)
idCard = models.FileField(upload_to='idCard', null=True)
views.py
def index(request):
if request.method == 'POST':
data.name = request.POST.get('name')
data.idCard = request.POST.get('idCard')
data.save()
return redirect('/')
return render(request, 'event/index.html')
index.html
<form class="mform" id="myform" method="POST" id="myform" action="" enctype="multipart/form-data">
{% csrf_token %}
<fieldset>
<legend>Registeration</legend>
<table cellspacing="0"><tbody>
<tr><td>
<label for="u_name"> Username :</label></td><td>
<input type="text" name="name" id="u_name">
<td>
</tr>
<tr><td>
<label for="u_img"> IDCard :</label></td><td>
<input type='file' accept='image/*' onchange='openFile(event)' name="idCard" id="u_img">
</td></tr>
The name is getting saved but not the image.
The files are stored in request.FILES:
def index(request):
if request.method == 'POST':
data.name = request.POST.get('name')
data.idCard = request.FILES.get('idCard')
data.save()
return redirect('/')
return render(request, 'event/index.html')
That being said, I strongly advise to use a Form (or ModelForm). A form does not just handle saving the object, it also performs proper validation, can return error messages, and removes a lot of boilerplate code. Often with some tweaking, you can let the form look like you want. But even if you manually write the form in the template, you can still use a form at the Django level to validate and save the object.

Invalid form when uploading file in Django

I need to upload file on a Django page, however, after following the official tutorial, I was not able to upload it, it always gives the error "invalid form", and when I tried to print out the error msg of the form, it says "This field is required".
One thing notable is: I have 2 forms on one page, one is this upload form and the other one is for filling out information. Not sure if this is the root cause.
I have tried all solutions provided on the Internet.
Template file:
<form id="uploadForm" action="" method="post" enctype="multipart/form-data">
{% csrf_token %}
{{ form.as_p }}
<input type="file" value="upload" name="sourcefile">
<button type="submit">Upload</button>
</form>
Forms.py:
from django import forms
from .models import SourceFile
class UploadFileForm(forms.ModelForm):
class Meta:
model = SourceFile
fields = ('file', 'title')
Models.py:
from django.db import models
# Create your models here.
class SourceFile(models.Model):
title = models.CharField(max_length=255, blank=True)
file = models.FileField(upload_to="media/")
Views.py
def model_form_upload(request):
if request.method == 'POST':
form = UploadFileForm(request.POST, request.FILES)
if form.is_valid():
instance = SourceFile(file_field=request.FILES['file'])
instance.save()
return JsonResponse({'error': False, 'message': 'Uploaded Successfully!'})
else:
print("Invalid form")
# return JsonResponse({'error': True, 'errors': form.errors})
else:
form = UploadFileForm()
return render(request, 'source_validation.html', {'form': form})
Your template is wrong. Either use {{ form.as_p }} which should display a file input field because file is a field in your form. (so remove the <input type="file" ...>)
Or don't use it and manually add the <input> fields, but then you must use the correct names. Your form expects a "file" parameter, not a "sourcefile" parameter:
<input type="file" name="file">
Also, you're overcomplicating things in your view (even though your current code will work if you fix your template):
if form.is_valid():
form.save() # this will save your model
return redirect(...)

How to save text input as a file in HTML and Django

I am building a site where users can input text and submit the text so that it can be saved and accessed as a file on the server. Unfortunately, I am not quite sure how I would take the inputted text and save it aas a file.
Could anyone point me in the right direction as to how I might do this or detail the steps I will have to take? Preemptive apologizes if I have missed an obvious Google result. Being somewhat new to Django, I may have inadvertently glossed over helpful resources.
Here is the relevant HTML, mostly a form copied from a file upload form:
<form name="myWebForm" id="submissionCode_codeEditor" action="uploadFile/" method="post" enctype="multipart/form-data">
<input type="hidden" name="MAX_FILE_SIZE" value="500" />
<input type="text" name="title" placeholder="File Name"/>
<input type="hidden" name="taskID" value={{ taskID }} />
<input type="submit" value="Submit This Code" />
</form>
Here is the relevant Django model:
class Upload(models.Model):
title = models.CharField(max_length=50)
fileUpload = models.FileField(upload_to='file_uploads')
userID = models.ForeignKey(User)
task = models.ForeignKey(Task)
uploadTime = models.DateTimeField(auto_now_add=True)
def __unicode__(self):
return self.title
You're looking for ContentFile. It's a Django File subclass that instantiates with a string of text instead of a literal file. You can then save the ContentFile to your FileField.
from django.core.files.base import ContentFile
content = ContentFile(some_text)
upload_instance.fileUpload.save('/path/to/where/file/should/save.txt', content)
upload_instance.save()
First of all create a file in your media folder using command, i am assuming user posted text with name content
from app.models import Upload
from django.conf import settings
content = request.GET("content")
file_object = open("%s/%s"%(settings.MEDIA_ROOT, filename),w) #Take file name as hash of content posted and username so that no class
upload = Upload(title=title, fileUpload=filename,user_id=request.user.id)
Your file is uploaded and can be acceseed using MEDIA_URL from settings