I have a webpage using the Dimension template, this template uses "popups" instead of new pages when navigating the site. The link is to a demo of this template for illustration. What I would like to do is: client goes to mysite.com/#recipescraper -> 'popup' of submission form -> submit form -> pop up replaced by a "thank you" popup.
So far in Python 3.6 I have the following code:
@app.route('/')
def homepage():
return render_template('index.html')
#--- Cookpad Scraper Stuff ---#
@app.route('/#Scraper', methods=['GET','POST']) #allow get and post requests
def scraper(): # sending via forms as a post request (behind the scenes)
#--- Check if its a post or get request: ---#
if request.method == 'POST': #this block is only entered if the form is submitted
url = request.form.get('recipe')
user = request.form['name']
#--- Assign variables to the multiple choices ---#
category = request.form.get('category')
dessert = request.form.get('dessert')
main_dish = request.form.get('main_dish')
side_dish = request.form.get('side_dish')
soup = request.form.get('soup')
mommy = request.form.get('mommy')
#--- Make sure a valid url was submitted ---#
check_url = 'https://cookpad.com'
if check_url in url: #if a string is submitted with https://cookpad.com in it
title = recipe(url, category, dessert, main_dish, side_dish, soup, mommy, user) #puts the title_ext returned from recipe() into the title variable
send_data(title, url, mommy, category) # send data to rethinkdb: cookpad_scrape database
publish(user) #publishes the scraped recipe into wiki
telegram(user, title) #notifies telegram
return redirect(url_for('thanks', title=title, user=user)) #redirects to url.com/thanks?title=something&user=something_else. Variables are in the link
else: #otherwise return bad_link.html
return redirect(url_for('bad_link', link=url, user=user))
#--- Make the form ---#
return render_template('#Scraper')
This works perfectly, up to the point when the client clicks "submit". For some reason I get a 405 'Method not allowed' error. I did confirm that this code works when the scraper page is on a separate 'mysite.com/scraper' without the popup. I have no experience with CSS/JS, but I'm assuming the #Scraper link gets executed without actually submitting to the python server?
This is the code for the webpage and popup:
<!DOCTYPE HTML>
<!--
Dimension by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-->
<html>
<head>
<title>Website</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<link rel="stylesheet" href="../static/css/main.css" />
<!--[if lte IE 9]><link rel="stylesheet" href="../static/css/ie9.css" /><![endif]-->
<noscript><link rel="stylesheet" href="../static/css/noscript.css" /></noscript>
</head>
<body>
<!-- Wrapper -->
<div id="wrapper">
<!-- Header -->
<header id="header">
<div class="logo">
<span class="image" http://theiveyleague.com/wp-content/uploads/2011/07/6-long-hair-mom-dad-daughter-son-son-baby-1024x731.jpg></span>
</div>
<div class="content">
<div class="inner">
<h1>Hi. This is our website.</h1>
<p>All for one, one for all.</p>
</div>
</div>
<nav>
<ul>
<li><a href="#More">More</a></li>
<li><a href="#Scraper">Scraper</a></li>
</ul>
</nav>
</header>
<!-- Main -->
<div id="main">
<!-- More -->
<article id="More">
<h2 class="major">More</h2>
<!-- <span class="image main"><img src="../static/images/pic03.jpg" alt="" /></span> -->
[REDACTED]
</article>
<!-- Scraper -->
<article id="Scraper">
<h1 class="major">Cookpad Scraper</h1>
<form method = "POST">
What is the cookpad recipe url? <input type="text" name="recipe"><br>
What is your name? <input type="text" name="name"><br>
Which category applies? <br>
<input type="radio" id="bread" name="category" value="Bread">
<label for="bread">Bread</label>
<input type="radio" id="fruit" name="category" value="Fruit">
<label for="fruit">Fruit</label>
<input type="radio" id="veggies" name="category" value="Veggie" checked>
<label for="veggies">Veggies</label>
<input type="radio" id="other" name="category" value="Other">
<label for="other">Other</label> <br>
<br>What type of meal is it? <br>
<input type="checkbox" id="dessert" name="dessert">
<label for="dessert">dessert</label>
<input type="checkbox" id="main_dish" name="main_dish" checked>
<label for="main_dish">Main Dish</label>
<input type="checkbox" id="side_dish" name="side_dish">
<label for="side_dish">Side Dish</label>
<input type="checkbox" id="soup" name="soup">
<label for="soup">Soup</label> <br>
<br>Did mom make it? </br>
<input type="radio" id="yes" name="mommy" value="yes" checked>
<label for="yes">Yes</label>
<input type="radio" id="no" name="mommy" value="no">
<label for="no">No</label><br>
<br><input type="submit" value="Submit"><br>
</form>
</article>
<!-- Footer -->
<footer id="footer">
<p class="copyright">© Untitled. Design: <a href="https://html5up.net">HTML5 UP</a>.</p>
</footer>
</div>
<!-- BG -->
<div id="bg"></div>
<!-- Scripts -->
<script src="../static/js/jquery.min.js"></script>
<script src="../static/js/skel.min.js"></script>
<script src="../static/js/util.js"></script>
<script src="../static/js/main.js"></script>
</body>
</html>
Basically I am trying to have a "mysite.com/#article" link get passed to python, so python can get ready to read the form that is being submitted.
