I want to display script errors in a popup alert instead of showing them in the browser console.
window.onerror = function() {
var message = /* get error messages and put them here */;
alert(message);
return true;
};
I want to display script errors in a popup alert instead of showing them in the browser console.
window.onerror = function() {
var message = /* get error messages and put them here */;
alert(message);
return true;
};
Yes, that is the correct way.
See the reference here:
http://www.javascriptkit.com/javatutors/error2.shtml
And explanation of how to see more details of the error here:
http://www.javascriptkit.com/javatutors/error3.shtml
Their example:
window.onerror = function(msg, url, linenumber) {
alert('Error message: '+msg+'\nURL: '+url+'\nLine Number: '+linenumber);
return true;
}
If you wish to display a LIST of errors in a single pop-up, it's trickier.
Since the errors occue 1 by 1, you need to do the following:
window.onerror
handler store error details in some arrayCheck that array periodically - either via a timer, or on every N'th call of window.onerror
handler, or both.
When the check happens, process entire array, display contents as desired, and empty out an array
Just in case someone would like to use it with jQuery:
$(window).on("error", function(evt) {
console.log("jQuery error event:", evt);
var e = evt.originalEvent; // get the javascript event
console.log("original event:", e);
if (e.message) {
alert("Error:\n\t" + e.message + "\nLine:\n\t" + e.lineno + "\nFile:\n\t" + e.filename);
} else {
alert("Error:\n\t" + e.type + "\nElement:\n\t" + (e.srcElement || e.target));
}
});
Have a look at The onerror event of the window object, specifically Getting additional details on an error
Check this out: http://www.javascriptkit.com/javatutors/error3.shtml. Looks like signature is function(message, url, linenumber)
.
Help to solve this issue
Character if exceeds in name 20 error message should be displayed dont use max in html here.
Date of birth should be between 1990-2010
<script>
function validation(){
var errorMsg = new Array();
if(!document.getElementById("name").value){
errorMsg.push("Please Enter Full Name");
}
if(!document.getElementById("age").value){
errorMsg.push("Please Enter age");
}
if(!document.getElementById("designation").value){
errorMsg.push("Please Enter designation");
}
if(!document.getElementById("salary").value){
errorMsg.push("Please Enter salary");
}
if(!document.getElementById("dob").value){
errorMsg.push("Please Enter dob");
}
var messageHtml = "";
errorMsg.forEach(function (message) {
messageHtml += "<li>" + message + "</li>";
}
document.getElementById("error").innerHTML = messageHtml;
}
</script>
<style>
#empForm{
position:absolute;
padding-left: 10px;
top: 25%;
left: 55%;
width:18em;
height:20em;
margin-top: -9em;
margin-left: -15em;
border: 1px solid #ccc;
background-color: #f3f3f3;
}
#salary{
margin-left: 48px;
}
#date{
margin-left: 6px;
padding-right: 26px;
}
#designation{
margin-left: 10px;
}
#age{
margin-left: 59px;
}
#name{
margin-left: 47px;
}
#submit{
}
</style>
<html>
<head>
<title>Employee Details</title>
<body>
<div id=empForm>
<h1>Registration Form</h1>
<form name="EmployeeData" action="return validation()">
<div><label>Name </label><input type="text" id="name" name="name"></div></br>
<div><label>Age </label><input type="number" id="age" name="age"></div></br>
<div><label>Designation </label><input type="text" id="designation" name="designation"></div></br>
<div><label>Salary </label><input type="number" id="salary" name="salary"></div></br>
<div><label>Date of Birth </label><input type="date" id="date" name="date"></div></br>
<div id="submit"><center><input type="submit" name="submit" ></center></div>
</div>
</body>
</html>
<script>$(window).on("error", function(evt) {
console.log("jQuery error event:", evt);
var e = evt.originalEvent; // get the javascript event
console.log("original event:", e);
if (e.message) {
alert("Error:\n\t" + e.message + "\nLine:\n\t" + e.lineno + "\nFile:\n\t" + e.filename);
} else {
alert("Error:\n\t" + e.type + "\nElement:\n\t" + (e.srcElement || e.target));
}
});
</script>