how to output form values to alert JavaScript
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}
0
Need your help! I hope you will help me..
For example, I have a form that consists of: First Name, Last Name, Email, a drop-down list and 8 divs with lengths of time (when you click on any color changed). When you press the submission button, an alert displays the information of the values that the user entered.
Sample message:
"Name Surname" booked an audition for the film "Spider-Man" for "Leading Role." We are waiting for you in "17: 00-18: 00". Detailed information sent to your "email"
I'm trying to do it in different ways, but nothing comes out
CSS
<style>
.demo {
border: 1px solid black;
width: 100px;
text-align: center;
float: left;
margin: 10px;
}
.selected {
background-color:blue;
border: 1px solid black;
width: 100px;
text-align: center;
float: left;
margin: 10px;
}
.reserved {
background-color:red;
border: 1px solid black;
width: 100px;
text-align: center;
float: left;
margin: 10px;
}
</style>
HTML
<body>
<form action="" name="formName" onsubmit="complete(this)">
<label for="firstName">Firstname : </label>
<input type="text" name="name" id="firstName" placeholder="Enter your firstname" required>
<br>
<br>
<label for="lastName">Lastname : </label>
<input type="text" name="name" id="lastName" placeholder="Enter your lastname" required>
<br>
<br>
<label for="email">Email:</label>
<input type="email" id="email">
<label for="movie">Movie</label>
<select name="movie" id="movie">
<option value=""></option>
<option value="Spider man">Spiderman</option>
<option value="Iron man">Ironman</option>
<option value="Super man">Superman</option>
</select>
<br>
<br>
<label for="movie_role">Role in the movie</label>
<select name="role" id="movie_role">
<option value=""></option>
<option value="main">the main role</option>
<option value="stuntman">stuntman</option>
<option value="extras">extras</option>
<option value="supporting role">supporting role</option>
</select>
<br>
<br>
<div onclick="myFunction()" class="demo">
<p>9:00 - 10:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>10:00 - 11:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>11:00 - 12:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>12:00 - 13:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>14:00 - 15:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>15:00 - 16:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>16:00 - 17:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>17:00 - 18:00</p>
</div>
<br>
<br>
<br>
<br>
<input type="submit" onclick="">
</form>
JavaScript
<script>
var fName = document.getElementById("firstName").value;
var lName = document.getElementById("lastName").value;
var movieList = document.getElementById("movie");
var selectedMovie = movieList.options[movieList.selectedIndex].text;
// function myFunction() {
// if(this.className != "selected" && this.className != "reserved") {
// this.className = "selected";
// //alert ("Da vy zdes !");
// } else if (this.className == "selected" && this.className != "reserved") {
// this.className = "selected";
// var r = confirm("You have booked time. If you change your mind click 'cancel'!");
// if (r == true) {
// alert("Thank you");
// this.className = "selected";
// } else {
// this.className = "reserved";
// alert("You canceled your reservation!");
// }
// } else if (this.className == "reserved") {
// alert("This time is taken!");
// }
// }
/*
function myFunction() {
if(document.getElementById("demo").style.background != "blue" && document.getElementsById("demo").style.background != "red") {
document.getElementById("demo").style.background = "blue";
} else if (document.getElementById("demo").style.background = "blue" && document.getElementById(
"demo").style.background != "red") {
var r = confirm("You have booked time. If you change your mind click 'cancel'!");
if (r == true) {
alert("Thank you")
} else {
document.getElementById("demo").style.background = "white";
alert("You canceled your reservation!")
}
} else if (document.getElementsByClassName("demo").style.background = "red") {
alert("This time is taken!");
}
}
*/
</script>
javascript
asked Nov 23 '18 at 19:53
Timur MuhammedovTimur Muhammedov
1
|
show 1 more comment
0
Need your help! I hope you will help me..
For example, I have a form that consists of: First Name, Last Name, Email, a drop-down list and 8 divs with lengths of time (when you click on any color changed). When you press the submission button, an alert displays the information of the values that the user entered.
Sample message:
"Name Surname" booked an audition for the film "Spider-Man" for "Leading Role." We are waiting for you in "17: 00-18: 00". Detailed information sent to your "email"
I'm trying to do it in different ways, but nothing comes out
CSS
<style>
.demo {
border: 1px solid black;
width: 100px;
text-align: center;
float: left;
margin: 10px;
}
.selected {
background-color:blue;
border: 1px solid black;
width: 100px;
text-align: center;
float: left;
margin: 10px;
}
.reserved {
background-color:red;
border: 1px solid black;
width: 100px;
text-align: center;
float: left;
margin: 10px;
}
</style>
HTML
<body>
<form action="" name="formName" onsubmit="complete(this)">
<label for="firstName">Firstname : </label>
<input type="text" name="name" id="firstName" placeholder="Enter your firstname" required>
<br>
<br>
<label for="lastName">Lastname : </label>
<input type="text" name="name" id="lastName" placeholder="Enter your lastname" required>
<br>
<br>
<label for="email">Email:</label>
<input type="email" id="email">
<label for="movie">Movie</label>
<select name="movie" id="movie">
<option value=""></option>
<option value="Spider man">Spiderman</option>
<option value="Iron man">Ironman</option>
<option value="Super man">Superman</option>
</select>
<br>
<br>
<label for="movie_role">Role in the movie</label>
<select name="role" id="movie_role">
<option value=""></option>
<option value="main">the main role</option>
<option value="stuntman">stuntman</option>
<option value="extras">extras</option>
<option value="supporting role">supporting role</option>
</select>
<br>
<br>
<div onclick="myFunction()" class="demo">
<p>9:00 - 10:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>10:00 - 11:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>11:00 - 12:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>12:00 - 13:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>14:00 - 15:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>15:00 - 16:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>16:00 - 17:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>17:00 - 18:00</p>
</div>
<br>
<br>
<br>
<br>
<input type="submit" onclick="">
</form>
JavaScript
<script>
var fName = document.getElementById("firstName").value;
var lName = document.getElementById("lastName").value;
var movieList = document.getElementById("movie");
var selectedMovie = movieList.options[movieList.selectedIndex].text;
// function myFunction() {
// if(this.className != "selected" && this.className != "reserved") {
// this.className = "selected";
// //alert ("Da vy zdes !");
// } else if (this.className == "selected" && this.className != "reserved") {
// this.className = "selected";
// var r = confirm("You have booked time. If you change your mind click 'cancel'!");
// if (r == true) {
// alert("Thank you");
// this.className = "selected";
// } else {
// this.className = "reserved";
// alert("You canceled your reservation!");
// }
// } else if (this.className == "reserved") {
// alert("This time is taken!");
// }
// }
/*
function myFunction() {
if(document.getElementById("demo").style.background != "blue" && document.getElementsById("demo").style.background != "red") {
document.getElementById("demo").style.background = "blue";
} else if (document.getElementById("demo").style.background = "blue" && document.getElementById(
"demo").style.background != "red") {
var r = confirm("You have booked time. If you change your mind click 'cancel'!");
if (r == true) {
alert("Thank you")
} else {
document.getElementById("demo").style.background = "white";
alert("You canceled your reservation!")
}
} else if (document.getElementsByClassName("demo").style.background = "red") {
alert("This time is taken!");
}
}
*/
</script>
javascript
asked Nov 23 '18 at 19:53
Timur MuhammedovTimur Muhammedov
1
1
You will need a third party library like JQuery UI to open a modal popup. Like this dialog.
– Dominique Fortin
Nov 23 '18 at 19:55
Hello everyone!
– Timur Muhammedov
Nov 23 '18 at 19:56
I need the usual classic alert with form values, but I don't know how to make a function correctly
– Timur Muhammedov
Nov 23 '18 at 19:58
The DOM alert function only shows vanilla text. No HTML, No form input tag, just text.
– Dominique Fortin
Nov 23 '18 at 19:59
I don't understand what you're asking. You want to alert form element values? They are strings, you'd alert them the same way you have other alerts. On related note, you have problems in your code that are unrelated to the alert or the form, such as using assignment where you mean to use an equality check.
– rlemon
Nov 23 '18 at 20:03
|
show 1 more comment
0
0
0
Need your help! I hope you will help me..
For example, I have a form that consists of: First Name, Last Name, Email, a drop-down list and 8 divs with lengths of time (when you click on any color changed). When you press the submission button, an alert displays the information of the values that the user entered.
Sample message:
"Name Surname" booked an audition for the film "Spider-Man" for "Leading Role." We are waiting for you in "17: 00-18: 00". Detailed information sent to your "email"
I'm trying to do it in different ways, but nothing comes out
CSS
<style>
.demo {
border: 1px solid black;
width: 100px;
text-align: center;
float: left;
margin: 10px;
}
.selected {
background-color:blue;
border: 1px solid black;
width: 100px;
text-align: center;
float: left;
margin: 10px;
}
.reserved {
background-color:red;
border: 1px solid black;
width: 100px;
text-align: center;
float: left;
margin: 10px;
}
</style>
HTML
<body>
<form action="" name="formName" onsubmit="complete(this)">
<label for="firstName">Firstname : </label>
<input type="text" name="name" id="firstName" placeholder="Enter your firstname" required>
<br>
<br>
<label for="lastName">Lastname : </label>
<input type="text" name="name" id="lastName" placeholder="Enter your lastname" required>
<br>
<br>
<label for="email">Email:</label>
<input type="email" id="email">
<label for="movie">Movie</label>
<select name="movie" id="movie">
<option value=""></option>
<option value="Spider man">Spiderman</option>
<option value="Iron man">Ironman</option>
<option value="Super man">Superman</option>
</select>
<br>
<br>
<label for="movie_role">Role in the movie</label>
<select name="role" id="movie_role">
<option value=""></option>
<option value="main">the main role</option>
<option value="stuntman">stuntman</option>
<option value="extras">extras</option>
<option value="supporting role">supporting role</option>
</select>
<br>
<br>
<div onclick="myFunction()" class="demo">
<p>9:00 - 10:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>10:00 - 11:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>11:00 - 12:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>12:00 - 13:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>14:00 - 15:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>15:00 - 16:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>16:00 - 17:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>17:00 - 18:00</p>
</div>
<br>
<br>
<br>
<br>
<input type="submit" onclick="">
</form>
JavaScript
<script>
var fName = document.getElementById("firstName").value;
var lName = document.getElementById("lastName").value;
var movieList = document.getElementById("movie");
var selectedMovie = movieList.options[movieList.selectedIndex].text;
// function myFunction() {
// if(this.className != "selected" && this.className != "reserved") {
// this.className = "selected";
// //alert ("Da vy zdes !");
// } else if (this.className == "selected" && this.className != "reserved") {
// this.className = "selected";
// var r = confirm("You have booked time. If you change your mind click 'cancel'!");
// if (r == true) {
// alert("Thank you");
// this.className = "selected";
// } else {
// this.className = "reserved";
// alert("You canceled your reservation!");
// }
// } else if (this.className == "reserved") {
// alert("This time is taken!");
// }
// }
/*
function myFunction() {
if(document.getElementById("demo").style.background != "blue" && document.getElementsById("demo").style.background != "red") {
document.getElementById("demo").style.background = "blue";
} else if (document.getElementById("demo").style.background = "blue" && document.getElementById(
"demo").style.background != "red") {
var r = confirm("You have booked time. If you change your mind click 'cancel'!");
if (r == true) {
alert("Thank you")
} else {
document.getElementById("demo").style.background = "white";
alert("You canceled your reservation!")
}
} else if (document.getElementsByClassName("demo").style.background = "red") {
alert("This time is taken!");
}
}
*/
</script>
javascript
asked Nov 23 '18 at 19:53
Timur MuhammedovTimur Muhammedov
1
Need your help! I hope you will help me..
For example, I have a form that consists of: First Name, Last Name, Email, a drop-down list and 8 divs with lengths of time (when you click on any color changed). When you press the submission button, an alert displays the information of the values that the user entered.
Sample message:
"Name Surname" booked an audition for the film "Spider-Man" for "Leading Role." We are waiting for you in "17: 00-18: 00". Detailed information sent to your "email"
I'm trying to do it in different ways, but nothing comes out
CSS
<style>
.demo {
border: 1px solid black;
width: 100px;
text-align: center;
float: left;
margin: 10px;
}
.selected {
background-color:blue;
border: 1px solid black;
width: 100px;
text-align: center;
float: left;
margin: 10px;
}
.reserved {
background-color:red;
border: 1px solid black;
width: 100px;
text-align: center;
float: left;
margin: 10px;
}
</style>
HTML
<body>
<form action="" name="formName" onsubmit="complete(this)">
<label for="firstName">Firstname : </label>
<input type="text" name="name" id="firstName" placeholder="Enter your firstname" required>
<br>
<br>
<label for="lastName">Lastname : </label>
<input type="text" name="name" id="lastName" placeholder="Enter your lastname" required>
<br>
<br>
<label for="email">Email:</label>
<input type="email" id="email">
<label for="movie">Movie</label>
<select name="movie" id="movie">
<option value=""></option>
<option value="Spider man">Spiderman</option>
<option value="Iron man">Ironman</option>
<option value="Super man">Superman</option>
</select>
<br>
<br>
<label for="movie_role">Role in the movie</label>
<select name="role" id="movie_role">
<option value=""></option>
<option value="main">the main role</option>
<option value="stuntman">stuntman</option>
<option value="extras">extras</option>
<option value="supporting role">supporting role</option>
</select>
<br>
<br>
<div onclick="myFunction()" class="demo">
<p>9:00 - 10:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>10:00 - 11:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>11:00 - 12:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>12:00 - 13:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>14:00 - 15:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>15:00 - 16:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>16:00 - 17:00</p>
</div>
<div onclick="myFunction()" class="demo">
<p>17:00 - 18:00</p>
</div>
<br>
<br>
<br>
<br>
<input type="submit" onclick="">
</form>
JavaScript
<script>
var fName = document.getElementById("firstName").value;
var lName = document.getElementById("lastName").value;
var movieList = document.getElementById("movie");
var selectedMovie = movieList.options[movieList.selectedIndex].text;
// function myFunction() {
// if(this.className != "selected" && this.className != "reserved") {
// this.className = "selected";
// //alert ("Da vy zdes !");
// } else if (this.className == "selected" && this.className != "reserved") {
// this.className = "selected";
// var r = confirm("You have booked time. If you change your mind click 'cancel'!");
// if (r == true) {
// alert("Thank you");
// this.className = "selected";
// } else {
// this.className = "reserved";
// alert("You canceled your reservation!");
// }
// } else if (this.className == "reserved") {
// alert("This time is taken!");
// }
// }
/*
function myFunction() {
if(document.getElementById("demo").style.background != "blue" && document.getElementsById("demo").style.background != "red") {
document.getElementById("demo").style.background = "blue";
} else if (document.getElementById("demo").style.background = "blue" && document.getElementById(
"demo").style.background != "red") {
var r = confirm("You have booked time. If you change your mind click 'cancel'!");
if (r == true) {
alert("Thank you")
} else {
document.getElementById("demo").style.background = "white";
alert("You canceled your reservation!")
}
} else if (document.getElementsByClassName("demo").style.background = "red") {
alert("This time is taken!");
}
}
*/
</script>
javascript
javascript
asked Nov 23 '18 at 19:53
Timur MuhammedovTimur Muhammedov
1
asked Nov 23 '18 at 19:53
Timur MuhammedovTimur Muhammedov
1
asked Nov 23 '18 at 19:53
Timur MuhammedovTimur Muhammedov
1
asked Nov 23 '18 at 19:53
Timur MuhammedovTimur Muhammedov
1
asked Nov 23 '18 at 19:53
Timur MuhammedovTimur Muhammedov
1
1
1
You will need a third party library like JQuery UI to open a modal popup. Like this dialog.
– Dominique Fortin
Nov 23 '18 at 19:55
Hello everyone!
– Timur Muhammedov
Nov 23 '18 at 19:56
I need the usual classic alert with form values, but I don't know how to make a function correctly
– Timur Muhammedov
Nov 23 '18 at 19:58
The DOM alert function only shows vanilla text. No HTML, No form input tag, just text.
– Dominique Fortin
Nov 23 '18 at 19:59
I don't understand what you're asking. You want to alert form element values? They are strings, you'd alert them the same way you have other alerts. On related note, you have problems in your code that are unrelated to the alert or the form, such as using assignment where you mean to use an equality check.
– rlemon
Nov 23 '18 at 20:03
|
show 1 more comment
1
You will need a third party library like JQuery UI to open a modal popup. Like this dialog.
– Dominique Fortin
Nov 23 '18 at 19:55
Hello everyone!
– Timur Muhammedov
Nov 23 '18 at 19:56
I need the usual classic alert with form values, but I don't know how to make a function correctly
– Timur Muhammedov
Nov 23 '18 at 19:58
The DOM alert function only shows vanilla text. No HTML, No form input tag, just text.
– Dominique Fortin
Nov 23 '18 at 19:59
I don't understand what you're asking. You want to alert form element values? They are strings, you'd alert them the same way you have other alerts. On related note, you have problems in your code that are unrelated to the alert or the form, such as using assignment where you mean to use an equality check.
– rlemon
Nov 23 '18 at 20:03
1
1
You will need a third party library like JQuery UI to open a modal popup. Like this dialog.
– Dominique Fortin
Nov 23 '18 at 19:55
You will need a third party library like JQuery UI to open a modal popup. Like this dialog.
– Dominique Fortin
Nov 23 '18 at 19:55
Hello everyone!
– Timur Muhammedov
Nov 23 '18 at 19:56
Hello everyone!
– Timur Muhammedov
Nov 23 '18 at 19:56
I need the usual classic alert with form values, but I don't know how to make a function correctly
– Timur Muhammedov
Nov 23 '18 at 19:58
I need the usual classic alert with form values, but I don't know how to make a function correctly
– Timur Muhammedov
Nov 23 '18 at 19:58
The DOM alert function only shows vanilla text. No HTML, No form input tag, just text.
– Dominique Fortin
Nov 23 '18 at 19:59
The DOM alert function only shows vanilla text. No HTML, No form input tag, just text.
– Dominique Fortin
Nov 23 '18 at 19:59
I don't understand what you're asking. You want to alert form element values? They are strings, you'd alert them the same way you have other alerts. On related note, you have problems in your code that are unrelated to the alert or the form, such as using assignment where you mean to use an equality check.
– rlemon
Nov 23 '18 at 20:03
I don't understand what you're asking. You want to alert form element values? They are strings, you'd alert them the same way you have other alerts. On related note, you have problems in your code that are unrelated to the alert or the form, such as using assignment where you mean to use an equality check.
– rlemon
Nov 23 '18 at 20:03
|
show 1 more comment
1 Answer
1
active
oldest
votes
-1
You need a function inside "" for the onclick event. For example:
<input type="submit" onclick="myFunction()">
<script>
function myFunction() {
var fName = document.getElementById("firstName").value;
var lName = document.getElementById("lastName").value;
alert(fName + lName); //this will alert the first name and the last name.
}
</script>
You can do similar with the others.
answered Nov 23 '18 at 20:05
Marko PanushkovskiMarko Panushkovski
111
That doesn't answer the need expressed in the question.
– Dominique Fortin
Nov 23 '18 at 20:07
Good. But what should I do with div elements, how can I get information from them and repaint them in a different color?
– Timur Muhammedov
Nov 23 '18 at 20:12
Thank you for answer!
– Timur Muhammedov
Nov 23 '18 at 20:15
If you want to interact with the div elements it is better to you the jquery library. You can access the elements in this way:
– Marko Panushkovski
Nov 23 '18 at 20:21
I'd love to do it, but I'm currently trying to figure out Javascript
– Timur Muhammedov
Nov 23 '18 at 20:24
|
show 6 more comments
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53452295%2fhow-to-output-form-values-to-alert-javascript%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
-1
You need a function inside "" for the onclick event. For example:
<input type="submit" onclick="myFunction()">
<script>
function myFunction() {
var fName = document.getElementById("firstName").value;
var lName = document.getElementById("lastName").value;
alert(fName + lName); //this will alert the first name and the last name.
}
</script>
You can do similar with the others.
answered Nov 23 '18 at 20:05
Marko PanushkovskiMarko Panushkovski
111
That doesn't answer the need expressed in the question.
– Dominique Fortin
Nov 23 '18 at 20:07
Good. But what should I do with div elements, how can I get information from them and repaint them in a different color?
– Timur Muhammedov
Nov 23 '18 at 20:12
Thank you for answer!
– Timur Muhammedov
Nov 23 '18 at 20:15
If you want to interact with the div elements it is better to you the jquery library. You can access the elements in this way:
– Marko Panushkovski
Nov 23 '18 at 20:21
I'd love to do it, but I'm currently trying to figure out Javascript
– Timur Muhammedov
Nov 23 '18 at 20:24
|
show 6 more comments
-1
You need a function inside "" for the onclick event. For example:
<input type="submit" onclick="myFunction()">
<script>
function myFunction() {
var fName = document.getElementById("firstName").value;
var lName = document.getElementById("lastName").value;
alert(fName + lName); //this will alert the first name and the last name.
}
</script>
You can do similar with the others.
answered Nov 23 '18 at 20:05
Marko PanushkovskiMarko Panushkovski
111
That doesn't answer the need expressed in the question.
– Dominique Fortin
Nov 23 '18 at 20:07
Good. But what should I do with div elements, how can I get information from them and repaint them in a different color?
– Timur Muhammedov
Nov 23 '18 at 20:12
Thank you for answer!
– Timur Muhammedov
Nov 23 '18 at 20:15
If you want to interact with the div elements it is better to you the jquery library. You can access the elements in this way:
– Marko Panushkovski
Nov 23 '18 at 20:21
I'd love to do it, but I'm currently trying to figure out Javascript
– Timur Muhammedov
Nov 23 '18 at 20:24
|
show 6 more comments
-1
-1
-1
You need a function inside "" for the onclick event. For example:
<input type="submit" onclick="myFunction()">
<script>
function myFunction() {
var fName = document.getElementById("firstName").value;
var lName = document.getElementById("lastName").value;
alert(fName + lName); //this will alert the first name and the last name.
}
</script>
You can do similar with the others.
answered Nov 23 '18 at 20:05
Marko PanushkovskiMarko Panushkovski
111
You need a function inside "" for the onclick event. For example:
<input type="submit" onclick="myFunction()">
<script>
function myFunction() {
var fName = document.getElementById("firstName").value;
var lName = document.getElementById("lastName").value;
alert(fName + lName); //this will alert the first name and the last name.
}
</script>
You can do similar with the others.
answered Nov 23 '18 at 20:05
Marko PanushkovskiMarko Panushkovski
111
answered Nov 23 '18 at 20:05
Marko PanushkovskiMarko Panushkovski
111
answered Nov 23 '18 at 20:05
Marko PanushkovskiMarko Panushkovski
111
answered Nov 23 '18 at 20:05
Marko PanushkovskiMarko Panushkovski
111
111
That doesn't answer the need expressed in the question.
– Dominique Fortin
Nov 23 '18 at 20:07
Good. But what should I do with div elements, how can I get information from them and repaint them in a different color?
– Timur Muhammedov
Nov 23 '18 at 20:12
Thank you for answer!
– Timur Muhammedov
Nov 23 '18 at 20:15
If you want to interact with the div elements it is better to you the jquery library. You can access the elements in this way:
– Marko Panushkovski
Nov 23 '18 at 20:21
I'd love to do it, but I'm currently trying to figure out Javascript
– Timur Muhammedov
Nov 23 '18 at 20:24
|
show 6 more comments
That doesn't answer the need expressed in the question.
– Dominique Fortin
Nov 23 '18 at 20:07
Good. But what should I do with div elements, how can I get information from them and repaint them in a different color?
– Timur Muhammedov
Nov 23 '18 at 20:12
Thank you for answer!
– Timur Muhammedov
Nov 23 '18 at 20:15
If you want to interact with the div elements it is better to you the jquery library. You can access the elements in this way:
– Marko Panushkovski
Nov 23 '18 at 20:21
I'd love to do it, but I'm currently trying to figure out Javascript
– Timur Muhammedov
Nov 23 '18 at 20:24
That doesn't answer the need expressed in the question.
– Dominique Fortin
Nov 23 '18 at 20:07
That doesn't answer the need expressed in the question.
– Dominique Fortin
Nov 23 '18 at 20:07
Good. But what should I do with div elements, how can I get information from them and repaint them in a different color?
– Timur Muhammedov
Nov 23 '18 at 20:12
Good. But what should I do with div elements, how can I get information from them and repaint them in a different color?
– Timur Muhammedov
Nov 23 '18 at 20:12
Thank you for answer!
– Timur Muhammedov
Nov 23 '18 at 20:15
Thank you for answer!
– Timur Muhammedov
Nov 23 '18 at 20:15
If you want to interact with the div elements it is better to you the jquery library. You can access the elements in this way:
– Marko Panushkovski
Nov 23 '18 at 20:21
If you want to interact with the div elements it is better to you the jquery library. You can access the elements in this way:
– Marko Panushkovski
Nov 23 '18 at 20:21
I'd love to do it, but I'm currently trying to figure out Javascript
– Timur Muhammedov
Nov 23 '18 at 20:24
I'd love to do it, but I'm currently trying to figure out Javascript
– Timur Muhammedov
Nov 23 '18 at 20:24
|
show 6 more comments
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53452295%2fhow-to-output-form-values-to-alert-javascript%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
1
You will need a third party library like JQuery UI to open a modal popup. Like this dialog.
– Dominique Fortin
Nov 23 '18 at 19:55
Hello everyone!
– Timur Muhammedov
Nov 23 '18 at 19:56
I need the usual classic alert with form values, but I don't know how to make a function correctly
– Timur Muhammedov
Nov 23 '18 at 19:58
The DOM alert function only shows vanilla text. No HTML, No form input tag, just text.
– Dominique Fortin
Nov 23 '18 at 19:59
I don't understand what you're asking. You want to alert form element values? They are strings, you'd alert them the same way you have other alerts. On related note, you have problems in your code that are unrelated to the alert or the form, such as using assignment where you mean to use an equality check.
– rlemon
Nov 23 '18 at 20:03