how to pass html form data to variable (nodejs / javascript) - forms

so i'm using nodejs and nodejsdb-mysql. i want to make form for adding and searching posts.
I make html page with form, transform it to node using jsdom but how do i set up variables?
for example my html form is like:
name = text input
surname = text input
submit
and how do i pass inserted name/surname to var??

You will need to turn your submit into a button with an event such as onclick - this might be what you are looking for:
<input type="button" value="Submit" id="submit" name="submit" onclick="submit()">
<script type="text/javascript">
function submit(){
var name = document.getElementById('**name**').value;
var surname = document.getElementById('**surname**').value;
alert("Thanks for submitting, " +name);
}
</script>

With nodejsdb-mysql sooner or later you will face real problems like date localization problems and so on, use https://github.com/felixge/node-mysql instead

Related

Flask - boolean form

i'm running locally a python file. when i access 127.0.01:5000/string i get to a specific html page. Up to now, using javascript, i managed to put some checkbox (boolean form) on that page, but how can i assign the value of each one of them (True or False) to a variable in the python file?
i'm being unable to use the user's response in anyway.
i'm using flask-ext-wtforms, render_template, etc.
this is what i have on the html file so far.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
var creature=0
var artifact=0
function suggest(){
if ($('#Creature').is(':checked')){creature=1;}
if ($('#Artifact').is(':checked')){artifact=1;}
}
</script>
<input type="checkbox" id = "Creature">Creature<br>
<input type="checkbox" id = "Artifact">Artifact<br>
<input type="checkbox" id = "Enchantment"> Enchantment<br>
<input type="checkbox" id = "Sorcery"> Sorcery<br>
<button type="button" onclick = "suggest(); alert('creature ' + creature + ' artifact ' + artifact)">Submit</button>
It tells me whether or not the user has clicked one of the first two boxes, but that's it. i don't know how to make the python file access such information.
It'd be useful to see what you have in the actual Python file, but I'll give it a go. Also I'll state right off the bat that for these sorts of questions the documentation should be your best friend and first go-to, but here's a start.
From the html you've posted it doesn't look like you're actually using a Flask-WTF Form instance. You would want to first create a Form with BooleanFields like so:
from flask.ext.wtf import Form
from wtforms import BooleanField
class MyForm(Form):
creature = BooleanField()
# etc
submit = SubmitField()
then in your template render the form & the fields like so:
<form method="POST" action="/string">
{{ form.creature.label }}
{{ form.creature() }}
{# ... etc ... #}
{{ form.submit() }}
</form>
Then finally in your view, you have to (A) specify that the view accepts POST requests, (B) create the form, and (C) make sure you pass the form to the template for rendering. If you do all these things, then when you, or someone else, or a robot or whatever click submit, then the browser will POST the data from the form to the flask view, and you will be able to access it in the view as, say, form.creature.data. Example:
#route('/string', methods=['GET', 'POST']) # part A
def get_critters():
form = MyForm() # part B
if form.validate_on_submit():
# do something with form.creature, or form.whatever
return render_template("string.html", form=form) # part C
All of this is very ably covered in multiple parts of each project's documentation. See:
https://flask-wtf.readthedocs.org/en/latest/quickstart.html
https://wtforms.readthedocs.org/en/latest/fields.html#wtforms.fields.BooleanField
and virtually everything at http://flask.pocoo.org/docs/0.10/ but especially http://flask.pocoo.org/docs/0.10/patterns/wtforms/ and http://flask.pocoo.org/docs/0.10/tutorial/.

form with multiple submit buttons that execute different actions

I'm missing something fundamental when it comes to mapping a view to a controller's action and hoping someone can point me in the right direction. I'm working on an existing project and still familiarizing myself with the language and the way it was configured. I have a form that will resolve a qaCase (question answer case) through the resolveForm action and qaCase/resolve view. below is a simplified version of what I have (please let me know if I need to include more information).
QaCaseController
#RequestMapping(value="/resolve/{id}/**", method=RequestMethod.GET)
public String resolveForm(#PathVariable("id") Integer id, Model model) {
QaCase qaCase = qaCaseDAO.findById(id);
// Load the backing objects into the session
model.addAttribute("qaCase", qaCase);
model.addAttribute("users", userDAO.findAll());
model.addAttribute("exams", examDAO.findAll());
return "qacases/resolve";
}
qaCase/resolve.jsp
the resolve view has a form that will accept text input and a resolve button.
<sf:form method="POST" modelAttribute="qaCase" onsubmit="return isValid()">
// some input fields
<input type="submit" name="submitted" value="resolve" />
</sf:form>
when submit button is clicked, the following query string is created
http://localhost:8080/qacases/resolve/<id>/<location>/<name>/<created by>
What I'd like to do is add an additional input field and button to the existing form so I can optionally add comments instead of resolving a case.
<sf:form method="POST" modelAttribute="qaCase" onsubmit="return isValid()">
// some input fields
<input type="submit" name="submitted" value="resolve" />
</sf:form>
<sf:form method="POST" modelAttribute="qaCase" action="addComment">
// optionally Add comment
<input type="submit" name="submitted" value="addComment" />
</sf:form>
If addComment is clicked then I want the query string to be created.
http://localhost:8080/qacases/addComment
Instead, I get the following query string with a 400 status code.
http://localhost:8080/qacases/resolve/<id>/<location>/<name>/<created by>/addComment
I've been going through configuration files to find how the mapping is being set but haven't had any luck. Not sure if this is an answer that can be answered without someone going through the project and determining how it's configured. Appreciate any advice and/or answers.
when you are using action = "addComment" without "/" before "addComment" in <form> that means you are posting your form to current_url_that_invokes_view/addComment
if add "/" to action = "/addComment" you will go to localhost:8080/addComment
so if you need http://localhost:8080/qacases/addComment
type action = "/qacases/addComment" and pay attantion to "/" before qacases to direct root url

How to pass the exact search result into a new URL

So I'm using a form in a specific page and I want to pass the exact search query to another url after submission
Example: I search for vehicles and I need the result to be domain.com/search/vehicles
So this is what I have so far:
<form id="" action="domain.com/" method="get">
<input type="text" name="search" />
<input type="submit" value="click here" />
</form>
The actual url result here is: domain.com/?search=vehicles
I can't figure out how to make it work
HTML forms will send the inputs in it as GET or POST (or DELETE or PUT also, I think) parameters. So they will send it as url?parameter1=xxx, they won't incorporate them in the url as you want like this url/parameter1/xxx/. I think to do it as you want is easier with jQuery (or plain javascript).
You can do this with jQuery, for example:
$("#form-id").submit(function() {
event.preventDefault(); // stops form from executing normal behavior
var newUrl = // get new url parameters and mount it;
document.location.href = newUrl; // sends to new location
/* Do Something */
return false;
});
document.location.href in javascript will redirect you to a new page.

Passing AngularJS variable through form input field does not work

I have an iFrame that has content on a different domain, that I also control. I like to pass confidential data from the parent to the iFrame. Therefore, I do not want to pass it via query string or URL. I like to pass it via Form hidden input fields. It works if the values of the fields are text. However, it does not work if I use AngularJS variables as values for the fields.
Below is my code.
{{session.user.user_ID}} and {{i18n.domain}} works in this HTML file and writes the correct values to the webpage.
<form id="form_frame" action="http://other.mydomain.com/forIframe.php" method="post" target="output_frame">
<input type="hidden" value="{{session.user.user_ID}}" name="id" />
<input type="hidden" value="{{i18n.domain}}" name="domain" />
</form>
<iframe name="output_frame" width="400" height="400">
</iframe>
<script language="JavaScript" type="text/javascript">
document.getElementById("form_frame").submit(); // automatically submit the form
</script>
I have this in my forIframe.php file, which is the file that writes the content for the iFrame:
echo 'user ID is: '.$_POST['id'];
However, the above writes this:
user ID is: {{session.user.user_ID}}
Why doesn't this AngularJS variable parse correctly into the value attribute of the input field? How do I pass the values in {{session.user.user_ID}} and {{i18n.domain}} securely to my PHP file in my iFrame?
Elements inside the iFrame do not inherit the scope of the parent. You best bet is to use messaging i.e. $broadcast and $on : http://plnkr.co/edit/Osa5MNKiJKzsi7wAUXgM?p=preview

JSP javascript function onclick to different jsp page

I have a form and javascript function to open 2.jsp page but it keeps giving me
Message: Object doesn't support this property or method
Here is how I do it. I tried to put in only the important parts.
<form name = iForm action=1.jsp method=POST>
<input type="button" value="Button2" name=button2 onclick="OnButton1()"/>
</form>
<script language="JavaScript">
function OnButton1{
document.iFrom.action = "2.jsp";
document.iFrom.target = "_blank";
document.iFrom.submit();
return true;
}
< /script>
I know a way to open through 'window' but I was wondering if there is this way
You did not put parenthesis after your JavaScript function name and you misspelled the form name in your script.
Correct those mistakes and it should work as you might expect.
As well, the target attribute does work for forms.