Note that there are some explanatory texts on larger screens.

plurals
  1. POhow to check the status of css through javascript
    text
    copied!<p>I have a JavaScript file that validates if the text-box is filled out or not. I want to make it that if all the text-boxes are all filled out correctly, it should go on to the next page or what ever the case is. (In my case just to display an alert message box.) I would appreciate any answer as soon as possible. Thanks in advance.</p> <p><strong>HTML</strong></p> <pre><code>&lt;form name="form" onSubmit="return validate()" method="post"&gt; &lt;p&gt; &lt;label class="tittle"&gt;Name:&lt;/label&gt; &lt;span&gt; &lt;input type="text" name="firstname" placeholder="First Name" class="info" size="25" maxlength="25" onBlur="return validateFirstName()"&gt; &lt;label class="fillerror" id="fillFirst"&gt; First name is required &lt;/label&gt; &lt;/span&gt; &lt;span&gt; &lt;input type="text" name="lastname" placeholder="Last Name" class="info" size="25" maxlength="25" onBlur="return validateLastName()"&gt; &lt;label class="fillerror" id="fillLast"&gt; Last name is required &lt;/label&gt; &lt;/span&gt; &lt;/p&gt; &lt;p&gt; &lt;input type="button" name="register" value="Register" class="register" onClick="return validateFirstName(), validateLastName(), allValidated();"&gt; &lt;/p&gt; &lt;/form&gt; </code></pre> <p><strong>JavaScript</strong></p> <pre><code>function xValidate(inbox, fill) { inbox.style.backgroundColor="rgba(255, 0, 0, .1)"; inbox.style.borderLeft="3px solid red"; fill.style.display="block"; } function yValidate(inbox, fill) { inbox.style.backgroundColor="white"; inbox.style.borderLeft="3px solid rgb(169, 184, 1)"; fill.style.display="none"; } function validateFirstName() { var frstnm = document.forms["form"] ["firstname"].value; var inbox = document.forms["form"] ["firstname"]; var firstname = document.getElementById("fillFirst"); if (frstnm==null || frstnm=="" || frstnm==" ") { xValidate(inbox, firstname); } else { yValidate(inbox, firstname); } } function validateLastName() { var lstnm = document.forms["form"] ["lastname"].value; var inbox = document.forms ["form"] ["lastname"]; var lastname = document.getElementById("fillLast"); if (lstnm==null || lstnm=="" || lstnm==" ") { xValidate(inbox, lastname); } else { yValidate(inbox, lastname); } </code></pre> <p>}</p> <p>This is <strong>the</strong> function I need help on, all other code here was just for information to understand this last statement:</p> <pre><code>function allValidated() { var allrGood = document.getElementsByClassName("fillerror"); if (allrGood.style.display="none" == true) { alert("They're all good"); } else if (allrGood.style.display="block" == true) { alert("Something is displayed 'block'"); } } </code></pre> <p>If it doesn't work with an 'if' statement, then maybe it would work with a 'for' or 'while' statement (looping statement) then please show me.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload