I have a form on my html page which has name="submitform" and id="submitform"
I want to submit it using Javascript with the following script on that page:
document.forms("submitform").submit();
My submit button in the form has name="btnSubmit" so it doesn't override the original function.
However, it doesn't work
I get: [Error] TypeError: '[object HTMLCollection]' is not a function (evaluating 'document.forms("submitform")'
What to do?
Thanks!
UPDATE - Full Code
<form action='/post' name='submitform' id="submitform" method='post' class='pure-form'>
<textarea columns="40" rows="4" name='entry[body]' id="statement" placeholder='enter a note here to visualize the words and their connections, you can also use #hashtags and #mentions.'><% if (url) { %><%= urltitle %> <%= url %><% } %></textarea>
<div id="addToContextsLabel">contexts:</div>
<ul id="addToContexts"></ul>
<input type="hidden" id="addedContexts" name="addedContexts">
<input type="hidden" id="context" name="context" value="<%= context %>">
<input type="hidden" id="selectedContexts" name="selectedContexts" value="">
<input type="hidden" name="statementid" value="">
<br>
<input type='submit' id="submitbutton" name="btnSubmit" value="save" class="pure-button pure-button-primary">
</form>
and
document.submitform.submit();
on the page
Use
document.forms['submitform']
instead of round braces. The Background is, that document.forms is an array type and needs to be treated as such.
You can either use the index accessor
document.forms[0]
or by name as i mentioned above.
Hope that helped!
you must submit form like this
document.forms["name of your form"].submit();
Related
I have a multiple forms in a page and i would like to get the elements of a specific form. For example:
<form class="form" id="1">
<input type="text" name="message" value="message">
<button type="submit" value="submit">Submit</button>
</form>
<form class="form" id="2">
<input type="text" name="message" value="message">
<button type="submit" value="submit">Submit</button>
</form>
How to get the value of message of form id=2...... Thanks in advance
Just use attribute selectors
$('form[id=2]') // get the form with id = 2
.find('input[name=message]') // locate the input element with attribute name = message
.attr("value"); // get the attribute = value
You really shouldn't use raw numbers for ids, let's rename those to form_1 and form_2, then your jquery selector would be:
$("#form_2 [name='message']").val();
Simply query the input from the id of the form you'd like
console.log($('#2 input').val());
//more specific
console.log($('#2 input[name="message"]').val());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form class="form" id="1">
<input type="text" name="message" value="message">
<button type="submit" value="submit">Submit</button>
</form>
<form class="form" id="2">
<input type="text" name="message" value="message">
<button type="submit" value="submit">Submit</button>
</form>
You can use jQuery, or you can use basic JavaScript to return the message value. With basic JS, you would have to give your form a name, but then could return the message value.
Code:
function getValue() {
var message = document.forms["form_name"]["message"].value;
}
You would then have to return the function when the form is submitted
<form class="form" name="form_name" onsubmit="return getValue()">
We have two different forms in one jsp page one for submission and one that approves.
The code is:
<%if(rs.getInt("approve")==0) {%>
<form method="get" action="storecomment3.jsp">
Comments:<br>
<textarea name="comments" id="comments"></textarea>
<br>
<input type="hidden" name="article" value="<%=realname%>">
<input type="hidden" name="Username" value="<%=request.getParameter("Username")%>">
<input type="hidden" name="Password" value="<%=request.getParameter("Password")%>">
<input type=submit value="Submit">
</form>
<%} %>
<%if(rs.getInt("approve")==0) {%>
<form name="form1" action="usermain.jsp">
<input type=button value="Approve" onclick="validate()">
<input type="hidden" name="user" value="<%=request.getParameter("user")%>">
<input type="hidden" name="Username" value="<%=request.getParameter("Username")%>">
<input type="hidden" name="Password" value="<%=request.getParameter("Password")%>">
<script type="text/javascript">
function validate()
{
<%
r1.updateInt("approve", 1);
r1.updateRow();
%>
document.form1.submit();
}
</script>
</form>
The problem with the code is that when the submit button in the first form is clicked, the validate function is also getting executed which should not be happening!
Is there anything wrong with the code or the script?
Thanks!
I see a few possible problems here.
First, your condition rs.getInt("approve")==0 appears twice, perhaps one of them should be !=0?
Also it seems odd that you put r1.updateInt("approve", 1); and r1.updateRow(); inside the JS function. That code gets executed server side(!) as soon as the condition (rs.getInt("approve")==0) is met, no user interaction required.
I have a sidebar in a Google spreadsheet with a HTML form in it.
Now, how do I handle the values submitted?
In index.html:
<form id="configs" action="#">
<fieldset>
////input fields here
<input type="submit" id="enviar" value="Send" onclick="google.script.run.validarForm()" />
</fieldset>
</form>
In code.gs the functin validarForm() is called but how do I pass the submitted values to it so I can validate it first and store them in variables?
Thanks in advance for your help!
You can pass parameters using google.script.run. I'd do something like this:
<form id="configs" action="#">
<fieldset>
<input type="text" id="exampleField1" />
<input type="text" id="exampleField2" />
<input type="submit" id="enviar" value="Send" onclick="enviarForm()" />
</fieldset>
</form>
<script>
function enviarForm(){
var exampleField1Value = document.getElementById("exampleField1").value;
var exampleField2Value = document.getElementById("exampleField2").value;
google.script.run.validarForm(exampleField1Value, exampleField2Value);
}
</script>
Of course, this can be done with event handlers instead of "onclick=", and jQuery too.
I have 2 forms, 1st form is to submit an input value to the next page, and on the next page there's the 2nd form which is a search map function.
the 1st form is displayed on the homepage
<form role="search-map" method="" id="search-map" action="/find">
<h4>Where To Buy</h4>
<input type="text" class="form-control" id="addressInput" name="addressInput" placeholder="Your Suburb or Postcode">
<button type="submit" class="btn btn-vc btn-default btn-lg" id="search-address-btn">Find</button>
</form>
the 2nd form is on another page which is /find that has a map search plugin
<form onsubmit="cslmap.searchLocations(); return false;" id="searchForm" action="">
<input type="text" id="addressInput" name="addressInput" placeholder="Your Suburb" size="50" value="where-i-want-value-to-be-pass">
<input type="submit" class="slp_ui_button" value="Find" id="addressSubmit">
</form>
any ideas how can i pass the value from the 1st form "addressInput" to the 2nd form? and the run the search on the 2nd form? here's the 2nd form btw
i tried searching here but what i need seems to be more complex that what i have found
or maybe how can i get the 2nd page to get the value from the url (?addressInput=North+Bega%2C+NSW%2C+2550) into the 2nd form input "addressInput" and run the submit button function when the page loads?
thanks in advance guys
I'm assuming you want to get the value from s to the second form.
replace where-i-want-value-to-be-pass
with <?php echo $_REQUEST['addressInput']; ?>
<form onsubmit="cslmap.searchLocations(); return false;" id="searchForm" action="">
<input type="text" id="addressInput" name="addressInput" placeholder="Your Suburb" size="50" value="<?php echo $_REQUEST['addressInput']; ?>">
<input type="submit" class="slp_ui_button" value="Find" id="addressSubmit">
</form>
<form name="myForm" method="post" onsubmit="return getComment()">
<textarea id="commentarea"></textarea>
<input type="text" name="locate" value="<%=rs.getString("location")%>">
<input type="submit" value="View Comment">
</form>
function getComment(){
<% String locate=request.getParameter("locate"); %>
var location = <%= locate%>;
document.getElementById('commentarea').value=location;
return false;
}
Everytime i click View Comment, there's no value printed.
I want to access locate in the scriptlet and print the value in the text area.
I know this is not the best way to access it, but i need to access it in this way.
Can anyone help me?
You have missed double/single quotes for the value of the location variable. If you don't need to submit the form, just use a button input element.
<form name="myForm" method="post">
<textarea id="commentarea"></textarea>
<input type="text" name="locate" value="<%=rs.getString("location")%>">
<input type="button" value="View Comment" onclick="getComment()">
</form>
function getComment(){
<% String locate=request.getParameter("locate"); %>
var location = "<%= locate%>";
document.getElementById('commentarea').value = location;
}