How to link bootstrap button to php code? - javascript

I have like a contact us form, and basically what I want is for the user to click the submit button and then for this data to be stored on a remote database on a server. Problem is I don't know how to link the javascript and php stuff to the button.
This is my code:
<html>
<head>
<title>Contact Us</title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
</head>
<body>
<script type="text/javascript">
function verify(){
var forename = document.getElementById("forename").value;
var surname = document.getElementById("surname").value;
var comments = document.getElementById("comments").value;
if(forename == null || forename == ""){
alert("Forename is empty");
return false;
}
else if(surname == null || surname == ""){
alert("Surname is empty");
return false;
}
else if(comments == null || comments == ""){
alert("Comments is empty");
return false;
}
document.register.submit();
}
</script>
<div class="container">
<h1>Contact Us</h1>
</div>
<form>
<div class="container center_div">
<div class="panel panel-default">
<div class="row">
<fieldset class="form-group">
<label for="Forename">Forename</label>
<input type="text" class="form-control" id="forename" placeholder="Forename">
</fieldset>
<fieldset class="form-group">
<label for="Surname">Surname</label>
<input type="text" class="form-control" id="surname" placeholder="Surname">
</fieldset>
<fieldset class="form-group">
<label for="Contact Us">Contact Us</label>
<input type="text" class="form-control" id="comments" placeholder="Comments">
</fieldset>
<div class="row">
<div class"col-md-2">
<button type="button" action="contactus.php" class="btn btn-success">Submit</button>
</div>
</div>
</div>
</div>
</form>
</body>
</html>

You have action on the wrong tag. Remove it from here:
<button type="button" action="contactus.php" class="btn btn-success">Submit</button>
Put it here:
<form action="contactus.php">
Also, change your button from type "button" to "submit"
<button type="submit" class="btn btn-success">Submit</button>
And this is just semantics, but perhaps an important distinction: the button is not a bootstrap button. It's an HTML button. You're styling it using bootstrap css.
Update: OP has asked how to get the "JavaScript stuff" working. Here's one way:
I like id's, so add an id to your form tag. I also like to be explicit about the form submit method, so add that to your form tag, too:
<form id="myForm" action="contactus.php" method="post">
Magical JavaScript Stuff
var form = document.forms.myForm
form.onsubmit = function() {
var forename = document.getElementById("forename").value;
var surname = document.getElementById("surname").value;
var comments = document.getElementById("comments").value;
if (forename == null || forename == "") {
alert("Forename is empty");
return false;
} else if (surname == null || surname == "") {
alert("Surname is empty");
return false;
} else if (comments == null || comments == "") {
alert("Comments is empty");
return false;
}
document.register.submit();
}
Here is a Fiddle Demo. Note: I removed the action from the form tag in the demo because it doesn't know what "contactus.php" is.
One other note: If you're only intention with the JavaScript function is to verify that the form fields have been filled out, you may be better off using the HTML input attribute required.
For example:
<input type="text" class="form-control" id="forename" placeholder="Forename" required>
Here's a Fiddle Demo showing how it works.

use method in your form POST or GET and add action with the name of php file which handles the submit.
Sample code
<form action="example.php" method="post" >
<input type="text" name="user_name" placeholder="Name">
<input type="text" name="user_surname" placeholder="Surname">
<input type="email" name="user_email" placeholder="Email">
<input type="password" name="user_pass" placeholder="Password">
<input type="submit" name="submit">
</form>
more about post and get function here
and html submit here

