File: index.html

Recommend this page to a friend!
  Classes of Sergio Flores Genis  >  JavaScript String Format  >  index.html  >  Download  
File: index.html
Role: Example script
Content type: text/plain
Description: Example for use
Class: JavaScript String Format
Format text string according to a pattern
Author: By
Last change: .. style
Date: 5 years ago
Size: 2,469 bytes
 

Contents

Class file image Download
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="http://www.jsclasses.org/browse/download/1/file/5910/name/String.strformat.js" type="text/javascript"></script>
    <style type="text/css">
        div.text {
            float: left;
            border: 1px red dotted;
        }

        #original {
            max-width: 450px;
            min-width: 450px;
        }

        #final {
            margin: 1em;
        }

        #run {
            background: darkred none repeat scroll 0 0;
            color: white;
            font-size: 14px;
            font-weight: 600;
            height: 32px;
            margin: 5px;
            float: right;
        }
    </style>
</head>
<body>

<div>
    <div class="text">
        <textarea id='original' >Simple {0}
Simple index {1$s}
This is a '{1$20s}' text
This is a '{1$-20s}' text align left;

Numbers {2}, {4}
  - align left and fill by 0      : {2$-'020n}
                                  : {4$-'020n}

  - align right and fill by space : {2$20n}
                                  : {4$20n}

  - to three decimal places       : {2$20nd.3}
                                  : {4$20n.3}

  - force sign                    : {2$nd+}
                                  : {4$nd+}

  - space when positive           : {2$nd#}
                                  : {4$nd#}

  - thousands separator           : {2$20n,}
                                  : {4$20n,}

  - use all options               : {2$-'020n,#.2}
                                  : {4$20nd+,.2}


Octal {2$10no}.
Octal {4$10no}.
Hexadecimal (lowercase) {2$10nx} / {4$10nx}
Hexadecimal (uppercase) {2$10nX} / {4$10nX}

Objeto/ {3$s/dede}
Objeto/ {3$10nd.3/peso.kg}
        </textarea><hr/><button id='run'>Format</button>
    </div>
    <div class="text"><pre id='final'></pre></div>
</div>
<script type="text/javascript">
    document.getElementById('run').onclick = function () {
        var obj = {
            dede: 'is a finger',
            num: 154,
            peso: {
                kg: 72.2,
                lb: 120
            }
        };
        var text = document.getElementById('original').value;
        document.getElementById('final').innerHTML = String.strformat(text,
                'ES SIMPLE', 'format', -2150.245857, obj, 5781458.3);
    }
    ;
</script>
</body>
</html>