How to Save the form

[padminibee]

Hi,
Thank you for the code to build forms online...
i am unable to write the code for saving the template..can u help me to do...

[kevinchappell]

At the moment form data is stored as XML in a hidden textarea so saving the data should be the same as saving a normal textarea. I am working on a new demo now that will include save functionality for a php backend.

[thewizster]

Extracting the XML directly using toXML()
http://jsfiddle.net/thewizster/kcevbmqx/

Is there a way yet to render this back to HTML?

[kevinchappell]

@thewizster version 1.4 (just released) addresses this. Check the demo for usage.

[thewizster]

@kevinchappell I've been testing the new render feature. Working well so far. I'm testing under bootstrap 3. I'll let you know if I run into any issues. Great work!

[ashvushinde]

I have a XML data and I saved it to database.
And I get it back from database but how to convert it to HTML form. In short how do i render it ?

XML data returned from the database:

<form-template>
    <fields>
        <field name="select-1447927575220" label="Select" style="multiple" description="" required="false" type="select" >
            <option value="option-1">Option 1</option>
            <option value="option-2">Option 2</option>
        </field>
        <field name="autocomplete-1447927571725" label="Autocomplete" description="" required="false" type="autocomplete" />
        <field name="radio-group-1447927576634" label="Radio Group" style="multiple" description="" required="false" type="radio-group" >
            <option value="option-1">Option 1</option>
            <option value="option-2">Option 2</option>
        </field>
        <field name="date-input-1447927572946" label="Date Field" description="" required="true" type="date" />
        <field name="checkbox-group-1447927574129" label="Checkbox Group" style="multiple" description="" required="false" type="checkbox-group" >
            <option value="option-1">Option 1</option>
            <option value="option-2">Option 2</option>
        </field>
    </fields>
</form-template>

I tried the following Options:

HAML Code:

.demo-wrap
  #main_content_wrap.outer
    %section#main_content.inner
      %textarea.hidden#form-builder-template{:cols => "30", :name => "form-builder-template", :rows => "10", value: session[:form_template]}

      .render-form
        %h2
          %strong Rendering the form
        %form#rendered-form
        .render-description
      %br{:style => "clear:both"}

The session[:form_template] is returned value from the database and i am assigning it to textarea.

Javascript Code

        jQuery(document).ready(function($) {
          var template = document.getElementById('form-builder-template'),
            formContainer = document.getElementById('rendered-form'),
            renderBtn = document.getElementById('render-form-button'),
            formRenderOpts = { container: $(formContainer) };
          $(template).formRender(formRenderOpts);
          //$(template).formBuilder();
          $(renderBtn).click(function() {
          console.log('--------before rendering----------');
            $(template).formRender(formRenderOpts);
          console.log('---after rendering -----');
          });
        });

Well I got both logs before rendering and after rendering but still nothing loads on #rendered-form div ?

Am i missing something here?

[kevinchappell]

Can you log the $(template).val()? If its direct from the DB the XML may be escaped.

Here is a minimal usage example. http://jsfiddle.net/kevinchappell/yzr2p5y4/

[ashvushinde]

I logged $(template).val()?
It shows the same which is already given.
But now the issue is how to append the XML to textarea.
Because the demo you given on jsfiddle, isslustrates the XML part is child of textarea.
Alternatively I assigned the value of XML to textarea.
Still nothing happens?
How to append the XML as a child of textarea ?

[ashvushinde]

@kevinchappell :

I did a Silly thing actually.
%form
%textarea#template_form{:cols => "30", :name => "form-template", :rows => "10"}
= session[:form_template]

Solved my problem.
Thanks.

[kevinchappell]

Sorry im not sure as I have 0 rails experience but from what i see online assigning should have worked.
%textarea.hidden#form-builder-template{:cols => "30", :name => "form-builder-template", :rows => "10"}= session[:form_template]

[ashvushinde]

Yeah that's right..!!
The same you suggested solved my problem..!!

[kevinchappell]

@ashvushinde great!. best of luck.

[JosephMendez]

how to save data once the form is rendered and fill in with values.?

[Varungpurohit]

Hi,
Thank u for the code.
I have one doubt regrading ,,,,,can we get rendered or build html directly when we saved the form or is it possible to convert xml or json or js directly without any plugins