As a beginner, I first suggest you use jQuery rather than pure javascript. For one thing, it's much less typing and (imho) far easier to master. You code in jQuery, and behind the scenes jQuery turns that into javascript at runtime.
Since you are using bootstrap, you already have the jQuery library loaded (or you are supposed to have it -- your code was missing it). Press Ctrl+U to see page code in linked example. Anyway, since it's included on the page, you might as well use it.
Your sample code, fixed:
jsFiddle Demo
<html>
<head>
<title>Contact Us</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-1.9.1.min.js" integrity="sha256-wS9gmOZBqsqWxgIVgA8Y9WcQOa7PgSIX+rPA0VL2rbQ=" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<script type="text/javascript">
$(function(){
$('#btnSubmit').click(function(){
var forename = $("#forename").val();
var surname = $("#surname").val();
var comments = $("#comments").val();
if(forename == null || forename == ""){
alert("Forename is empty");
return false;
}
else if(surname == null || surname == ""){
alert("Surname is empty");
return false;
}
else if(comments == null || comments == ""){
alert("Comments is empty");
return false;
}
$('#frmContact').submit();
});
}); //END document.ready
</script>
</head>
<body>
<div class="container">
<h1>Contact Us</h1>
</div>
<div class="container center_div">
<form id="frmContact" action="contactus.php" method="post">
<div class="row">
<fieldset class="form-group">
<label for="Forename">Forename</label>
<input type="text" class="form-control" id="forename" placeholder="Forename">
</fieldset>
</div><!-- .row -->
<div class="row">
<fieldset class="form-group">
<label for="Surname">Surname</label>
<input type="text" class="form-control" id="surname" placeholder="Surname">
</fieldset>
</div><!-- .row -->
<div class="row">
<fieldset class="form-group">
<label for="Contact Us">Contact Us</label>
<input type="text" class="form-control" id="comments" placeholder="Comments">
</fieldset>
</div><!-- .row -->
<div class="row">
<div class="col-xs-8"> </div>
<div class="col-xs-4">
<button id="btnSubmit" type="button" class="btn btn-success">Submit</button>
</div>
</div><!-- .row -->
</form>
</div><!-- .container -->
</body>
</html>
Since you are new to jQuery, here are some free beginner-level tutorials to get you started. (It's where I learned myself, and they're free)

Related

how to make login w/ html, css and javascript

