Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

how send Post request with ajax in ember.js?

I want to send a POST (not GET) request to the server with ember.js. I don't know which function I need at "which function here", but I want to send it to the server for a login request.

App.LoginController = Ember.ObjectController.extend({
  actions: {
    userLogin: function(user) {
      // which function here? 
      ?? ("http://siteurl/api/authentication/login/&username=" + user.username + "&password=" + user.password + ""); 
      this.transitionTo('cat');

    },

    cancelLogin: function() {
      this.transitionTo('menu');
    }
  }
});

App.UserFormComponent = Ember.Component.extend({
  actions: {
    submit: function() {
      this.sendAction('submit', {
        username: this.get('username'),
        password: this.get('password')
      });
    },

    cancel: function() {
      this.sendAction('cancel');
    }
  }
});

down here template code

  <script type="text/x-handlebars" data-template-name="login">
        <header class="bar bar-nav">
            <h1 class="title">inloggen</h1>
            {{#link-to 'menu' class="icon icon icon-bars pull-right"}}{{/link-to}}
        </header>   
        <!-- SHOW LOADER -->
        <div class="content">  
        <div class="content-padded">
        {{user-form submit="userLogin" cancel="cancelLogin" submitTitle="login"}}
        </div>
  </script>

  <script type="text/x-handlebars" data-template-name="components/user-form">
   <form {{action "submit" on="submit"}}>
     <p><label>gebruikersnaam {{input type="text" value=username}}</label></p>
     <p><label>wachtwoord {{input type="password" value=password}}</label></p>
     <input type="submit" class="btn btn-primary btn-block" {{bindAttr value=submitTitle}}>
     <button class="btn btn-negative btn-block" {{action "cancel"}}>Cancel</button>
   </form>
  </script>
like image 681
Maarten Heideman Avatar asked Jun 20 '14 12:06

Maarten Heideman


1 Answers

Ember doesn't have any built in communication layer, you can use jquery for such calls.

App.LoginController = Ember.ObjectController.extend({
  actions: {
    userLogin: function(user) {      
      $.ajax({
        type: "POST",
        url: "http://siteurl/api/authentication/login/&username=" + user.username + "&password=" + user.password,
        data: { name: "John", location: "Boston" }
      })
      this.transitionTo('cat');

    },

    cancelLogin: function() {
      this.transitionTo('menu');
    }
  }
});
like image 99
Kingpin2k Avatar answered Oct 27 '22 01:10

Kingpin2k