CODEWITHSUNDEEP
javascripthtml
coolrider
coolrider

Reputation: 1

javascript function in html form

I have seen some other threads like this but they don't seem to help me in my problem. I am new to Javascript and I am struggling to understand which value in the email input has to be called in my javascript function to make it work. 

<input type="email" name="myEmail"  value="" class="form-control" required placeholder="Please Enter your email" maxlength="50">

The function I am using is this: 

function check_v_mail('myEmail') {
    fld_value = document.getElementById(field).value;
    is_m_valid = 0;
    if (fld_value.indexOf('@') >= 1) {
        m_valid_dom = fld_value.substr(fld_value.indexOf('@')+1);
        if (m_valid_dom.indexOf('@') == -1) {
            if (m_valid_dom.indexOf('.') >= 1) {
                m_valid_dom_e = m_valid_dom.substr(m_valid_dom.indexOf('.')+1);
                if (m_valid_dom_e.length >= 1) {
                    is_m_valid = 1;
                }
            }
        }
    }
    if (is_m_valid) {
        update_css_class(field, 2);
        m_valid_r = 1;
    } else {
        update_css_class(field, 1);
        m_valid_r = 0;
    }
    return m_valid_r;
}

This function is saved as email_script.js and is called in my footer as follows:

<script src="includes/js/email_script.js"></script>

What am I doing wrong?

Upvotes: 0

Views: 66

Answers (4)

Cassie
Cassie

Reputation: 1

To expand on a comment by Mani:

Right now the signature of your function check_v_mail is incorrect, it is written like a call to a function.

Signature in email_script.js could be:

function check_v_mail(emailFieldId) {
   fld_value = document.getElementById(emailFieldId).value;

   return m_valid_r;
}

Calling on the form could be:

<form onsubmit="return check_v_mail('myEmail');" method="post"></form>

A slight tweak is to have a validate function or class that handles the validation. This can be expanded to call multiple different validation methods and decreases the likelihood that the onsubmit will become complex with additional validations.

<form onsubmit="return validateForm();" method="post"></form>

function validateForm() {
    var emailValid = check_v_mail('myEmail')
    var firstNameValid = validateFirstName('firstNameInput');

    return emailValid && firstNameValid;
}

Upvotes: 0

kodebot
kodebot

Reputation: 1778

In addition to calling the function on form submit or field exit, you also need to add id attribute to your element because your function uses getElementById() to get the element but your input element doesn't have id attribute

<input type="email" name="myEmail"  id ="myEmail" value="" class="form-control" required placeholder="Please Enter your email" maxlength="50">

Upvotes: 0

Polynomial Proton
Polynomial Proton

Reputation: 5135

<form name="myForm" onsubmit="return check_v_mail('myEmail')" method="post">
Email: <input type="email" name="myEmail"  value="" class="form-control" required placeholder="Please Enter your email" maxlength="50">
<input type="submit" value="Submit">
</form>

You can add it in form's onsubmit

Upvotes: 0

mti2935
mti2935

Reputation: 12027

You need to call the check_v_mail function. Usually, this is done when the user clicks the button to submit the form.

Upvotes: 1

Related Questions