Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

form submission in angularjs ui-router

I am using angular-ui-router. When form is submitted, I want to activate the ui-routing, which is defined with ui-sref= "url" There is no action element in Angularjs, so I am using the ng-submit element.

How/where do i define the ui-sref url ?

The form typically has the following code. But the 'url' below is not routed thru the ui-router.

form(name="LNquestionForm", action="/url")

I want to do something like

form(name="LNquestionForm", ng-submit='ui-sref = "url" ')

So that the routing takes place thru myAngularApp.js as:-

var myApp = angular.module('myApp', ['ui.router']);

myApp.config(function($stateProvider, $urlRouterProvider) {

  // Now set up the states
  $stateProvider
    .state('/url', {
      url: "/url",
       templateUrl: "partials/someLink" }

    })
like image 551
Sangram Singh Avatar asked Sep 18 '13 05:09

Sangram Singh


1 Answers

Not quite sure I get your question right but from what I understood you want to submit a form and be redirected to a given state of your $statePorivider without any server call. If this is the case you could easily do something like that :

<form ng-submit="onFormSubmit" name="myForm">
  <input type="text" required/>
  ....
</form>

In the controller associated with your form you should do :

$scope.onFormSubmit = function () {
  if(myForm.$valid) {
    $state.href('/url' [, optional parameters if needed]);
  }
}

Be careful for the onFormSubmit function to work you need to inject the state service in your controller or have it referred in your application Controller.

Please also note that I added some form validation in the example.

like image 160
Nicolas ABRIC Avatar answered Oct 21 '22 00:10

Nicolas ABRIC