Issue
I am trying to import a js file into my .html file and use the function in it but it doesn't seem to be working:
script.js
function HidePassword() {
var x = document.getElementById("passwordInput");
if (x.type === "password") {
x.type = "text";
} else {
x.type = "password";
}
}
newclient.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title> Onboarding Portal - New Client</title>
</head>
<script type="text/javascript" src="../script.js"></script>
<body>
<a href="/" target="_self">
<button>Back</button>
</a>
<center>
Onboarding Portal
<br /><br /><br />
<form method="POST" action="/">
Password:
<input
type="password"
name="password"
value=""
id="passwordInput"
required
/><br /><br />
<input type="checkbox" onclick="HidePassword()" />Show Password
</center>
</body>
</html>
Am I missing something here? Should I not use script.js like this?
Edit: here is the structure:
Uncaught ReferenceError: HidePassword is not defined at HTMLInputElement.onclick
from flask import Flask, render_template, request
import onboardingscript
from onboardingscript import onboard_client, add_rec_to_existing_client
import json
from configparser import ConfigParser
import pandas as pd
from onboarding2 import onboard_client2
config_object = ConfigParser()
config_object.read("config.ini")
# create an instance of flask
app = Flask(__name__)
# Rename to the correct snake notation
# instantiate the app in one function -- COMPLETE
# Start adding config files to replace the credentials and other sensitive information
# add more error checking to your calls
# compartmentalize your functions
def create_app():
# # print(df)
@app.route('/')
def index():
return render_template('index.html')
@app.route('/new-client')
def new_client():
return render_template('newclient.html')
@app.route('/existing-client')
def existing_client():
return render_template('existingclient.html')
@app.route('/', methods=['POST'])
def onboard_new_client():
# throw all variables captured by form and throw it into script, and run it
#create a large function that takes in the calls and have it run in sequential order for this
onboarding_data = {
'clientFirstName': request.form['clientFirstName'],
'clientLastName': request.form['clientLastName'],
'clientId': request.form['clientId'],
'clientEmail': request.form['clientEmail'],
'envOption': request.form['env']
}
result = onboard_client2(onboarding_data)
# result = onboard_client(onboarding_data)
if (result == True):
return render_template('confirmation.html')
else:
return render_template('failure.html')
@app.route('/a', methods=['POST'])
def onboard_existing_client():
onboarding_data = {
'clientEmail': request.form['clientEmail'],
'envOption': request.form['env']
}
result = add_rec_to_existing_client(onboarding_data)
if (result == True):
return render_template('confirmation.html')
else:
return render_template('failure.html')
return app
if __name__ == '__main__':
app = create_app()
app.run(debug=True)
EDIT: I am thinking about just manually typing it in <script> blocks. This was just me trying to save space/time by having it in one .js file because this function is used in two places.
Solution
Create a directory named static at the same level as templates and put your script file in it. You'll be able to load it like so:
<script type="text/javascript" src="/static/script.js"></script>
Note that this is also valid for other files such as images or css files.
NOTE: The current position of your <script> import is not correct. Either put it inside your <head> or inside <body>. Even tho it will load the script file on most modern browsers, this is not a valid HTML syntax and will get you errors with the W3C validator.
Answered By - geauser
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.