jFormz

jFormz is a JavaScript Prototype Class for making HTML forms.

jFormz allows you to generate HTML forms dynamically!

These forms can still be used with JS, PHP or any other web language once the form is rendered!

jFormz was created simply to allow developers using JS to generate HTML forms dynamically, more easily, using less code.

jFormz is offered “AS IS” AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE AUTHOR OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) SUSTAINED BY YOU OR A THIRD PARTY, HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT ARISING IN ANY WAY OUT OF THE USE OF THIS SAMPLE CODE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

Who is this for?

If you develop web applications using JavaScript, jFormz was made for you!

Learn more about how to use jFormz on our documentation page or click download to get started!

You can also check out jFormzAF here which will allow you to autogenerate forms from MYSQL tables! jFomzAF I'll try to write some documentation for jFormzAF soon.

Quick Start

Installation: Include a script tag with the src linking to a copy of jFormz.js

Then instantiate an instance of the jFormz class.

            
            ⟨script src='jFormz.js'⟩⟨/script⟩
            var jf = new Jformz()
            

Now you can call any of the jFormz methods as shown below.

While JavaScript is very forgiving about not passing arguments. It's best to always pass the total number of arguments the method expects and either use an empty string '' or jf.empty for tag attributes you don't need.

Build a form.

        
        ⟨div id="formView" ⟩ ⟨/div⟩
        
        ⟨script src='jFormz.js'⟩⟨/script⟩
        
        ⟨script⟩
        //INSTANTIATE
        var jf = new Jformz();
        
        //BUILD A FORM
        var view  = '';
        var e = jf.empty;    
        view += jf.openForm(e,e,e,jf.dClass,e);
        view += jf.formLabel('Name','label'); 
        view += jf.inputText('text','test',jf.dClass,'testa','Placeholder',e);
        view += jf.br();
        view += jf.formLabel('Message','label'); 
        view += jf.textArea('test',jf.dClass,'test','test text');
        view += jf.br();
        view += jf.formLabel('Options','label'); 
        view += jf.selectList(e,jf.dClass,e,[['1', 'Option 1'],['2', 'Option 2']]);
        view += jf.br();
        view += jf.submitBtn(e,e,jf.priBtn,'Save');
        view += jf.closeForm();
        

        //SHOW THE FORM
        jf.showView('formView', view);
        
        ⟨/script⟩