6 Replies Latest reply on May 27, 2014 2:01 PM by Nancy OShea

    Use single message with multiple spry "states"

    Amy Blankenship Level 4

      forgotten past decided to use spry widgets to do the validation. One of the things that can get old pretty quick is to have to create a different message for each thing that can go wrong, even if you need to display the same message. For example, if a user needs to enter 9 digits, the message for entering too few, too many, and letters can pretty much be handled by "The value should be exactly 9 digits."

       

      Is there a way to use just one div/span and have it show for all of these conditions? I need to be able to code this manually, because for whatever reason the widgets don't show up properly in the DW UI (either because it's an old version or because the widgets have been edited by hand at some point in a way that's incompatible with the DW UI). It also needs to be compatible with older browsers (i.e. I could probably do this by assigning multiple classes to the element(s), but I am not sure what browsers would support this). Many of our users are in libraries, so we have to anticipate that the browser may not be up-to-date.

        • 1. Re: Use single message with multiple spry "states"
          Nancy OShea Adobe Community Professional & MVP

          Don't use Spry.  Adobe abandoned the framework in 2012.  It is no longer supported.

          Best advice, use HTML5 forms alone or with jQuery validation.  In the following example, the number field requires 9 characters.  This works in modern browsers.

           

          <form id="MyForm">

          <label for="number">Number:</label>

          <input name="number" type="number"  id="number" placeholder="123456789" maxlength="9" minlength="9" required>

          <input id="submit" name="submit" type="submit" value="SEND">

          </form>

           

           

          For older browsers that don't support HTML5 forms, you can add jQuery validation to your forms by adding this to your document's <head> tag.

           

          <!--LATEST JQUERY CORE LIBRARY-->

          <script src="http://code.jquery.com/jquery-latest.min.js">

          </script>

           

          <!--JQUERY VALIDATE PLUGIN-->

          <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js">

          </script>

           

          <!--INVOKE FORM VALIDATION-->

          <script>

          $(document).ready(function() {

              $("#MyForm").validate();

          });

          </script>

           

           

          Nancy O.

          1 person found this helpful
          • 2. Re: Use single message with multiple spry "states"
            Nancy OShea Adobe Community Professional & MVP

            Actually, a better way is to add a Pattern attribute to limit the type of legal characters that may be used.  This restricts legal values to numbers only.

             

            <form id="MyForm">

            <label for="number">Part Number:</label>

            <input name="number" type="number"  id="number" placeholder="123456789" title="9 numbers required" pattern="[0-9]" minlength="9" maxlength="9" required>

            <input id="submit" name="submit" type="submit" value="SEND">

            <input id="reset" name="reset" type="reset" value="RESET">

            </form>

             

            If you want to include alpha & numeric values, use this:

            pattern="[0-9][A-Z]" title="5 numbers followed by 4 letters required"

             

            Tested & works in Chrome, Firefox, Opera and IE9.

             

             

            Nancy O.

            1 person found this helpful
            • 3. Re: Use single message with multiple spry "states"
              Amy Blankenship Level 4

              I don't seem to be successfully understanding the connection between your reply and my question. From my perspective, my question is about how to use fewer copies of the message (for maintainability). Your answer seems to be about a different way to validate.

               

              And, while I'd love to not use spry, they're part of many of our websites and need to be maintained.  To rebuild to get exactly the same look, feel, and functionality, would not be workable (and if it were, we have higher priorities of things we'd rebuild).

              • 4. Re: Use single message with multiple spry "states"
                Nancy OShea Adobe Community Professional & MVP

                Sorry you didn't like my answer.  I don't know of any way to do what you want.

                 

                Spry outlived it usefulness a long time ago and hasn't been substantially updated or improved since 2006.  If you can't or won't make the transition to HTML5 forms with jQuery validation, I guess you'll have to live with Spry's inconvenience & limitations.

                 

                 

                Nancy O.

                • 5. Re: Use single message with multiple spry "states"
                  Amy Blankenship Level 4

                  That's really odd, since David Powers was showing off spry widgets at the Community Experts Summit in 2007. Wonder why he'd do that if they were out-of-date at that point.

                  • 6. Re: Use single message with multiple spry "states"
                    Nancy OShea Adobe Community Professional & MVP

                    Spry pre-release scripts came out in 2006.  In 2007, these scripts were still viable because touch screen devices didn't exist yet.  A lot has changed in the 8 years since Spry was first developed.  And since Adobe didn't update Spry, it is now obsolete. 

                     

                     

                    Nancy O.

                    1 person found this helpful