Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>First off, there are a couple of changes in your HTML that you should make which will not only help you solve this issue, but will also make for cleaner, more valid code:</p> <ol> <li>Add a <code>for</code> attribute to all of your <code>&lt;label&gt;</code> tags that pairs them with the input that they match (this really should always be done with labels), and </li> <li>Move the <code>&lt;span class="required"&gt; *&lt;/span&gt;</code> inside the label (since it really is part of the label)</li> </ol> <p>The resulting code would look like this:</p> <pre><code>&lt;fieldset&gt; &lt;p&gt; &lt;label for="txtBox"&gt;SOME LABEL&lt;span class="required"&gt; *&lt;/span&gt;&lt;/label&gt; &lt;/p&gt; &lt;input type="text" id="txtBox"&gt; &lt;/fieldset&gt; </code></pre> <p>Once you've done that, what you are trying to accomplish becomes much easier:</p> <p>Instead of:</p> <pre><code>ctrl.closest('fieldset').find('span.required').addClass('missing'); </code></pre> <p>. . . you can use the id of the input (<code>val.controltovalidate</code>) as part of a JQuery selector to find the related label directly:</p> <pre><code>var $targetLabel = $("label[for='" + val.controltovalidate +"']") $targetLabel.find('span.required').addClass('missing'); </code></pre> <p>I've used this many times to pair validations with the labels of the field that is being validated . . . quick and clean. :)</p> <p><strong>Edit:</strong> I split up the last JS piece to keep it from scrolling, but it could be one line. :)</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