javascript/jquery validation errors split first 5 errors to show on the left of the page and other 5 to the right?

Vote count:

0

i am using this javascript form validation script that brings up errors if a user doesn't complete areas of the form. the script lists the errors down the page one under the other, but what i want to do is split the 10 errors that display into 2 groups of 5. the first 5 listed to the left of the page and the second group of 5 to be listed to the right, so the two groups appear side by side rather than taking up loads of page space by being listed under each one another.

can someone show me how i can do this because i have tried just giving 5 errors a different div claass/id but this causes the error not to show at all.

<script>
function displayErrors(errors){
    var container = document.getElementById("alertBox2");
    var html = "<ul class='cross'>";

     for(var i=0; i<errors.length; i++){
    html += "<li class='error_line'><p>" + errors[i] + "</p></li>";

    }
    html += "</ul>";


    container.innerHTML = html;
    container.style.display = "block";
}

function validateForm(){
    var cname = document.forms["myForm"]["cname"].value;
    var creg = document.forms["myForm"]["creg"].value;
    var incorp = document.forms["myForm"]["incorp"].value;
    var vat = document.forms["myForm"]["vat"].value;
    var contactn = document.forms["myForm"]["contactn"].value;


    var errors = [];

     if(cname == ""){
document.body.scrollTop = document.documentElement.scrollTop = 0;
   document.getElementById("alertBox").style.display='block';
document.getElementById("field_cname").style.background='#FFC1C1';
        errors.push("You did not complete Company Name");
    }

    if(creg == ""){
document.body.scrollTop = document.documentElement.scrollTop = 0;
   document.getElementById("alertBox").style.display='block';
document.getElementById("field_creg").style.background='#FFC1C1';
        errors.push("You did not complete Company Registration Number");
    }

    if(incorp == ""){
document.body.scrollTop = document.documentElement.scrollTop = 0;
   document.getElementById("alertBox").style.display='block';
document.getElementById("field_incorp").style.background='#FFC1C1';
        errors.push("You did not complete Company Incorporation Date");
    }
     if(vat == ""){
document.body.scrollTop = document.documentElement.scrollTop = 0;
   document.getElementById("alertBox").style.display='block';
document.getElementById("field_vat").style.background='#FFC1C1';
        errors.push("You did not complete Company VAT Number");
    }

    if(contactn == ""){
document.body.scrollTop = document.documentElement.scrollTop = 0;
   document.getElementById("alertBox").style.display='block';
document.getElementById("field_contactn").style.background='#FFC1C1';
        errors.push("You did not complete Contact Name");
    }




    if(errors.length > 0){
        displayErrors(errors);
        return false;
    } else {
        return true;
    }
}
</script>

asked 1 min ago

John Taylor

114