javascript and html forms

I have a form that is validated using HTML, I have couple of functions some of them can access the form and the other can`t!

here is my form:

<form id="contactForm" action="javascript:submitForm()" method="post">
    <table align="center">
        <tr>
            <th>Name:</th>
            <td><input type="text" id="name" name="name" value="a" /></td>
        </tr>
        <tr>
            <th>email:</th>
            <td><input type="text" id="email" name="email" value="sikas@sikas.x10.mx" /></td>
        </tr>
        <tr>
            <th>Message:</th>
            <td><textarea type="text" id="message" name="message">msg</textarea></td>
        </tr>
        <tr>
            <td colspan="2"><input type="submit" value="Login" /></td>
        </tr>
    </table>
</form>

and this is my script, it is divided into two parts, one of them is with the form in the same file and the other is in another file:

this is the part with the form:

<script type="text/javascript">
function check()
{
    name = document.getElementById('name').value;
    email = document.getElementById('email').value;
    message = document.getElementById('message').value;
    if(name.length == 0 || email.length == 0 || message.length == 0)
    {
        alert("Name Required\nEmail Required\nMessage Required");
        return false;
    }
    else
    {
        var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
        var address = email;
        if(reg.test(address) == false)
        {
            alert("Email Invalid");
            return false;
        }
    }
    return true;
}

var form;

function submitForm()
{
    if(check() == false)
        return false;
    else
    {
        form = document.getElementById('contactForm').innerHTML;
        document.getElementById('contactForm').innerHTML = "<h3>Sending ...</h3>";
        send();
        setTimeout("restoreForm()",1000);
    }
    return false;
}

function restoreForm()
{
    document.getElementById('contactForm').innerHTML = form;
}
</script>

and this is in the file:

// JavaScript Document
function createObject()
{
    var request_type;
    var browser = navigator.appName;
    if(browser == "Microsoft Internet Explorer")
    {
        request_type = new ActiveXObject("Microsoft.XMLHTTP");
    }
    else
    {
        requ开发者_C百科est_type = new XMLHttpRequest();
    }
    return request_type;
}

var http = createObject();
var usr;
var psw;
function send()
{
    alert(document.getElementById('name').value);
    alert(document.getElementById('email').value);
    alert(document.getElementById('message').value);

    contactName = encodeURI(document.getElementById('name').value);
    contactEmail = encodeURI(document.getElementById('email').value);
    contactMessage = encodeURI(document.getElementById('message').value);
    http.open('get', 'send.php?name='+contactName+'&email='+contactEmail+'&message='+contactMessage);
    http.onreadystatechange = loginReply;
    http.send(null);
}

function loginReply()
{
    if(http.readyState == 4)
    {
        var response = http.responseText;
        alert(response);
        if(response == 0)
            //document.getElementById('submitForm').innerHTML = "<h6>Sending Failed</h6>";
            alert('failed');
        else
            //document.getElementById('submitForm').innerHTML = "<h6>Message Sent</h6>";
            alert('sent');
        //setTimeout("restoreForm()",1000);
    }
}

need help in making the script from the file access the form fields.

UPDATE:

I have managed to solve this problem. The problem is in this function

function submitForm()
{
    if(check() == false)
        return false;
    else
    {
        form = document.getElementById('contactForm').innerHTML;
        document.getElementById('contactForm').innerHTML = "<h3>Sending ...</h3>";
        send();
        setTimeout("restoreForm()",1000);
    }
    return false;
}

The function send() connect to another page and sends data to email through it, when I have changed the innerHTML of the form before calling the function made the function to break when try to access a field that doesn`t exist.

---

Replace submitForm in:

document.getElementById('submitForm').innerHTML = "<h6>Message Sent</h6>"; 

And

document.getElementById('submitForm').innerHTML = "<h6>Sending Failed</h6>";

With contactForm

---

Why don't you use JQuery? All of this code you're writing from scratch is packaged into a small, tight, reusable JavaScript library that was designed to let you focus on your business goals, not reinventing the wheel.

My suggestion is to check out http://jquery.com/ and go through some of the examples. I believe it will save you a lot of time and headache in the future.

Remember, your employer is paying you to solve problems the further their business goals, not solve the same problems that other developers have already solved for you.