The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Quick Question about display, New to HTML and JavaScript
newToCompSci
post Feb 10 2021, 10:52 PM
Post #1





Group: Members
Posts: 1
Joined: 10-February 21
Member No.: 27,788



Hello all, I am relatively new to Web design and my teacher isn't the most helpful individual. We were given an assignment to use javascript to verify if credit card numbers were incorrect or valid. While I think the function itself is correct (for the assignment), my professor never really explained how to display things properly with the forms (he never really explained anything lol). I was hoping someone could take a look at this and see what's wrong with the form, display, and/or variable types. After entering a card number the display does nothing: the number disappears from the box and nothing happens. Thank you!!

PS. no I don't want your credit card, thats just the assignment

<html>
<head>
<title>
Homework 3
</title>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<script>
function validateCard() {
var card = document.forms["creditCard"]["fname"].value;
var total = 0;
for(i=0;i<card.length;i++) {
if(i%2 == 0){
j = card.slice(i,i+1)*2;
if(j>=10){
k = j.slice(1,2) + j.slice(2,3);
total = total + parseInt(k);
}else{
total = total + parseInt(j);
}
}else{
total = total + parseInt(card.slice(i,i+1));
}
}
if(total % 10 == 0 && card.length == 16){
document.getElementById("result").innerHTML = "That is a valid card number";

}else{
document.getElementById("result").innerHTML = "That is not a valid card number";

}
}
</script>
</head>
<body>
<form name="creditCard" onsubmit="validateCard()">
Please enter your credit card number: <input type="text" name="fname">
<p id="result"></p>

</form>
</body>
</html>

This post has been edited by newToCompSci: Feb 10 2021, 10:58 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
The_webmaster
post Feb 11 2021, 12:23 AM
Post #2


Member
***

Group: Members
Posts: 32
Joined: 5-February 21
Member No.: 27,773



Try this
CODE
<script type="text/javascript"> function validateCard() { if(checkCreditCard(document.getElementById('fname').value,document.getElementById('CardType').value)) { alert("credit card has a valid format") } else { alert("ccErrors[ccErrorNo]) }; } </script>
<!--Your form gose here-->


This post has been edited by The_webmaster: Feb 11 2021, 12:26 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
CharlesEF
post Feb 11 2021, 04:41 AM
Post #3


Programming Fanatic
********

Group: Members
Posts: 1,816
Joined: 27-April 13
From: Edinburg, Texas
Member No.: 19,088



Your main problem is that you are using the form onsubmit event to run your function, anything your function does is wiped out when the page reloads. Even if there was an error the page will still submit. The easiest thing to do when just learning is to remove the onsubmit="..." part from the HTML and add a button to run the function.

This post has been edited by CharlesEF: Feb 11 2021, 04:43 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 21st June 2021 - 09:15 AM