tl.gif Certificeringer tr.gif tl.gif Kurser tr.gif tl.gif Uddannelse tr.gif tl.gif Java udvikler tr.gif tl.gif PHP udvikler tr.gif tl.gif Personlighed tr.gif tl.gif Profil tr.gif tl.gif Projekter tr.gif tl.gif Kvalifikationer tr.gif
blank.gif
blank.gif
triangle.gif Du er her: /  Forsiden  /  Javascript  /  Format date amount    Login nu   Login
blank.gif
blank.gif
arrow-headline.gif Artikler
/ (33)
 

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.12
 * @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.12
 * @since 12-feb-2011
 */

/**
 * 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

Danmark

Germany

England

Spain

France

Italy

Norge

Sverige

USA


 
blank.gif