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: 40
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,981
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
« Next Oldest · Client-side Scripting · Next Newest »
 

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

 

Display Mode: Standard · Switch to: Linear+ · Switch to: Outline

Track this topic · Email this topic · Print this topic · Subscribe to this forum

- Lo-Fi Version Time is now: 16th April 2024 - 02:51 PM
Invision Power Board © 2024  IPS, Inc.
Licensed to: HTMLHelp.com, LLC