I have written a front end Django/Python application. It's like a syncing tool. Users can first browse the source and destination. Source is client's computer and destination is server's computer. The interface is similar to grsync. I need to implement it in the template(front-end application). How can I do this? Thanks
EDIT:
I have this in my form.html(template for Django)
<form>
<p>Session Name: <input type="text" name="session"></p>
<p>Source: <input type="text" name="target"><input type="submit" value="Open"></p>
<p>Target: <input type="text" name="target"><input type="submit" value="Open"></p>
<input type="submit" value="Save">
<input type="button" name="Cancel" value="Cancel" onclick="window.location = 'form.html' " />
</form>
Now when the user click on the open in the source the files and folders in the client's computer should be shown and when user press OK the path should be loaded in the Source field.
Try this:
<form>
<p>Session Name: <input type="text" name="session"></p>
<p>Source: <input type="file" name="source"/></p>
<p>Target: <input type="text" name="target"/></p>
<input type="submit" value="Save">
<input type="button" name="Cancel" value="Cancel" onclick="window.location = 'form.html' " />
</form>
You need to have <input type="file"> to bring up a filepicker. But if you're uploading to a server, the user won't be able to bring up a filepicker for the server the same way they can for files on their own machine. You'll have to write your own interface for searching through the remote filesystem visually, unless you can find a plugin for it somewhere. Without a filepicker, the text field input for target should at least enable the user to type in what they want the name of their file to be on the server. Hope that answers the question!
Related
So, last few days I was trying to build a website where you input the post data then hit submit and then boom your post appears on the home page/post page.
So, I have created the form but the problem is that I don't know how to send HTML form data to SQLite database so it can be viewed by multiple users anytime.
<form class="posts" action="." method="post">
<h2>Title</h2>
<input type="text" name="title" placeholder="Title">
<h2>Description</h2>
<textarea input class="des" name="description"type="text" placeholder="Description"></textarea>
<h2>Image(Optional)</h2>
<input type="file" name="inpFile" id="inpFile" class="img-btn">
<div class="img-prev" id="imgPrev">
<img src="" alt="Image Preview" class="img-prev__img">
<span class="img-prev__def-text">Image Preview</span>
</div>
<input type="submit" value="Submit">
</form>
I think that you should take a look at some Python's web-frameworks like Flask or Django first, so that you can understand this subject a little clearer.
Getting a 400, when trying to upload a file ad send other form elements to flask from html. Tried to use ajax, but that throws me an error as well.
Python:
#app.route('/prod_diff_result', methods=['POST', 'GET'])
def prod_diff_result():
try:
host = request.form['host-prod-iterator']
print(host)
if request.files['file']:
f = request.files['file']
f.save(secure_filename(f.filename))
HTML:
<div class="main-div">
<form action="/prod_diff_result" method="POST" enctype="multipart/form-data">
<div class="grid-container">
<div class="grid-item">
<span class="label label-default ">PROD</span><br>
<p>Iterator Host : <input type="text" class="form-control" id="host-prod-iterator" value="10.47.7.57"
required></p>
<input type="radio" name="data_fetch_type" value="file" onclick="showfile()">Upload File
<input type="file" name="file" />
<input type="radio" name="data_fetch_type" value="db"> Get from DB
<input type="submit" />
</div>
</form>
</div>
I want to be able send hostname and file back to flask error in one request and using one form.
It gives an error because you try to access a form field that it cannot find, and assumes that somehow the request was bad, because it didn't include a required form field. You are trying to access:
host = request.form['host-prod-iterator']
However you have simply not given it a name in your HTML. If you give it a name, it should work:
<p>Iterator Host :
<input type="text" class="form-control" name="host-prod-iterator" id="host-prod-iterator" value="10.47.7.57" required>
</p>
I got a home page with parameters that the user (client) enter to forms. (File named page2.htm)
In addition, I got a new_1.py file, that contains one big function, that run by 4 parameters.
What I want, is to communicate between all files. What means that when I press the submit button on page2.htm, all 4 parameters will sent to new_1.py file, and the Python function will return the values to HTML, for example: page3.htm.
How can I do it?
You can use some web microframework like Bottle or Flask.
Using Bottle your page2.html you will have:
<form action="/update" method="POST">
<input type="text" size="10" maxlength="10" name="par_1"><br />
<input type="text" size="10" maxlength="10" name="par_2"><br />
<input type="text" size="10" maxlength="10" name="par_3"><br />
<input type="text" size="10" maxlength="10" name="par_4"><br />
<input type="submit" name="save" value="save">
</form>
Your page3.html will be:
<p>
par_1: {{par_1}}
par_2: {{par_2}}
par_3: {{par_3}}
par_4: {{par_4}}
</p>
In your new_1.py you will make a GET method to show you the form:
#route('/')
def index():
return template('page2')
And a POST method that the form is calling in /update route:
#route('/update', method='POST')
def update():
val1 = request.forms.get('par_1')
val2 = request.forms.get('par_2')
val3 = request.forms.get('par_3')
val4 = request.forms.get('par_4')
# Do something
return template('page3', par_1=val1, par_2=val2, par_3=val3, par_4=val4)
You will then go to localhost:8080 to see the form.
For more on how to setup Bottle go to http://bottlepy.org/docs/dev/index.html
Note that Bottle uses .tpl (template) extension instead of .html. I think it will work fine with .html, but if not, change your htmls to .tpl
So, I've hacked this together from a few sources, so if I'm totally going about it the wrong way I welcome feed back. It also occurs to me that this is not possible, as it's probably a security check designed to prevent this behavior being used maliciously.
But anyway:
I have a form on our Django site where people can request to change the name of one of our items, which should automatically create a jira ticket. Here's the form:
<form target="_blank" action='http://issues.dowjones.net/secure/CreateIssueDetails!init.jspa' method='get' id='create_jira_ticket_form'>
<a id='close_name_change_form' class="close">×</a>
<label for="new_name">New name: </label>
<input id="new_name" type="text" name="new_name" value="{{item.name}}">
<input type="hidden" value="10517" name="pid">
<input type="hidden" value="3" name="issuetype">
<input type="hidden" value="5" name="priority">
<input type="hidden" value="Change name of {{item.name}} to " name="summary" id='summary'>
<input type="hidden" value="{{request.user}}" name="reporter">
<input type="hidden" value="user123" name="assignee">
<input type="hidden" value="" name="description" id="description">
<input id='name_change_submit' class="btn btn-primary btn-sm" type="submit" value="Create JIRA ticket">
</form>
Then I have a little JS to amend the fields with the new values:
$(document).ready(function(){
$('#create_jira_ticket_form').submit(function(){
var watchers = ' \[\~watcher1\] \[\watcher2\]';
var new_name = $('#new_name').val();
var summary = $('#summary').val();
$('#summary').val(summary + new_name);
$('#description').val(summary + new_name + watchers);
})
})
It comes very close to working, but the description field is escaped, leaving it looking like:
Change name of OLDNAME to NEWNAME %5B%7Ewatcher1t%5D %5B%7Ewatcher2%5D
Which is less than helpful. How can I keep it as is so I can add watchers?
This happens when your form encodes the fields and values in your form.
You can try this out by this simple snippet:
console.log($('form').serialize());
you should see something like
description=ejdd+%5B~watcher1%5D+%5Bwatcher2%5D
in order to prevent this you should change your method='get' to method='post'.
The encoding happens because it's apart of HTTP, read here why
You can also read the spec paragraph
17.13.3 Processing form data
I have the following HTML code:
<form method="post">
<h5>Sports you play:</h5>
<input type="checkbox" name="sports_played" value="basketball"> basketball<br>
<input type="checkbox" name="sports_played" value="football"> football<br>
<input type="checkbox" name="sports_played" value="baseball"> baseball<br>
<input type="checkbox" name="sports_played" value="soccer"> tennis<br>
<input type="checkbox" name="sports_played" value="mma"> MMA<br>
<input type="checkbox" name="sports_played" value="hockey"> hockey<br>
<br>
<input class="btn" type="submit">
</form>
And then ideally I would like to have the following python serverside code:
class MyHandler(ParentHandler):
def post(self):
sports_played = self.request.get('sports_played')
#sports_played is a list or array of all the selected checkboxes that I can iterate through
I tried doing this by making the HTML sports_played name and array, sports_played[], but that didn't do anything and right now it just always returns the first selected item.
Is this possible? Really I just don't want to have to do a self.request.get('HTML_item') for each and every checkbox incase I need to alter the HTML I don't want to have to change the python.
Thanks!
The answer is shown in the webapp2 docs for the request object:
self.request.get('sports_played', allow_multiple=True)
Alternatively you can use
self.request.POST.getall('sports_played')
The name of the inputs should have [] at the end so that they are set to the server as an array. Right now, your multiple checkboxes are being sent to the server as many variables with the same name, so only one is recognized. It should look like this:
<form method="post">
<h5>Sports you play:</h5>
<input type="checkbox" name="sports_played[]" value="basketball"> basketball<br>
<input type="checkbox" name="sports_played[]" value="football"> football<br>
<input type="checkbox" name="sports_played[]" value="baseball"> baseball<br>
<input type="checkbox" name="sports_played[]" value="soccer"> tennis<br>
<input type="checkbox" name="sports_played[]" value="mma"> MMA<br>
<input type="checkbox" name="sports_played[]" value="hockey"> hockey<br>
<br>
<input class="btn" type="submit">
</form>
Now, if you select more than one, the values will be sent as an array.
Although this answer is not related to this question, but it may help all the django developers who is walking here and there.
In Django request.POST is a QueryDict object. So you can get all the values as list by following way
request.POST.getlist('sports_played')
N.B: This only works in Django