examples/objectDS/localize_from_object.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>Localize Test</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../dist/jquery.localize.min.js" type="text/javascript" charset="utf-8"></script>
  </head>

  <body>
    <h1>Test localization...</h1>
    <p data-localize="test.nested">puts 2 + 2</p>
    <input data-localize="test.input" type="text" value="fail" />
    <select>
      <optgroup data-localize="test.optgroup" label="Fail">
        <option data-localize="test.option" value="1">Fail</option>
      </optgroup>
    </select>
    <p>
      <img src="../ruby_square.gif" alt="a square ruby" data-localize="test.ruby_image"/>
      Ruby image should be round.
    </p>
    <p data-localize="basic">It failed :(</p>
    <p data-localize="message">Optional callback never happened.</p>

    <script type="text/javascript" charset="utf-8">
      $(function(){
        var object = {
          "test": {
            "nested": "nested success",
              "input": "input success",
              "input_as_obj": {
                "value": "input_as_obj value success",
                "title": "input_as_obj title success"
              },
            "optgroup": "optgroup success",
            "option": "option success",
            "ruby_image": {
              "src": "../ruby_round.gif",
              "alt": "a round ruby",
              "title": "A Round Ruby"
            },
            "link": {
              "text": "success",
              "href": "http://success"
            }
          },
          "basic": "basic success",
          "with_title": {
            "text": "with_title text success",
            "title": "with_title title success"
          }
        };

        var customCallback = function(data, defaultCallback) {
          data.message = "Optional call back works.";
          defaultCallback(data);
        };

        var opts = { callback: customCallback };
        $("[data-localize]").localize(object, opts);
      })
    </script>
  </body>

</html>