make a date pretty

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • quillbreaker@gmail.com

    make a date pretty

    I'd like a Javascript snippet that converts a dot.net style date
    string (say, 9/1/2006) into the pretty version (September 1st, 2006),
    so my users get a visual cue when they are entering January 2nd,2009
    when they meant to enter Febuary 1st, 2009. Does anyone have such a
    thing lying around somewhere? I'm not much of a javascript programmer.
  • Thomas 'PointedEars' Lahn

    #2
    Re: make a date pretty

    quillbreaker@gm ail.com wrote:
    I'd like a Javascript snippet that converts a dot.net style date
    string (say, 9/1/2006) into the pretty version (September 1st, 2006),
    so my users get a visual cue when they are entering January 2nd,2009
    when they meant to enter Febuary 1st, 2009. Does anyone have such a
    thing lying around somewhere?
    Yes, it's in the archives. Using Google Groups already, you will have no
    difficulty at all to find them.
    I'm not much of a javascript programmer.
    That's tough luck, though.


    PointedEars
    --
    Use any version of Microsoft Frontpage to create your site.
    (This won't prevent people from viewing your source, but no one
    will want to steal it.)
    -- from <http://www.vortex-webdesign.com/help/hidesource.htm>

    Comment

    • RobG

      #3
      Re: make a date pretty

      On Oct 3, 7:37 am, quillbrea...@gm ail.com wrote:
      I'd like a Javascript snippet that converts a dot.net style date
      string (say,  9/1/2006) into the pretty version (September 1st, 2006),
      so my users get a visual cue when they are entering January 2nd,2009
      when they meant to enter Febuary 1st, 2009.  Does anyone have such a
      thing lying around somewhere?  I'm not much of a javascript programmer.
      If you don't know much about javascript, you wont know good code from
      bad so spend a bit of time learning the basics. You can probably find
      hundreds of scripts and libraries that will do what you want, but
      writing it yourself isn't that tough.

      Below is an example - not production ready but should start you on the
      right track:

      <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
      "http://www.w3.org/TR/html4/strict.dtd">
      <html>
      <head>
      <title>Enter Date</title>
      <style type="text/css">
      body {
      font-family: geneva, arial, sans-serif;
      }
      td {
      vertical-align: top;
      }
      #dateA_full {
      font-family: arial, sans-serif;
      font-size: 80%;
      color: #666666;
      background-color: ffffff;
      }

      </style>
      <script type="text/javascript">

      // Expects date, month, year
      function validateDate(d, m, y) {
      var D = new Date( y + '/' + m + '/' + d);
      return d == D.getDate() && m == (D.getMonth()+1 );
      }

      // Adds 'st', 'nd', etc. to numbers
      function addOrdinal(n) {
      n = n % 100;
      var s = ["th", "st", "nd", "rd", "th"];
      var ord = (n<21)? ((n < 4)? s[n] : s[0])
      : ((n%10 4)? s[0] : s[n%10]);
      return n + ord;
      }

      // Expects a date as dd/mm/yyy, returns as date with ordinal
      // month as word and year, e.g.
      // 1/2/2008 -1st February, 2008
      function formatDate(txt) {
      var months = ['','January', 'February', 'March', 'April',
      'May', 'June', 'July', 'August', 'September',
      'October', 'November', 'December'];
      var dateBits = txt.split('/');

      if (dateBits.lengt h == 3 &&
      validateDate(da teBits[0], dateBits[1], dateBits[2]))
      {
      return addOrdinal(date Bits[0]) + ' ' +
      months[dateBits[1]] + ', ' +
      dateBits[2];
      } else {
      return 'Doesn\'t seem to be a valid date&hellip;';
      }
      }

      </script>
      </head>
      <body>
      <table>
      <tr>
      <td>Enter date (dd/mm/yyyy):
      <td><input type="text" name="dateA" onblur="
      document.getEle mentById('dateA _full').innerHT ML =
      formatDate(this .value);
      ">
      <br>
      <span id="dateA_full" >&nbsp;</span>
      </table>

      </body>
      </html>


      --
      Rob

      Comment

      • Dr J R Stockton

        #4
        Re: make a date pretty

        In comp.lang.javas cript message <7cdd2227-7218-483b-a89d-13da62683a02@x4
        1g2000hsb.googl egroups.com>, Thu, 2 Oct 2008 19:11:59, RobG
        <rgqld@iinet.ne t.auposted:
        return d == D.getDate() && m == (D.getMonth()+1 );
        var dateBits = txt.split('/');
        If a RegExp match is used instead of Array split, and if that match
        allows at most two digits for day-of-month, then only the Month equality
        test will be needed.

        Your code fails in Century Zero (no sense of history in the ex-
        Colonies?) <g>.

        --
        (c) John Stockton, nr London, UK. ?@merlyn.demon. co.uk Turnpike v6.05 MIME.
        Web <URL:http://www.merlyn.demo n.co.uk/- FAQqish topics, acronyms & links;
        Astro stuff via astron-1.htm, gravity0.htm ; quotings.htm, pascal.htm, etc.
        No Encoding. Quotes before replies. Snip well. Write clearly. Don't Mail News.

        Comment

        • Dr J R Stockton

          #5
          Re: make a date pretty

          On Oct 3, 7:33 pm, dhtml <dhtmlkitc...@g mail.comwrote:
            2.10 Internationaliz ation and Multinationaliz ation in javascript.
          >
          |  For example, there is an International Standard
          | for numeric Gregorian date format; but none for decimal
          | and thousands separators.
          >
          There is a separator defined in CLDR. If you want to L10N on the client,
          for dates, currencies, numbers, look into CLDR. I can't at the moment
          bring up unicode.org site, but it is there.
          >
          The same thing goes for dates.
          Whatever CLDR means, it is not an International Standard unless it has
          been published by ISO as such.

          To get an International Standard for decimal and thousands separators,
          it would at present be necessary for the French and the Americans to
          agree on which of them should change. IMHO, that will not happen,
          until enforced by the Chinese.

          --
          (c) John Stockton, near London, UK. Posting with Google.
          Mail: J.R.""""""""@ph ysics.org or (better) via Home Page at
          Web: <URL:http://www.merlyn.demo n.co.uk/>
          FAQish topics, acronyms, links, etc.; Date, Delphi, JavaScript, ....|

          Comment

          • John W Kennedy

            #6
            Re: make a date pretty

            Dr J R Stockton wrote:
            On Oct 3, 7:33 pm, dhtml <dhtmlkitc...@g mail.comwrote:
            >
            > 2.10 Internationaliz ation and Multinationaliz ation in javascript.
            >>
            >| For example, there is an International Standard
            >| for numeric Gregorian date format; but none for decimal
            >| and thousands separators.
            >>
            >There is a separator defined in CLDR. If you want to L10N on the client,
            >for dates, currencies, numbers, look into CLDR. I can't at the moment
            >bring up unicode.org site, but it is there.
            >>
            >The same thing goes for dates.
            >
            Whatever CLDR means, it is not an International Standard unless it has
            been published by ISO as such.
            The Unicode Common Locale Data Repository. It's not a standard for
            thousands separators (an impossibility at present, as you observe
            below), but, as the name indicates, is planned to be a good place, when
            it is released, to obtain the correct value.
            To get an International Standard for decimal and thousands separators,
            it would at present be necessary for the French and the Americans to
            agree on which of them should change. IMHO, that will not happen,
            until enforced by the Chinese.
            --
            John W. Kennedy
            "Give up vows and dogmas, and fixed things, and you may grow like
            That. ...you may come to think a blow bad, because it hurts, and not
            because it humiliates. You may come to think murder wrong, because it
            is violent, and not because it is unjust."
            -- G. K. Chesterton. "The Ball and the Cross"

            Comment

            • RobG

              #7
              Re: make a date pretty

              On Oct 4, 5:31 am, Dr J R Stockton <j...@merlyn.de mon.co.ukwrote:
              In comp.lang.javas cript message <7cdd2227-7218-483b-a89d-13da62683a02@x4
              1g2000hsb.googl egroups.com>, Thu, 2 Oct 2008 19:11:59, RobG
              <rg...@iinet.ne t.auposted:
              >
                   return d == D.getDate() && m == (D.getMonth()+1 );
                   var dateBits = txt.split('/');
              >
              If a RegExp match is used instead of Array split, and if that match
              allows at most two digits for day-of-month, then only the Month equality
              test will be needed.
              Sure, but I don't think it provides any benefit. The RegExp can be
              build once to save some processing power, but you are still trading a
              RegExp comparison with a getMonth comparison. Calling it several
              thousand times in succession may prove the point but I think it's
              moot.

              Your code fails in Century Zero (no sense of history in the ex-
              Colonies?) <g>.
              Some of us claim to have been here for 60,000 years or so - I'm not
              sure the Gregorian calendar has much meaning for that timeframe, "the
              dreaming" seems far more appropriate. ;-)


              --
              Rob

              Comment

              • dhtml

                #8
                Re: make a date pretty

                John W Kennedy wrote:
                Dr J R Stockton wrote:
                >On Oct 3, 7:33 pm, dhtml <dhtmlkitc...@g mail.comwrote:
                >>
                >> 2.10 Internationaliz ation and Multinationaliz ation in javascript.
                >>>
                >>| For example, there is an International Standard
                >>| for numeric Gregorian date format; but none for decimal
                >>| and thousands separators.
                >>>
                >>There is a separator defined in CLDR. If you want to L10N on the client,
                >>for dates, currencies, numbers, look into CLDR. I can't at the moment
                >>bring up unicode.org site, but it is there.
                >>>
                >>The same thing goes for dates.
                >>
                >Whatever CLDR means, it is not an International Standard unless it has
                >been published by ISO as such.
                >
                The Unicode Common Locale Data Repository. It's not a standard for
                thousands separators (an impossibility at present, as you observe
                below), but, as the name indicates, is planned to be a good place, when
                it is released, to obtain the correct value.
                >
                I'm not that versed in unicode standards -- far from being an expert,
                but here's what I have read and what I understand from it:-

                Grouping separator is apparently localized. Not a "standardiz ed" symbol.
                It varies between locales.

                | For example, the decimal separator set could include all of [.,']




                | G.1 Number Patterns
                |
                | The NumberElements resource affects how these patterns are interpreted
                | in a localized context. Here are some examples, based on the French
                | locale. The "." shows where the decimal point should go. The "," shows
                | where the thousands separator should go. A "0" indicates zero-padding:
                | if the number is too short, a zero (in the locale's numeric set) will
                | go there. A "#" indicates no padding: if the number is too short,
                | nothing goes there. A "¤" shows where the currency sign will go. The
                | following illustrates the effects of different patterns for the French
                | locale, with the number "1234.567". Notice how the pattern characters
                | ',' and '.' are replaced by the characters appropriate for the locale.

                The last two lines state that the "pattern characters" are "replaced by
                the characters appropriate for the locale."

                >To get an International Standard for decimal and thousands separators,
                >it would at present be necessary for the French and the Americans to
                >agree on which of them should change. IMHO, that will not happen,
                >until enforced by the Chinese.
                >
                I think the point is that the separator varies, but that variance is
                taken on by CLDR.

                Garrett

                Comment

                Working...