I want to send the total value of this table to an email. I wrapped the mailto around the table but there was no success is doing that. Am I missing something here? I would like to embed this on a wix website.
<form action="mailto:someone#gmail.com" method="post" enctype="text/plain"> <tr>
<td>Patio Set/Workshop Table/Gun Cabinet</td>
<td>
<input type="text" value="" name="7QTY5" id="7QTY5" onKeyUp="multiply()" />
</td>
<td style=display:none;>
<input type="text" name="7PRICE5" id="7PRICE5" value="25" readonly/>
</td>
<td style=display:none;>
<input type="text" name="7TOTAL5" id="7TOTAL5" />
</td> <input type="button" name="Submit1" value="Calculate" onclick="javascript:add()"/><br> Total:
<input type="text" name="9TOTAL" id="9TOTAL" readonly/> <br>
<input type="button" name="Submit2" value="Calculate" onclick="javascript:calculate()"/><br>
<input id= "result" type= "text" value="0"/> Final Result<br/>
<input type="submit" value="Send">
<input type="reset" value="Reset">
</form>
Related
Hello I'm pretty new to coding and while working on a project I tried to make a form with a submit and reset button, but when testing the form it doesn't work on the computer or mobile. Thank you for viewing this.
enter code here
<form id="form" action="contactform.php" method="post">
<label for="topic">Message Topic: </label>
<select name="topic">
<option value="Memberships">Memberships</option>
<option value="Careers">Careers</option>
<option value="Other">Other</option>
</select>
<br><br>
<label for="Name">Name: </label>
<br>
<input name="FName" id="firstname" type="text" placeholder="First" size="20" required>
<input name="LName" id="lastname" type="text" placeholder="Last" size="20" required>
<br><br>
<label for="email">Email: </label><br>
<input name="Email" id="email" type="email" size="25" required><br>
<label for="phone">Phone Number: </label><br>
<input name="Phone" id="phone" type="tel" size="12" required>
<br><br>
<label for="message">Enter a Message Here:</label>
<br>
<br><textarea name="messagebox" id="message"></textarea>
<br><br>
<input type="submit" id="submit" value="Submit"></button>
<input type="reset" id="clear" value="Clear"></button>
<br>
</form>
</div>
</body>
<script>
$(document).ready(function(){
$(#submit).on('click touch', function () {
alert("You are about to SUBMIT this form. Is that ok?");
});
});
</script>
The Problem is in your syntax. Change it to:
<button type="submit" id="submit">Submit</button>
<button type="reset" id="clear">Clear</button>
or
<input type="submit" id="submit" value="submit">
<input type="reset" id="clear" value="clear">
I just checked it. Seems like it works fine
Have a look at it:
https://codepen.io/kap1l/pen/gOYjjRZ?editors=1000
Thanks,
Also in submit and reset type you are using <input>
but closing is
</button>
Change both to either
<input></input>
or <button></button>
The problem is you didn't assign single quotes or double quotes in the $(#submit).
Change '#submit' to the id of the form and change 'click touch' to 'submit'.
<script>
$(document).ready(function(){
$('#form').on('submit', function () {
alert("You are about to SUBMIT this form. Is that ok?");
return true;
});
});
</script>
You have couple of issues in your code
Remove the closing tags </button>, firstly because you do not have corresponding opening tags for them, secondly you need not use them as you already achieved the same by using <input> elements.
JQuery issue, you need to enclose id within double quotes/single quotes
$(#submit) should be $("#submit")
Here is the working code JSFiddle
Do this
<button type="button" id="submit">Submit</button>
<button type="button" id="clear">Clear</button>
$("#submit").on('click', function () {
instead of
<input type="submit" id="submit" value="Submit"></button>
<input type="reset" id="clear" value="Clear"></button>
$(#submit).on('click touch', function () {
In your html, u did some mistakes like for submit buttons, you started with <input> and trying to close it with <button>
so replace it with
<input type="submit" id="submit" value="Submit"/>
<input type="reset" id="clear" value="Clear"/>
In script while using a selector please put the selector inside "" OR '' like $('#submit') insted of using it $(#submit)
$(document).ready(function(){
$('#submit').on('click', function () {
alert("You are about to SUBMIT this form. Is that ok?");
});
});
label{
font-size:20px;
margin-right:20px;
}
textarea
{
width:100%;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="form" action="contactform.php" method="post">
<table>
<tr>
<td> <label for="topic">Message Topic: </label></td>
<td>
<select name="topic">
<option value="Memberships">Memberships</option>
<option value="Careers">Careers</option>
<option value="Other">Other</option>
</select>
</td>
</tr>
<tr>
<td> <label for="Name">Name: </label></td>
<td>
<input name="FName" id="firstname" type="text" placeholder="First" size="20" required>
<input name="LName" id="lastname" type="text" placeholder="Last" size="20" required>
</td>
</tr>
<tr>
<td> <label for="email">Email: </label></td>
<td>
<input name="Email" id="email" type="email" required>
</td>
</tr>
<tr>
<td> <label for="phone">Phone Number: </label></td>
<td>
<input name="Phone" id="phone" type="number" required>
</td>
</tr>
<tr>
<td> <label for="message">Enter a Message Here:</label></td>
<td>
<textarea name="messagebox" rows=5 id="message"></textarea>
</td>
</tr>
<tr>
<td> <input type="submit" id="submit" value="Submit"/>
<input type="reset" id="clear" value="Clear"/>
</td>
</tr>
</table>
</form>
I would like to use one input field that is referenced by multiple forms on one page. or I would like to use <input form="form1,form2,form3,form4" type="text" name="name" required autocomplete="off"/><br> or call the input field every time i submit each of the forms
<table align="center">
<tr>
<td colspan="5" align="center">Group Name:
<input form="form1,form2,form3,form4" type="text" name="name" required autocomplete="off"/><br>
</td>
</tr>
<tr>
<td>
<form id="form1" action="plan.php" method="post">
<input type="hidden" name="number" value="0"><br>
<input type="hidden" name="priceplan" value="25"><br><br>
<input type="submit" value="10 PAX" style="width:100%; margin-top:0px;" class="button">
</form>
</td>
<td>
<form id="form2" action="plan.php" method="post">
<input type="hidden" name="number" value="0"><br>
<input type="hidden" name="priceplan" value="2"><br><br>
<input type="submit" value="10 People" style="width:100%; margin-top:0px;" class="button">
</form>
</td>
<td>
<form id="form3" action="plan.php" method="post">
<input type="hidden" name="number" value="0"><br>
<input type="hidden" name="priceplan" value="3"><br><br>
<input type="submit" value="20 People" style="width:100%; margin-top:0px;" class="button">
</form>
</td>
<td>
<form id="form4" action="plan.php" method="post">
<input type="hidden" name="number" value="0"><br>
<input type="hidden" name="priceplan" value="4"><br><br>
<input type="submit" value="30 People" style="width:100%; margin-top:0px;" class="button">
</form>
</td>
<td>
<form id="form5" action="plan.php" method="post">
<input type="hidden" name="number" value="0"><br>
<input type="hidden" name="priceplan" value="5"><br><br>
<input type="submit" value="40 People" style="width:100%; margin-top:0px;" class="button">
</form>
</td>
</tr>
</table>
I would like to use <input form="form1,form2,form3,form4" type="text" name="name" required autocomplete="off"/><br> or call the input field every time i submit each of the forms
You can achieve this using Javacsript here is an example using jQuery:
first you give ur unique input an ID (id="uniqueInput")
then on the submit you append it to the form
$('form').submit(function(e){
e.preventDefault();
$('<input>').attr({
type: 'hidden',
id: 'foo',
name: 'bar',
value: $('#uniqueInput').val()
}).appendTo($(this));
})
Trying to get the input fields of my html to align up with the other input fields.
Is there a way to make it aligned without using CSS?
This is what I have :
Name:|-----Input-------|
Password:|-----Input-------|
Confirm password:|-----Input-------|
Email:|-----Input-------|
Phone:|-----Input-------|
Trying to make it like this:
Name:.....................|-----Input-------|
Password:..............|-----Input-------|
Confirm password:|-----Input-------|
Email:.....................|-----Input-------|
Phone:...................|-----Input-------|
(without the dots)
Code:
<form>
<label>Name:</label>
<input type="text" name="namefield" align="center"> <br />
<label><br>Password: </label>
<input type="password" name="pwdfield"> <br />
<label><br>Confirm password: </label>
<input type="password" name="cpwdfield"> <br />
<label><br>Email: </label>
<input type="email" name="email"> <br />
<label><br>Phone: </label>
<input type="tel" name="phone"> <br />
<br>
<input type="submit" value="Register" />
</form>
Using the table tag without borders allows one to align textboxes without css.
<FORM>
<TABLE frame="box">
<TR><TD>Your name</TD> <TD><INPUT TYPE="TEXT" NAME="name" SIZE="25"></TD> </TR>
<TR><TD>Password</TD> <TD><INPUT TYPE="TEXT" NAME="pwdfield" SIZE="25"></TD> </TR>
<TR><TD>Confirm password</TD> <TD><INPUT TYPE="TEXT" NAME="cpwdfield" SIZE="25"></TD> </TR>
<TR><TD>E-mail</TD> <TD><INPUT TYPE="TEXT" NAME="email" SIZE="25"></TD> </TR>
<TR><TD>Phone</TD> <TD><INPUT TYPE="TEXT" NAME="phone" SIZE="25"></TD> </TR>
</TABLE>
<P><INPUT TYPE="SUBMIT" VALUE="Register" NAME="B1"></P>
</FORM>
my question is how to control fill entries in textfield.
http://support.mozilla.org/en-US/kb/control-firefox-automatically-fills-in-forms
In my app I have page with login form which have username textField. Then I have registration page with email textField. Now I have problem that firefox rember entries which I enter to username textField also in email textField. But when I enter value to email textField firefox does rember it. Same with chrome browser
form1
<form wicket:id="signInForm">
<table>
<tr>
<td align="right"><wicket:message key="username">
Username
</wicket:message></td>
<td><input wicket:id="username" type="text" /></td>
</tr>
<tr>
<td align="right"><wicket:message key="password">
Password
</wicket:message></td>
<td><input wicket:id="password" type="password" /></td>
</tr>
<tr wicket:id="rememberMeRow">
<td></td>
<td><input wicket:id="rememberMe" type="checkbox" /> Remember
Me</td>
</tr>
<tr>
<td></td>
<td><input class="tournamentButton" type="submit"
wicket:id="signIn" value="Sign In" /> <input class="tournamentButton"
type="reset" value="Reset" /> <input class="tournamentButton"
type="submit" wicket:id="register" value="Register" /></td>
</tr>
</table>
</form>
form2
<form class="userform" wicket:id="userEditForm">
<fieldset>
<legend>
<wicket:message key="user">
User
</wicket:message>
</legend>
<div>
<label wicket:for="name"><wicket:message key="name">
Name:
</wicket:message></label><input type="text" wicket:id="name" />
</div>
<div>
<label wicket:for="surname"><wicket:message key="surname">
Surname:
</wicket:message></label><input type="text" wicket:id="surname" />
</div>
<div>
<label wicket:id="userNameLabel" /> <input type="text"
wicket:id="userName" />
</div>
<div>
<label wicket:for="email"><wicket:message key="email">
Email:
</wicket:message></label><input type="email" wicket:id="email" />
</div>
<div>
<label wicket:for="password"><wicket:message key="password">
Password:
</wicket:message></label><input type="password" wicket:id="password" />
</div>
<div>
<label wicket:for="confirmPassword"><wicket:message
key="confirmPassword">
Confirm Password:
</wicket:message></label><input type="password" wicket:id="confirmPassword" />
</div>
<div>
<label wicket:id="platnostLabel" /> <input type="text"
wicket:id="platnost" />
</div>
<div>
<label wicket:id="roleLabel" /><input type="text" wicket:id="role" />
</div>
</fieldset>
<div>
<input class="tournamentButton" type="submit" wicket:id="submit"
value="Save" /> <input class="tournamentButton" type="submit"
wicket:id="back" title="back" value="Back" />
</div>
</form>
In your HTML add the attribute autocomplete="off" to input fields where you dont want browsers to remember that information. For example:
<input type="text" autocomplete="off" wicket:id="userName" />
EDIT: 02.2018:
Browser behavior changed over time and now for login and password fields autocomplete off is not supported in modern browsers:
https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion#The_autocomplete_attribute_and_login_fields
I'm trying to make a simple HTML contact form, but when I upload the HTML page to the internet, the send and clear buttons are not showing up - they're invisible.
The funny thing is if I hover the mouse over where they are supposed to be, I can see that there is a button there.
Why could this be?
<form action="contact.php" method="post">
<div>
<label for="contactname">Name</label>
<input type="text" name="contactname" class="textfield" id="contactname" value="" />
<span class="require"> *</span>
<label for="contactsubject">Subject</label>
<input type="text" name="contactsubject" class="textfield" id="contactsubject" value=""/>
<span class="require"> *</span>
<label for="contactemail">Your E-mail</label>
<input type="text" name="contactemail" class="textfield" id="contactemail" value="" />
<span class="require"> *</span>
<label for="contactmessage">Your Message</label>
<textarea name="contactmessage" id="contactmessage" class="textarea" cols="8" rows="12"></textarea>
<span class="require"> *</span>
<input type="submit" value="Send">
<input type="reset" value="Clear">
add / end slash to both send & clear
<input type="submit" value="Send"/>
and
<input type="reset" value="Clear"/>
or you can also do like this:
<input type="submit" value="Send"></input>
<input type="reset" value="Clear"></input>
<input> is starting tag
</input> is ending tag
UPDATE 1: answer for how to use image for submit button
change input type to "image"
<input type="image" value="submit" src="submit1.jpg" alt="submit Button" onMouseOver="this.src='submit1.jpg'">