blank.gif
triangle.gif Du er her: /  Forsiden  /  Javascript  /  Format-date-amount    
blank.gif
blank.gif
tl.gif Curriculum Vitae (da) tr.gif tl.gif Certificeringer tr.gif tl.gif Erhvervskvalifikationer tr.gif tl.gif Java-udvikler tr.gif tl.gif Kurser tr.gif tl.gif Personlighed tr.gif tl.gif Profil tr.gif tl.gif Projekter tr.gif tl.gif Resultater tr.gif tl.gif Sprogkundskaber tr.gif tl.gif Uddannelse tr.gif
blank.gif
blank.gif
arrow-headline.gif Navigation
arrow-headline.gif Artikler
 

Demo af hvordan man opretter en Date Formatter og en Amount formatter

denne tutorial viser dig hvordan du opretter formatters for amount og datoer i text felter

  • Først include *.js filerne der skal benyttes
  • Så skal du instanciere det Locale der gælder for dit område
  • Så starter demo

Du kan jo afprøve forskellige date og amount formatter.

Demo af følgende javascript funktionalitet

De følgende demo samples viser dig hvordan man opretter en singleton i javascript og hvordan man kan kode en dato formatter og formatere et beløb med det locale der er gældende for dit område

<?php
/**
 * This file is the local content file
 * It may be auto generated from the database or 
 * manually edited
 *
 * @package javascript
 * @filesource 
 * @see demo.php
 * @copyright (c) http://Finn-Rasmussen.com
 * @license http://Finn-Rasmussen.com/license/ myPHP License conditions
 * @author http://Finn-Rasmussen.com
 * @version 1.11
 * @since 11-dec-2007
 */

/**
 * This class simulates a CountryCode object, in a very primitive matter
 *
 * class CountryCode {
 *    public static final String DK = "DK";
 *    public static final String NO = "NO"; // Etc.
 * }
 *
 * @package javascript
 * @author    http://Finn-Rasmussen.com
 * @copyright http://Finn-Rasmussen.com
 * @version 1.11
 * @since 27-nov-2009
 */

/**
 * The supported Country Codes
 * @see http://www.iso.org/iso/en/prods-services/iso3166ma/02iso-3166-code-lists/list-en1.html
 * @see http://www.chemie.fu-berlin.de/diverse/doc/ISO_3166.html
 * The constructor function simulates a crude Country Code object
 * The Country Code object is instanciated with the singleton pattern
 * The Singleton pattern is simulated in JavaScript by:
 * - Using an anonymous constructor to create a function object
 * - And saving the returned object in an external variable
 * <code>
 * usage:
 *   // Include and instanciate the Country Code class as a singleton
 *   <script type="text/javascript" src="../page/CountryCode.js.php"></script>
 *
 *   // Use the Country Codes singleton class
 *   var countryCode = CountryCode.DK; // Returns a Country Code string specific for DENMARK
 * </code>
 */
?>

var CountryCode = new function() {
    this.DE = 'DE';
    this.DK = 'DK';
    this.NO = 'NO';
    this.SE = 'SE';
    this.UK = 'UK';
    this.US = 'US';
    // TODO, add more ...
}

Først skal du include *.js filerne du skal benytte

<script type="text/javascript" src="/myphp-1.11/myphp-1.11-js/html/javascript/CountryCode.js.php"></script> <script type="text/javascript" src="/myphp-1.11/myphp-1.11-js/html/javascript/LanguageCode.js.php"></script> <script type="text/javascript" src="/myphp-1.11/myphp-1.11-js/html/javascript/Locale.js.php"></script> <script type="text/javascript" src="/myphp-1.11/myphp-1.11-js/html/javascript/AmountFormat.js.php"></script> <script type="text/javascript" src="/myphp-1.11/myphp-1.11-js/html/javascript/DateFormat.js.php"></script>>

Instanciate Locale for dit område

<script type="text/javascript"> var danish = Locale.getInstance(LanguageCode.DANISH, CountryCode.DK); </script>

Opret test form

