I have flask application via python. In my page, there is three images but flask only shows one of them.
I could not figure out where is the problem.
Here is my code.
HTML
<div class="col-xs-4">
<img style="width:40%;padding:5px" src="static/tomato.png"/>
<br>
<button class="btn btn-warning"><a style="color:white;" href="http://127.0.0.1:5000/detect">Tomato Analysis</a></button>
</div>
<div class="col-xs-4">
<img style="width:40%;padding:5px" src="static/grapes.png"/>
<br>
<button class="btn btn-warning"><a style="color:white;" href="http://127.0.0.1:5000/detect">Grape Analysis</a></button>
</div>
PYTHON
#app.route("/main")
def index():
return render_template('gui2.html')
It shows tomato.png but it did not sohws the grapes.png, what is the problem of it and how can I solve it.
Also I am using electron.js. After running python script, I am running nmp start.
The error is output is:
GET /%7B%7B%20url_for('static',%20filename%20=%20'image/corn2.png')%20%7D%7D HTTP/1.1" 404 -
Any help is appreciated...
Thanks
You can change the route main to mainPage. Try below code
#app.route("/mainPage")
def index():
return render_template('gui2.html')
The error message 404 clear tells that the resource you are looking for was not found in the given location. Make sure that the file exists on the path you give. Simply, as tomato.png file is displayed correctly, just make sure that other files are also in the same location as tomato.png
Try opening in Incognito or private browser.
Related
I was hoping to change the icons and text being used in the navigation bar in apache airflow. When I do inspect element, I get that pin_100.png is being used. I was hoping to change this to a custom image and title. Where do I edit files for this? I am guessing this has something to do with flask views (?) but I'm not certain.
I see from here that the flask template base view should be modified (?). I still can't figure out how.
I would like to change the "Airflow" text, and the icon, to my custom text and icon.
EDIT: For more clarity, I just found this. This is what I want to modify
<img style="float: left; width:35px; margin-top: -7px;"
src="{{ url_for("static", filename="pin_100.png") }}"
title="{{ current_user.username }}">
<span>
Airflow
</span>
I want to change the filename and Airflow
It resides in https://github.com/apache/airflow/blob/master/airflow/www/templates/appbuilder/navbar.html
I'm using bottle (the python webframework) to familiarize myself with html, js and css and using localhost to access the site. I can't quite get the css file to be applied to the site that the templates link to. Sometimes it works, but when I edit the file, it doesn't update and even loses the file and can't find it, even after restarting the server. The Console gives the 404 error (file not found), even though I have not moved it.
I first noticed the issue when the CSS wouldn't update in the browser when I refreshed. After clearing out the cache every time I edited, I found the 404 not found issue. I've validated the css file to check if a synthax error was the issue. It came back clean. I redownloaded the bottle.py file in case it needed an update. Still the same result. I also triple checked the link path, even tried to put them all into the same folder with no change.
Here is my file structure:
project folder
static
css
main.css
views
home.tpl
bottle.py
server.py
start.bat (starts the server)
Here is the code in server.py
from bottle import route, run, template
#route('/')
def home():
return template('home')
run(host='localhost', port=8080, debug='True', reloader='True')
Here is the template home.tpl:
<!DOCTYPE html>
<html>
<head>
<title>Bottle Site</title>
<link rel="stylesheet" type="text/css" href="/static/css/main.css" />
</head>
<body>
<div id="wrapper">
<div id="header">
<h1>Header!</h1>
</div>
<div id="navigation">
<ul>
<li>Home</li>
</ul>
</div>
<div id="section">
Section text!
</div>
<div id="footer">
© 2019 - <b href="#" id="dev">Footer/b>
</div>
</div>
</body>
</html>
I'd like to reliably be able to apply the css to the site without it crashing and sometimes not finding the file. Whenever I paste a fresh copy of my css file and start the server, it works fine until I try and change the file (a background color, for example. Nothing syntax breaking) but it doesn't update. when I clear the cache, it turns into a plane html file and the console reads:
"GET /static/css/main.css HTTP/1.1" 404 764
I just figured it out.
In the server.py file, you apparently need a:
#route('/static/<filename:path>')
def send_static(filename):
return static_file(filename, root='./static/')
to give the server a route that it can access and find the files (i think).
So in the templates, to show it where they are, you can say:
<link rel="stylesheet" type="text/css" href="/static/css/main.css" />
And it will work fabulously every time. :)
Why without the route it sometimes found the file and sometimes not will forever be a mystery of computer science.
Routes are hard.
Have a nice day! :)
I also like to use whitenoise with bottle.
from whitenoise import WhiteNoise
...
botapp = WhiteNoise(botapp)
botapp.add_files(staticfolder, prefix='static/')
I am new to Django and I have a Django application where once you upload few excel files, it does a background calculation and saves the results in an excel file. I need to show those excel files with minimal processing in the Django home page as datatable. I tried django-excel package with Iframe to do so. I am not not able to get the page. Please suggest if the code below needs to be modified. Is there any other ways to solve this problem?
In views.py:
import django_excel as excel
import pyexcel as p
def show_result_files(request,foldername,outputfilenames):
file_path = path + '/Data/' + foldername
if os.path.isfile(file_path + 'Final_Results.xlsx'):
for afile in request.FILES.getlist(outputfilenames):
combined_sheet = p.get_sheet(file_path + '2020MY EWPR Combined Parts List Final.xlsx')
combined_sheet.save_as(afile.sortable.html)
from IPython.display import IFrame
IFrame("afile.sortable.html", width=600, height=500)
In home.html:
<div class="inline col-md-9" id="showFinalResults">
<form method="POST" name="showCombined" action="">{% csrf_token %}
<button name="showCombined" type="submit" class="btn btn-primary">Combined Parts List</button>
</form>
</div>
<div class="inline col-md-9" id="showFinalResults">
<form method="POST" name="showCombined" enctype="multipart/form-data" action=''>{% csrf_token %}
<div class="col">
<div class="row">
<span class="btn btn-primary btn-file">
Combined Parts List <input name="SparrowFiles" id="Sparrow" type="file" multiple="">
</span>
<button name='upload_Sparrow' type="submit" class="btn btn-secondary js-upload-files" data-toggle="modal" data-target="#modal-progress_sp"">Go</button>
</div>
</div>
</form>
</div>
What I want the resulting excel file displayed in the Home page when a "showCombined" button is clicked
There are various options, depending on whether you want the spreadsheet data to be accessiblew to users who cannot use excel, or not.
The most general is for the button to be a hyperlink that invokes a Django view which renders the spreadsheet data as an HTML <table>. There is a completely awesome JavaScript called DataTables that can make such a table almost as functional as Excel insofar as display is concerned. Very easy to use: start simple, then add tweaks until perfected. Absolutely loads of examples available (and much support with it on StackOverflow).
Another is for the computation which saves its results as Excel to also save as pdf alongside, and to serve up the pdf in that hyperlink.
Finally, you can make the target of the link the xlsx file itself, and the user's browser will ask how to open it if Excel is not already set up as default (which it probably will be, on a Windows box. On a Linux box LibreOffice Calc will probably accomplish much the same.).
I'm extremely inexperienced with html and although I know python, I had never used django before this. I'm trying to set up a simple website where the user can view some code on the left side of the screen and enter some text about it on the right side of the screen. The code can be pretty long sometimes so the webpage scrolls, but I want the textbox to always be present even if you scroll up or down. As my code is now, the textbox is on the right side of the screen, but it always stays at the bottom. Here's a screenshot of what it looks like:
(can't seem to get screenshot to show up in the post, here's the link http://imgur.com/3JfgHH3)
Here's the .html file I'm using in my templates directory in django:
<div style="display: inline-block">
{% if error_message %}<p><strong>{{ error_message }}</strong></p>{% endif %}
<pre>{{ source_code }}<pre>
</div>
<div style ="display: inline-block" >
<form method="post" action="/labeling/{{ document_id }}/send/">
{% csrf_token %}
<input type="text" name="textfield">
<input type="submit" value="Finish" name="finish_btn" />
</form>
</div>
Sorry for my complete lack of html knowledge. How would I fix this either in django or in the html file directly so that the textbox and button move up and down with the scrolling, instead of being permanently attached to the bottom right of the screen? If necessary I can post the django code too, I just wasn't sure if this was possible directly in html.
<div style ="display: inline-block;position: fixed;" >
Implement position: fixed; into your styling of the first div. That should already do the trick. Like #furas said is - when it comes to styling - CSS the language you have to learn.
In the CSS file please add the following Code:
div.[class_name_of_div_element] {
position: fixed;
}
I need to get the user input in a textbox and process it using my python script when user presses Submit button. Unfortunately I am using an external server that does not support CGI. Is there any other way I can do this? This is my sample HTML.
<body>
<form name="form1" method="post" action="script1.py">
<div id="heading"><big><big><big>My analysis</big></big></big></div>
<textarea cols="50" rows="1" name="Query_text" id="Query_text"></textarea>
<div id="Button"><input name="Submit" value="Submit" type="submit"></div>
</form>
</body>
You can do the form processing with Javascript but hopefully you don't want to save this input beyond the next page the person accesses. Another old school option is emailing yourself the contents of Query_text. But honestly this is a lot more work than you want to do and not worth the effort (for most people). What you need is a new web host.