So, I have the HTML & CSS code already, but I need to make it so when you click button, it checks the contents of the input boxes and if equal to
Username = damon
Password = password
it lets you redirects to chat.html and if its wrong it does alert("wrong").
(I dont know JavaScript so I'm asking here.)
<html>
<head>
<title>Login</title>
<link rel="stylesheet" href="style/main.css">
</head>
<body>
<div id="content">
<div class="login">
<h1>Login</h1>
<input placeholder="username" type="text" >
<input placeholder="password" type="password" id="password">
<button type="button" onclick="" id="enter">ENTER</button>
</div>
</div>
</body>
<script src="script/db.js"></script>
<script src="script/main.js"></script>
</html>
db.js is empty and main.js has
function clickHandler() {
if (username === 'damon' && password === 'poop'){
window.location.replace("chat.html");
} else {
alert('Wrong!')
}
}
Hardcoding or doing user login checks on client side is not recommended as anyone can read the source and find out your login credentials.
But just assume that you just wanted to learn and try it out. You may do it like this.
Inline Onclick Function Call:
//this is main.js
function clickHandler() {
if (document.getElementById("username").value === "damon" && document.getElementById("password").value === 'poop'){
console.log("redirect to chat.html");
//window.location.replace("chat.html");
} else {
alert('Wrong!');
}
}
<html>
<head>
<title>Login</title>
<link rel="stylesheet" href="style/main.css">
</head>
<body>
<div id="content">
<div class="login">
<h1>Login</h1>
<!--Added id="username" to below input-->
<input placeholder="username" id="username" type="text" >
<input placeholder="password" id="password" type="password">
<!--You may use inline onclick to call clickHandler function-->
<button type="button" onclick="clickHandler()" id="enter">ENTER</button>
</div>
</div>
</body>
<script src="script/db.js"></script>
<script src="script/main.js"></script>
</html>
Or you may do it by attaching onclick listener to the button to call function.

jQuery code not executing code when javascript is executed?

Code
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
<link rel="stylesheet" href="/style.css">
</head>
<body>
<div class="container mt-4">
<h1 class="text-left" style="margin-bottom: 50px">Daily Fridge & Freezer Monitoring Record</h1>
<form action="/auth/21-TEMP-01b" method="post" id="form">
<div class="form-group">
<label>Select Fridge Or Freezer</label>
<select class="form-control" id="fridgeFreezer" name="fridge">
<option value="Fridge-1">Fridge 1</option>
<option value="Fridge-2">Fridge 2</option>
</select>
</div>
<div class="form-group fridges Fridge-1">
<h4>Fridge 1</h4>
<label>Temperature °C</label>
<input class="form-control" type="number" id="temperature-1" name="temperature-1">
<label>Comments</label>
<textarea class="form-control" rows="3" id="comments-1" name="comments-1"></textarea>
</div>
<div class="form-group fridges Fridge-2">
<h4>Fridge 2</h4>
<label>Temperature °C</label>
<input class="form-control" type="number" id="temperature-2" name="temperature-2">
<label>Comments</label>
<textarea class="form-control" rows="3" id="comments-2" name="comments-2"></textarea>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script type="text/javascript">
$(document).ready(function(){
$("select").change(function(){
$(this).find("option:selected").each(function(){
if($(this).attr("value")=="Fridge-1"){
$(".fridges").not(".Fridge-1").hide();
$(".Fridge-1").show();
}
else if($(this).attr("value")=="Fridge-2"){
$(".fridges").not(".Fridge-2").hide();
$(".Fridge-2").show();
}
else{
$(".fridges").hide();
}
});
})
.change();
var temp1 = document.getElementById('temperature-1');
var form = document.getElementById('form');
form.addEventListener('submit', function(e) {
if(temp1.value === '' || temp1.value == null) {
e.preventDefault()
document.querySelector('#fridgeFreezer [value="Fridge-1"]').selected = true;
alert("temp1 not fully filled")
}
})
});
</script>
</body>
</html>
Idea
I am trying to create form validation.
Running the above code details
You will see when you change the option in the drop down menu - different div element loads up. This is done through the jQuery code in the script.
Option 1
Option 2
Next, Javascript
I will be using Javascript to validate the form.
I only have started out validating the first div element of fridge 1. If value is empty I have an alert saying which input has not been filled.
In this scenario I have cleared out all data from Fridge 1 to run the if statement for the error.
Notice this line of code:
document.querySelector('#fridgeFreezer [value="Fridge-1"]').selected = true;
This re-selects the option to the one has the error.
But when I run it - this happens.
Div element of fridge-2 is still showing? How come is the jQuery not executing ?
You have to trigger a change event if you want the change event listener to execute.
form.addEventListener('submit', function(e) {
if(temp1.value === '' || temp1.value == null) {
e.preventDefault()
$('#fridgeFreezer').val("Fridge-1"); // can be simplified like this
$('#fridgeFreezer').trigger("change"); // important line
alert("temp1 not fully filled")
}
})

Javascript function for simple login system

I've been trying around for a bit and starting to lose my patience. Why doesn't this work? It meant for an easy school project and that's why it doesn't have to be secure at all, just functional.
I've been awake for almost 24hrs and im sure that it's part of the reason why i cant get it to work :)
<form>
<div class="form-group">
<label for="inputUsername">Användarnamn</label>
<input name="username" type="text" class="form-control" placeholder="Ange användarnamn">
</div>
<div class="form-group">
<label for="inputPassword">Lösenord</label>
<input name="password" type="password" class="form-control" placeholder="Ange lösenord">
</div>
<div class="loginButton">
<button type="submit" class="btn btn-primary" onclick="login(this.form);">Logga In</button>
</div>
</form>
<script>
function login(form){
if(form.username.value == "test") && (form.password.value == "test"){
self.location.href = "medlemmar.html";
}
else{
alert("Felaktigt användarnamn eller lösenord");
return false;
}
}
</script>
You are now submitting a form without an action defined for the form, so probably, it is just refreshing the page.
So one way to solve this would be by changing the type of the button:
<button type="button" class="btn btn-primary" onclick="login(this.form);">Logga In</button>
Furthermore you have an error with the parenthesis in your if statement:
if((form.username.value == "test") && (form.password.value == "test")){
If you fix that, it should work as desired:
function login(form){
if((form.username.value == "test") && (form.password.value == "test")){
self.location.href = "medlemmar.html";
}
else{
alert("Felaktigt användarnamn eller lösenord");
return false;
}
}
<form>
<div class="form-group">
<label for="inputUsername">Användarnamn</label>
<input name="username" type="text" class="form-control" placeholder="Ange användarnamn">
</div>
<div class="form-group">
<label for="inputPassword">Lösenord</label>
<input name="password" type="password" class="form-control" placeholder="Ange lösenord">
</div>
<div class="loginButton">
<button type="button" class="btn btn-primary" onclick="login(this.form);">Logga In</button>
</div>
</form>
enter code here
<html>
<head>
<script type="text/javascript">
var n = prompt("Enter your number here", "type your number here");
n = parselnt(n);
if (NaN(n))
{alert("plese enter number");}
else if (n==0)
alert{("The number is zero");}
else if (n%2)
{alert("the number is odd");}
else
{alert("the number is even");}
</script>
</head>
</body><body>
</html>
122
<html>
<head>
<title>Login Page</title>
</head>
<script language="javascript">
function checke(form)
{
if (form.user.value== "Admin" && form.psrd.value=="Admin")
{
alert("login is sucesfull")
}
else
{
alert("Invalid user id")
}
}
</script>
<body>
<table height="10" width="10" border="1px">
<tr>
<td>
<input type="text" name="user">
</td>
<td>
<input type="password" maxlength="8" name="psrd" >
</td>
</tr>
<table>
</body>
</html>
Try changing the button type to button instead of submit.
I did not try it but i guess that your form always does a submit without getting to a evaluate your login-function. Changing the type will prevent that.
Another way would be to maintain the submit type and call preventDefault() function to avoid that behavior.

Submit button not working on login form, using PHP and JavaScript

I am trying to code a simple login page using JavaScript and PHP to help validate the user input values with the values in a database.
However, my submit button doesn't seem to do anything... it just clears the fields.
Here is my code. There are probably MANY errors in it and I apologize for that... the PHP code I wrote is from a collection of other login pages I found on the web and I only started learning JavaScript a couple days ago...
EDIT: I have updated the code based on the mistakes that you guys pointed out. The log in button now no longer refreshes but instead doesn't do anything. I will try to figure it out or start from scratch since there is so much code that I don't understand, haha.
login.html:
`<html>
<head>
<link href='https://fonts.googleapis.com/css?family=Montserrat' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="bootstrap.min.css">
<link type="text/css" rel="stylesheet" href="stylesheet.css" />
<title>Login</title>
</head>
<body>
<div class="header">
<div class="container">
<h1>Login</h1>
</div>
</div>
<div class="form">
<form class="form-horizontal">
<div class="form-group">
<div class="col-sm-10">
<input type="text" class="form-control" id="inputUsername3" name="username" placeholder="Username">
</div>
</div>
<div class="form-group">
<div class="col-sm-10">
<input type="password" class="form-control" id="inputPassword3" name="password" placeholder="Password">
</div>
</div>
<div class="form-group">
<div class=" col-sm-10">
<div class="checkbox">
<label>
<input type="checkbox">Remember me
</label>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-10">
<input id="submit" type="submit" class="btn btn-default" value="Log in">
</div>
</div>
</form>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type="text/javascript" src="js/vendor/jQuery.md5.js"></script>
<script src="login.js"></script>
</div>
</body>
</html>'
login.js
$(document).ready(function(){
$("form").on("submit", function(e){
e.preventDefault();{
var username = $('#inputUsername3').val();
var password = $('#inputPassword3').val();
var newPw = $.md5(password);
if (username != "" && password !="") {
$.ajax ({
url: "doLogin.php",
type: "POST",
async: false,
data: "$username="+username+"&password="+newPw,
success: function(result) {
window.open(success.html);
}
});
} else {
alert("Please enter a username and password.");
}
return false;
});
});
doLogin.php:
<?php
$host="localhost";
&username="";
$password="";
$db_name="atasgtsar";
$tbl_name="members";
$connection =
mysqli_connect("$host", "$username", "$password")or die("Unable to connect.");
mysqli_select_db("$db_name");
$myUsername=$_POST['username'];
$myPassword=$_POST['password'];
$myusername = stripslashes($myusername);
$mypassword = stripslashes($mypassword);
$myusername = mysqli_real_escape_string($myusername);
$mypassword = mysqli_real_escape_string($mypassword);
$sql="SELECT * FROM $tbl_name WHERE username='$myusername' and password='$mypassword'";
$result=mysqli_query($sql);
$count=mysqli_num_rows($result);
if ($count == 1) {
session_register("myusername");
session_register("mypassword");
}
else {
echo "Wrong username or password.";
}
mysqli_close($connection);
?>
Your fields are cleared as the submit button reloads the page.
Use preventDefault(); to stop the submit from happening as you want to submit the data yourself using ajax.
$("form").on("submit", function(e){
e.preventDefault();
//...
Please do not store passwords as plain text in databases, use password_hash() and password_verify().
The MySQL Version you use is deprecated, please use MySQLi or PDO.
There is no type='username', use 'text'.
You call "check(this.form)" from the submit button, but you already bind the jQuery handler to the submit event using js.
If you want to select elements by there ID in jQuery, instead of input[id=username], use #username
Also, there sure are more mistakes in these codes.
I would always recommend to start with an extremely basic layout, print out all information (in js using console.log or alert and in php using echo) and then go n small steps, until you got your working code.
You read out the wrong input fields in your JS and remove the $ in your data string which will send via post.
Here is the correct version.
$(document).ready(function(){
$("#submit").click(function(){
var username = $('input[id=inputUsername3]').val();
var password = $('input[id=inputPassword3]').val();
var newPw = $.md5(password);
if (username != "" && password !="") {
$.ajax ({
url: "doLogin.php",
type: "POST",
async: false,
data: "username="+username+"&password="+newPw,
success: function(result) {
alert(result)
}
});
}
else {
alert("Please enter a username and password.");
}
return false;
});
});
You have also forget the " on the end of the ID.
<div class="col-sm-10">
<input type="username" class="form-control" id="inputUsername3" name="username" placeholder="Username">
</div>
</div>
<div class="form-group">
<div class="col-sm-10">
<input type="password" class="form-control" id="inputPassword3" name="password" placeholder="Password">
</div>
</div>
You have done too many mistakes in HTML and Javascript coding:
<html>
<head>
<link href='https://fonts.googleapis.com/css?family=Montserrat' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="bootstrap.min.css">
<link type="text/css" rel="stylesheet" href="stylesheet.css" />
<title>Login</title>
</head>
<body>
<div class="header">
<div class="container">
<h1>Login</h1>
</div>
</div>
<div class="form">
<form class="form-horizontal">
<div class="form-group">
<div class="col-sm-10">
<input type="text" class="form-control" id="inputUsername3" name="username" placeholder="Username">
</div>
</div>
<div class="form-group">
<div class="col-sm-10">
<input type="password" class="form-control" id="inputPassword3" name="password" placeholder="Password">
</div>
</div>
<div class="form-group">
<div class=" col-sm-10">
<div class="checkbox">
<label>
<input type="checkbox">Remember me
</label>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-10">
<input id="submit" type="submit" class="btn btn-default" value="Log in">
</div>
</div>
</form>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type="text/javascript" src="js/vendor/jQuery.md5.js"></script>
<script src="login.js"></script>
</div>
</body>
</html>
Than in your javascript code:
$(document).ready(function(){
$("#submit").click(function(){
var username = $('#inputUsername3').val();
var password = $('#inputUsername3').val();
var newPw = $.md5(password);
if (username != "" && password !="") {
$.ajax ({
url: "doLogin.php",
type: "POST",
async: false,
data: "$username="+username+"&password="+newPw,
success: function(result) {
alert(result)
}
});
}
else {
alert("Please enter a username and password.");
}
return false;
});
});
In the HTML the "tpye" attribute of the input with name "username" should be "text" and you've forgot to close the quotes after the "id" attribute:
<input type="text" class="form-control" id="inputUsername3" name="username" placeholder="Username">
In your Javascript it seems like you use jQuery but I dont see where you include the library.
The javascript selectors for IDs should be defined like this:
var username = $('#inputUsername3').val();
var password = $('#inputPassword3').val();
Keep in mind that there could be more things that I haven't notice.
The browser automatically posts your data when you click in an submit button that is inside your form, what you have to do is to prevent this default behaviour so that it actually uses your JS code.
change
$("#submit").click(function(){
for
$("form").on("submit", function(e){
e.preventDefault();
Your fields are beeing cleared because your button is a submit button and because you are not redirecting the client to any other page, it refreshes it. From what I see you want to use AJAX, try to use just a simple button with a onclick event (type="button").

Javascript seems to be ignoring my functions

Im having a small problem with my code and i was wondering if someone could explain what i am doeing wrong.
The first textbox should get focus when the page is loaded but that doesnt seem to work either.
The code underneath should jump from 1 textbox to another when the the first textbox reaches a specific number of characters.
The second textbox should submit the form after the textbox reaches a specific number of characters.
So i know the functions check() and submit() dont work,
But i cannot figure out what the problem is.
Can someone help me?
<head>
<!-- Include the needed files-->
<link rel="stylesheet" type="text/css" href="css/style.css">
<script language="javascript">
function check() {
var inhoud = document.formsubmit.locatienummer.value.length + 1;
if (inhoud <= 10)
{ document.formsubmit.locatienummer.focus() }
else
{ document.formsubmit.bonnummer.focus() }
}
<!-- This code makes the form submit -->
function submit() {
var inhoud2 = document.bonnummer.value.length + 1;
if (inhoud2 <= 10)
{ document.formsubmit.bonnummer.focus() }
else
{ document.formsubmit.submit() }
}
</script>
</head>
<body onload="document.formsubmit.locatienummer.focus()">
<div class="wrapper">
<fieldset>
<legend>Locatiescanner</legend>
<br />
<form name="formsubmit" method="POST">
Locatienummer:
<br />
<input type="text" name="locatienummer" onkeyup="check()"><br />
Bonnummer:
<br />
<input type="text" name="bonnummer" onkeyup="submit()"><br />
</form>
</fieldset>
</div>
</body>
</html>
You forgot the equals sign
<form name"formsubmit" method="POST">
/
<form name="formsubmit" method="POST">
Your HTML is invalid try this
<div class="wrapper">
<fieldset>
<legend>Locatiescanner</legend><br/>
<form name="formsubmit" method="POST">
Locatienummer: <br/>
<input type="text" name="locatienummer" onKeyUp="check()"/><br/>
Bonnummer: <br/>
<input type="text" name="bonnummer" onKeyUp="submit()"/><br/>
</form>
</fieldset>
</div>
You forgot the = sign from <form name"formsubmit" method="POST">
and you didn't end the input element

Categories