<form name="theForm"> <label>Betalingsdato Beløb</label><br /> <input type="text" name="date[0]" value="01-01-2007" size="10" maxlength="10" onblur="this.value=DateFormat.format(this.value)" /> <input type="text" name="amount[0]" value="1,01" size="15" maxlength="40" onblur="this.value=AmountFormat.format(this.value)" class="AlignRight" /><br /> <input type="text" name="date[1]" value="31-12-2007" size="10" maxlength="10" onblur="this.value=DateFormat.format(this.value)" /> <input type="text" name="amount[1]" value="100.001,00" size="15" maxlength="40" onblur="this.value=AmountFormat.format(this.value)" class="AlignRight" /><br /> <input type="text" name="date[2]" value="11-12-2007" size="10" maxlength="10" onblur="this.value=DateFormat.format(this.value)" /> <input type="text" name="amount[2]" value="1.234.567,89" size="15" maxlength="40" onblur="this.value=AmountFormat.format(this.value)" class="AlignRight" /><br > <input type="text" name="date[2]" value="30-11-2007" size="10" maxlength="10" onblur="this.value=DateFormat.format(this.value)" /> <input type="text" name="amount[2]" value="0,00" size="15" maxlength="40" onblur="this.value=AmountFormat.format(this.value)" class="AlignRight" /><br /> </form>

Og så kan du selv teste demo her:






/**
 * This class simulates a DateFormat object, in a very primitive matter
 *
 * class DateFormat {
 *    public static DateFormat getInstance(); // Use the current Locale
 *    public static DateFormat getInstance(Locale locale);
 *    public static DateFormat getDateInstance(String styleDate, Locale locale);
 *    public String format(String pattern);
 * }
 */
 
	/**
	 * Instanciate the singleton object for the DateFormat
	 */
	var DateFormat = new function() {
	
	    /**
	     * Get the instance of the current DateFormat object 
	     * @param  Locale locale The Locale object
	     * @return DateFormat The current default DateFormat object
	     */
	    this.getInstance = function(locale) {
	    	// Code removed
	    	//    :
	        return this;
	    }
			
	    /**
	     * Get the formatted date from a date string.
	     * The following formats(number of chars) are supported with or without '-' or '/'
	     * 
	     * Syntax: date[seperator][month][seperator][year]
	     * Where : date is 1-2 digits, seperator is none, '-' or '/', month is 1-2 digits, year is 0, 2 or 4 digits
	     * 
	     * d(1), dd(2), dmm(3), ddmm(4),
	     * dmmyy(5), ddmmyy(6), dmmyyyy(7), ddmmyyyy(8),
	     * d-mm(4), dd-mm(5), dd-m-yy(7), dd-m-yyyy(9),
	     * d-mm-yy(7), dd-mm-yy(8), d-m-yyyy(8), d-mm-yyyy(9), dd-mm-yyyy(10),
	     * d/mm(4), dd/mm(5), dd/m/yy(7), dd/m/yyyy(9),
	     * d/mm/yy(7), dd/mm/yy(8), d/m/yyyy(8), d/mm/yyyy(9), dd/mm/yyyy(10),
	     * 
	     * Samples:
	     * 03-09-08 => 03-09-2008
	     * 3        => 03-[thisMonth]-[thisYear]
	     * 3-9      => 03-09-[thisYear]
	     * 309      => 03-09-[thisYear]
	     * 3-9-8    => 03-09-2008
	     * 
	     * NOT SUPPORTED: 
	     * m(1), mm(2), y(1), yy(2), yyyy(4), myy(3), mmyy(4), 
	     * m/d/yy, mm/dd/yyyy etc.
	     * 
	     * @param  String strDate The pattern to format to a date string
	     * @return String The formatted date adjusted for date style and locale
	     */
	    this.format = function(strDate) {
	        var pattern = this.adjust(strDate);
	        var date    = this.newDate(pattern);
	        var format  = this.parse(date);
	        return format;
	    }
    } // End of singleton
triangle.gif

Dansk

Deutch

English (UK)

France

Italy

Norsk

Svensk

English (USA)


 
blank.gif
triangle.gif Copyright @ 1999-2010 www.Finn-Rasmussen.com Powered by myPHP Version (5.2.6-1+lenny9) 1.11
blank.gif
Valid XHTML 1.0 Strict Valid CSS!