angular-dynamic-forms | Module to build forms from #JSON schemas  #AngularJS #javascript

  • You invoke the directive using an element ( ) – other options (such as class, attribute, and comment) are unsupported (for now).
  • In accordance with how AngularJS handles this attribute elsewhere, your entire form’s data will be available in keys of whichever model you specify here (though nested forms are an exception, unless you specify a key in the outer form’s model as the [ ][] of the inner form).
  • Any other attributes you specify on the element are copied across to the or [ ][] element that the directive builds to replace itself with.
  • This allows you to nest s inside each other in the same way as [ ][] (which is one reason this directive implements this pseudo-transclusion).
  • The directive makes every attempt to set up the forms it generates to be valid HTML forms, complete with the ability to have their data submitted to the server by the browser’s native form submission mechanism and still have the data in the same structure that it takes on in your AngularJS models.

angular-dynamic-forms is an angular-js module for building Forms in AngularJS From JSON schemas.

@techjunkiejh: angular-dynamic-forms | Module to build forms from #JSON schemas #AngularJS #javascript

file for details.

The easy way.

The old way.

When registering this project with bower, I discovered that there’s another project called angular-dynamic-forms already registered there. The project was created at the beginning of October 2014, long after this one, and I haven’t yet worked out if there are any similarities in the implementation, but as I’ve been thinking of shortening the name of this project for a while anyway, I went ahead and registered it in bower with the shorter name. I’ll be changing the repo name on GitHub and BitBucket, too, but not for several months, to give existing users time to notice the addition of full bower support. The repo will be renamed to match the name registered in bower, and the bower name will not change. It is strongly recommended to use the bower method so you can get the latest version of this project at any given time, regardless of whether I’ve gotten around to renaming the repo.

As with any other AngularJS module:

And that’s about it! Check out the demo for a more robust example, or keep reading to learn about all of the things you can do with this module.

][] of the inner form). You must initialize this parent model to an object, or your app will break.

][] and build out your form based on the response. Currently, failure is silently ignored. This may change in a later release.


attributes for this to work completely.

key, if one exists, as its content, and any other keys as attributes.

s are properly supported in all browsers, yet; there are a number of references around the web for which browsers support what.

If this project isn’t for you (it’s not very mature, yet, so there are plenty of reasons it may not be a good fit for your projects, yet), there are some other ways to go about the same basic thing. They each have their own benefits and drawbacks, but I’ll let their own developers speak to those, especially as I haven’t tested any, yet. Here are a few; let me know if you’re aware of others:

If you notice a problem, let me know about it on GitHub or Bitbucket!

Any and all help is welcome; just fork the project on either GitHub or BitBucket (whichever you prefer), and submit a pull request with your contribution(s)!


You might also like More from author

Comments are closed, but trackbacks and pingbacks are open.