jQuery.dForm 1.0.1 example

This is a simple example for jQuery.dForm

HTML

<script src="http://daffl.github.io/jquery.dform/release/jquery.dform-1.1.0.js"></script>
<script src="https://code.angularjs.org/1.2.9/angular.js"></script>
<div ng-app='app' ng-controller="dformController">
    <div action="index.html" method="get" html="fields" dform></div>
</div>

CSS

body {
    font-family: sans-serif;
    padding: 10px;
}

label, input {
    display: block;
    margin-top: 10px;
}

JavaScript

angular.module('app', [])
.controller('dformController', [
    "$scope", 
    function($scope) {
        $scope.fields = 
            [
            {
                "type" : "p",
                "html" : "You must login"
            },
            {
                "name" : "username",
                "id" : "txt-username",
                "caption" : "Username",
                "type" : "text",
                "placeholder" : "E.g. [email protected]"
            },
            {
                "name" : "password",
                "caption" : "Password",
                "type" : "password"
            },
            {
                "type" : "submit",
                "value" : "Login"
            }
        ];
    }])
.directive('dform', function() {
  return {
    scope: {
      action: '@',
      method: '@',
      html: '='
    },
    link: function(scope, elm, attrs) {
      var config = {
          "action": scope.action,
          "method": scope.method,
          "html": scope.html
      };
      elm.dform(config);
    }
  };
})
;