SiForm

Form building simplified

SiForm is javascript tool that enables developer to create unified forms in application.

Requirements

SiForm depends on two libraries:

• prototype

• scriptaculous / builder

both are included in libs folder.

Usage

First we need call js and css file in head tag:

<script type="text/javascript" src="src/siform.js"></script>
<link rel="stylesheet" type="text/css" href="src/siform.css" />

Than we add a div inside body, where siform will put its content and javascript code that will create siform:

<div id="SiformSimple">siform will rendered here</div>

<script type="text/javascript">
  document.observe("dom:loaded", function() {
    var siformSimple = new SiForm($("SiformSimple"), {
      width: 440,
      elements: [{
        type: 'form',
        action: 'saveMe.php',
        elementOptions: {
          width: 250,
          labelWidth: 160
        },
        elements: [{
          type: 'textfield',
          name: 'name',
          label: 'Name and surname:',
          validations: 'required',
          value: 'Dominik Znidar'
        }, {
          type: "textfield",
          label: "E-mail:",
          name: "email",
          validations: ["required","email"],
          value: ""
        }]
      }]
    });
  });
</script>

That’s it.

Documentation

For now, please try to make sense from file: tests/index.html

Example

http://tools.dominikz.com/siform/test/