Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
<link href="//cdnjs.cloudflare.com/ajax/libs/foundation/5.0.3/css/normalize.min.css" rel="stylesheet" type="text/css" />
<link href="//cdnjs.cloudflare.com/ajax/libs/foundation/5.0.3/css/foundation.min.css" rel="stylesheet" type="text/css" />
<script src="//cdnjs.cloudflare.com/ajax/libs/foundation/5.0.3/js/vendor/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/foundation/5.0.3/js/foundation.min.js"></script>
<meta name="description" content="ember validations" />
​
​
  <meta charset="utf-8">
  <title>Ember Starter Kit</title>
  </head>
<body>
​
  <script type="text/x-handlebars">
    <h2>Welcome to Ember.js</h2>
    {{outlet}}
  </script>
​
  <script type="text/x-handlebars" data-template-name="index">
    <h2>Sign up</h2>
  
  <div class="page-content">
  {{#form-for controller class="form-horizontal"}}
    {{input email  as="email" }}
    {{input password  as="password"}}    
    {{input passwordConfirmation  as="password"}}  
    {{submit class="btn btn-primary"}}
  {{/form-for}}
<div>
​
  </script>
  <script src="http://builds.handlebarsjs.com.s3.amazonaws.com/handlebars-v1.3.0.js"></script>
  <script src="http://builds.emberjs.com/tags/v1.5.0/ember.js"></script>
  <script src="http://rawgithub.com/ember-addons/bootstrap-for-ember/master/dist/js/bs-core.max.js"></script>
  <script src="http://rawgithub.com/ember-addons/bootstrap-for-ember/master/dist/js/bs-modal.max.js"></script>
  <script src="http://rawgithub.com/ember-addons/bootstrap-for-ember/master/dist/js/bs-button.max.js"></script>
    <script src="http://builds.emberjs.com.s3.amazonaws.com/beta/daily/20130929/ember-data.prod.js"></script>
  <script src="http://builds.dockyard.com.s3.amazonaws.com/ember-easyForm/stable/ember-easyForm.js"></script>
  <script src="http://builds.dockyard.com.s3.amazonaws.com/ember-validations/ember-validations-latest.js"></script>
​
</body>
</html>
​
 
App = Ember.Application.create();
App.ApplicationStore = DS.Store.extend({});
App.User = DS.Model.extend({
  email: DS.attr(),
  password: DS.attr()
});
​
App.Router.map(function() {
  this.resource('users');
});
​
App.IndexRoute = Ember.Route.extend({
  model: function() {
   return this.store.createRecord('user');
  }
});
​
App.IndexController= Ember.ObjectController.extend(Ember.Validations.Mixin, {
  actions: {
    submit: function(){
      alert('submitted');
    }
  },
  
  validations: {
    email: {
      presence: true,
      format: { with: /^[\w+\-.]+@[a-z\d\-.]+\.[a-z]+$/i,  message: 'Invalid e-mail address'}
    },
    password: {
      length: { minimum: 8,  maximum: 16 },
      confirmation: {message: 'Please make sure password matches '},
      presence: true
    },
    passwordConfirmation: {
      presence: {
        message: 'please confirm password' 
      }
    }
  }
});
​
​
​
​
​
​
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
sunil-shresthapro
0viewers