javascript - Angular form not getting submitted with ng-submit -


i new angularjs. started first demo project. form not getting submitted through index.html. if try template html submits form. have tried ng-click submit button. still doesn't work. missing here?

index.html

<html ng-app="angularformsapp">  <head>      <title></title>      <link href="content/bootstrap.min.css" rel="stylesheet" />      <script src="scripts/angular.min.js"></script>      <script src="app/angularformsapp.js"></script>      <script src="app/employeeform/efcontroller.js"></script>      <script src="app/employeeform/efdirective.js"></script>      <script src="app/employeeform/efservice.js"></script>    </head>  <body ng-controller="efcontroller" class="container">      <employee-form/>  </body>  </html>

angularformsapp.js

var angularformsapp = angular.module('angularformsapp', []);

efcontroller.js

angularformsapp.controller('efcontroller',        function efcontroller($scope, efservice) {            $scope.employee = efservice.employee;            $scope.departments = [              "engineering",              "marketing",              "finance",              "administration"];            $scope.submitform = function () {            }      });

efdirective.js

angularformsapp.directive('employeeform',    function() {      return {        restrict: 'e',        templateurl: 'app/employeeform/eftemplate.html'      }    });

efservice.js

angularformsapp.factory('efservice',    function() {      return {        employee: {          fullname: "wilton adams",          notes: "the ideal employee. don't touch red stapler.",          department: "administration",          perkcar: true,          perkstock: false,          perksixweeks: true,          payrolltype: "none"          }      }    }  );

eftemplate.html

<form class="form-horizontal" role="form" ng-submit="submitform()">    <fieldset>      <legend>basic information</legend>      <div class="form-group">        <label for="fullname" class="col-sm-3 control-label">name</label>        <div class="col-sm-9">          <input type="text" id="fullname" name="fullname" class="form-control" ng-model="employee.fullname" />        </div>      </div>        <div class="form-group">        <label for="notes" class="col-sm-3 control-label">notes</label>        <div class="col-sm-9">          <textarea name="notes" id="notes" class="form-control" rows="5" cols="40" ng-model="employee.notes"></textarea>        </div>      </div>        <div class="form-group">        <label for="department" class="col-sm-3 control-label">department</label>        <div class="col-sm-9">          <select name="department" id="department" class="form-control" ng-model="employee.department" ng-options="dept dept in departments"></select>        </div>      </div>    </fieldset>    <br />    <fieldset>      <legend>perks</legend>      <div class="form-group">        <div class="col-sm-3"></div>        <div class="col-sm-9">              <div class="checkbox">            <label>              <input type="checkbox" value="perkcar" ng-model="employee.perkcar" />company car            </label>          </div>          <div class="checkbox">            <label>              <input type="checkbox" value="perkstock" ng-model="employee.perkstock" />stock options            </label>          </div>          <div class="checkbox">            <label>              <input type="checkbox" value="perksixweeks" ng-model="employee.perksixweeks" />six weeks vacation            </label>          </div>        </div>      </div>    </fieldset>    <br />    <fieldset>      <legend>payroll type</legend>      <div class="form-group">        <div class="col-sm-3"></div>        <div class="col-sm-9">            <div class="radio">            <label>              <input type="radio" name="payrolltype" value="w2" ng-model="employee.payrolltype" />w-2            </label>          </div>          <div class="radio">            <label>              <input type="radio" name="payrolltype" value="ten99" ng-model="employee.payrolltype" />1099            </label>          </div>          <div class="radio">            <label>              <input type="radio" name="payrolltype" value="none" ng-model="employee.payrolltype" />none            </label>          </div>          <br />          </div>      </div>    </fieldset>        <div class="col-sm-offset-3 col-sm-9">      <input type="submit" class="btn btn-primary" value="submit" />    </div>  </form>

you should load efservice.js before loading efcontroller.js

<script src="app/angularformsapp.js"></script> <script src="app/employeeform/efservice.js"></script> <script src="app/employeeform/efcontroller.js"></script> 

Comments

Popular posts from this blog

apache - PHP Soap issue while content length is larger -

asynchronous - Python asyncio task got bad yield -

javascript - Complete OpenIDConnect auth when requesting via Ajax -