// Author: Baghor Younes - http://webwizart.be
// Twitter: @webwizart

// WebWizArt Element - Validation And Error Messaging

    // Validation
        
    //    + function valString(id,error)   
    //    + function valInteger(id,error)
    //    + function valEmpty(id, error)

// Check for a String
function valString(id,error){
    var e = window.document.getElementById(id).value;
    if (!valEmpty(id,error)){
        var reg = /d+/;
        if (!e.match( reg)){
            showBubble(error);
            document.getElementById(error).innerHTML='Not a Word !!';
        }
        else{
            document.getElementById(error).style.display='none';
        }
    }
}
// Check for a Integer
function valInteger(id,error){
    var e = window.document.getElementById(id).value;
        var reg = /[0-9]/;
        if (!e.match( reg)){
            showBubble(error);
            document.getElementById(error).innerHTML='Is not a Number !! .<br />Please fill in a real common set of integers';
        }
        else{
            document.getElementById(error).style.display='none';
        }
}
// Check for Empty Field
function valEmpty(id, error){
    var e = window.document.getElementById(id).value;
    if (e == ""){
        showBubble(error);
        document.getElementById(error).innerHTML='Please fill this field.';
        return false;
    }
    else{
        document.getElementById(error).style.display='none';
        return true;
    }
}b


    // Error Bubble Message
        
    //    + function showBubble(id)

// show's the Error Message
// Here you can style the error bubble
function showBubble(id){
    document.getElementById(id).style.display='block';
    document.getElementById(id).style.position='absolute';
    document.getElementById(id).style.width='150px';
    document.getElementById(id).style.color='#ffffff';
    document.getElementById(id).style.top='0px';
    document.getElementById(id).style.left='95%';
    document.getElementById(id).style.fontSize='12px';
    document.getElementById(id).style.background='red';
    document.getElementById(id).style.border='solid white 1px';
    document.getElementById(id).style.padding='3px';
    document.getElementById(id).style.borderRadius='0px 20px 20px 20px';
    document.getElementById(id).style.zIndex='25';
    document.getElementById(id).style.padding='5px';
    document.getElementById(id).style.paddingLeft='10px';
}