Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Migrated to Confluence 5.3

Overview

This guide contains information on how to configure and integrate XSDForm into your web site. This is the main resource for using XSDForm.

Table of Contents

Concept

XSDForm gets your XSD and creates a web form on your web site. Optionally, it gets XML data and fills the initial data of the web form.

The form sends the filled (prepared) XML string to specified web address. (Delivers xml).

Configuration

XSDForm stores information about your forms with their identifiers in a configuration file (XSDForm/admin/xsdformconfiguration.xml).

XSDForm

A Web form should have the following properties:

Identifier: This is a unique string for the web form. This identifier is used on your web page for integration. It should contain alphanumeric characters and no space.

XSD File: Path to the XSD file of this form. It may be absolute path on web server or relative path to /XSDForm directory.

Form Element Name: The root xml element of the web form.  

Form Element Type Name: The type name of the root xml element. It is specified in XSD file. The whole web form is created with this type content.

Form Integration:  XSDForm can create a full html form with its action and send button. Or XSDForm can create html input field into your existing html form. With this method, you have the responsibility to  specify the action of the form and to post the form. The posted form contains your inputs and a hidden variable: xmlContent that contains the xml string preapared with XSDForm. The value of this field can be "standalone" or "embedded".

Form Action: This is the target of the form. Prepared xml string is posted to this address. It may be relative to web address of your web page or an absolute web url. This parameter is only used if the Form Integration field is assigned to standalone.

 

XSDForm has an easy to use web interface for its configuration. 

Go to http://yourdomain.com/XSDForm/admin with your web browser. You can define as many forms as you want.

Integrating the XSDForm

You can use the XSD form on anywhere of your web page.

A sample usage is below:

Code Block
languagehtml/xml
titleSample Usage
linenumberstrue
<html><head>
<!-- fixed lines that include the scripts -->
<script type="text/javascript" src="/XSDForm/jquery.min.js"></script>
<script type="text/javascript" src="/XSDForm/xsdformjs.php"></script>
<link href="/XSDForm/style.css" type="text/css" media="screen" rel="stylesheet">
<!-- Prepare the form on page load -->
<!-- Use the form identifier that is entered on configuration -->
<script>
$(document).ready(function() {
	getXSDForm("Customer_Form","formDivId","");
});
</script>
</head>
<!-- Your web page content -->
<body>
<center><h3>Customer Form</h3>
<table border="1" width="500px">
<tr><td>
<!-- This is the place that you want to place the web form -->
 <div id="formDivId"></div>
</td></tr>
</table>
</center>
</body></html>

Lines 3-5: HTML codes for including XSDForm scripts and css styles. "/XSDForm/" is the installation directory on your web directory.

Lines 8-12: Codes for loading the web form after the web page is loaded. Customer_Form is the form identifier specified on configuration. formDivId is the ID of the HTML div element that is replaced with generated form  on your web page.

Line 20: Div element that will be placed with the web form. Put this line to anywhere you want to place the form content.

Field Name Notation

XSDForm displays field labels from name of the xml elements and name of the xml attributes. However, these names may not look visitor friendly.

XSDForm converts the names into word capatilize notation.

It splits the names into words with underscore characters and capital characters. Then it capitalizes the first character.

Info

Example:
firstName => First Name
last_name => Last Name

acceptTerms => Accept Terms

Using as Standalone Form

Using as Part of your Form

Filling the Form with Initial Data

Code Block
languagehtml/xml
linenumberstrue
<?php
 $xmlCurrentContent = '<customer name="Smart" surname="Sunrise"><email>[email protected]</email><address><Name>work</Name><Street>Outlake Road 12</Street><City>Paris</City><Zip>34400</Zip><Country>France</Country></address><acceptTerms>acceptTerms</acceptTerms></customer>';
?>
<script>
  $(document).ready(function() {
    var xmlCurrentContent = '<?php echo base64_encode($xmlCurrentContent);?>';
    getXSDForm("gss","formcu",xmlCurrentContent);
  });
</script>

Styles

Include Page
Styles
Styles