0

I have a form and some of the fields are required, how do I target only those?

Here is my code:

<p><strong>Your Information</strong></p>

<p><label for="name">Name <span style="color:#990000;">*</span></label><br />
<input required type="text" name="name" id="name" class="input" style="width: 250px; margin-left: 0px;"/></p>

<p><label for="brokerOffice">Broker Office <span style="color:#990000;">*</span></label><br />
<input required type="text" name="brokerOffice" id="brokerOffice" class="input" style="width: 250px; margin-left: 0px;"/></p>

<p><label for="email">Email Address <span style="color:#990000;">*</span></label><br />
<input required type="text" name="email" id="email" class="input" style="width: 250px; margin-left: 0px;"/></p>

<p><label for="phone">Phone <span style="color:#990000;">*</span></label><br />
<input required type="text" name="phone" id="phone" class="input" style="width: 250px; margin-left: 0px;"/></p>

Can you target them using the attr selector?

Rick Bross
  • 121
  • 1
  • 10
  • 2
    ... Really? Ask a yes or no question that you already know the answer to that is already answered in the documentation? That's like asking if i can get the innerHTML of a div using the innerHTML property. – Kevin B Sep 11 '13 at 18:22
  • 1
    ... and you post invalid html, with double IDs all over. – Sergio Sep 11 '13 at 18:23
  • 2
    I couldnt find it on the site... so I added it. StackOverflow is as good, if not better, then most documentation, and many users come here (deliberately or via google) first for their answers. – Rick Bross Sep 11 '13 at 18:24
  • 1
    You can delete this and get the reputation points back, if you want. – Sergio Sep 11 '13 at 19:08

1 Answers1

6

You can treat "required" as an attribute and target any of the following ways:

<script>

    $(document).ready(function() {

        $('input[required]').css("border-color", "red");
        $('input[required="true"]').css("border-color", "red");
        $('input[required="required"]').css("border-color", "red");
        $('input:required').css("border-color", "red");

    });

</script>
Rick Bross
  • 121
  • 1
  • 10
  • 1
    Good sleuthing. Nevermind the naysayers - it's always great when one can answer his own question. – cssyphus Sep 11 '13 at 18:35