SEM Labs

Handcrafted Pixels, Code & Title Tags

RSS Subscribe

Form using the foreach element to repeat sections of a form.

Company

Personal Name
Email
Password
Sex
Type
Colour
Select Some Spam
Description <p>HTML Injector's Nightmare</p>

Personal Name
Email
Password
Sex
Type
Colour
Select Some Spam
Description How far can we take this? <a href="http://spam.com/">spam</a>, <a href="http://bilge.com/">bilge pump systems</a>

Personal Name
Email
Password
Sex
Type
Colour
Select Some Spam
Description Another description

Accept Our Terms

Source Array

Array
(
    [company] => Company Name
    [0] => Array
        (
            [personal_name] => David
            [email] => david@companyname.co.uk
            [password] => secret
            [sex] => Array
                (
                    [0] => male
                    [1] => female
                )

            [type] => logo
            [colour] => Array
                (
                    [0] => red
                    [1] => yellow
                    [2] => pink
                    [3] => magenta
                    [4] => silver
                )

            [goldenboy] => he is golden
            [spam] => Array
                (
                    [0] => emailspam
                    [1] => mailspam
                )

            [description] => <p>HTML Injector's Nightmare</p>
        )

    [1] => Array
        (
            [personal_name] => Gertrude
            [email] => gertrude@companyname.co.uk
            [password] => secret
            [sex] => female
            [type] => website
            [colour] => Array
                (
                    [0] => red
                    [1] => yellow
                )

            [spam] => Array
                (
                    [0] => emailspam
                )

            [description] => How far can we take this? <a href="http://spam.com/">spam</a>, <a href="http://bilge.com/">bilge pump systems</a>
        )

    [2] => Array
        (
            [personal_name] => Diana
            [email] => diana@companyname.co.uk
            [password] => secret
            [sex] => female
            [type] => website
            [colour] => Array
                (
                    [0] => pink
                    [1] => black
                )

            [spam] => Array
                (
                    [0] => salespeople
                    [1] => telephonespam
                )

            [description] => Another description
        )

    [terms] => 0
)

XFL Document

<?xml version="1.0" encoding="UTF-8"?>
<xfl xmlns:xfl="http://semlabs.co.uk/products/xfl" xmlns:html="http://www.w3.org/1999/xhtml">
	<form action="" method="post">
		<label>Company</label>
		<input type="text" name="company" maxlength="48">
			<xfl:sanitise type="text" />
			<xfl:validate type="required" value="yes" />
			<xfl:validate type="minlength" value="4" error="Business must not be shorter than 4 characters" />
			<xfl:validate type="maxlength" value="48" error="Business must not be longer than 48 characters" />
			<xfl:validate type="regex" value="/[a-z ]+/i" error="Business must only contain letters and spaces" />
		</input>
		<xfl:foreach select="xfl-item" always-show="yes">
			<ul>
				<li>
					<label>Personal Name</label>
					<input type="text" name="personal_name" maxlength="48">
						<xfl:sanitise type="text" />
						<xfl:validate type="required" value="yes" error="Personal name is required" />
						<xfl:validate type="minlength" value="4" error="Personal name must not be shorter than 4 characters" />
						<xfl:validate type="maxlength" value="48" error="Personal name must not be longer than 48 characters" />
						<xfl:validate type="regex" value="/[a-z ]+/i" error="Personal name must only contain letters and spaces" />
					</input>
				</li>
				<li>
					<label>Email</label>
					<input type="text" name="email" maxlength="128">
						<xfl:sanitise type="text" />
						<xfl:validate type="required" value="yes" error="Email is required" />
						<xfl:validate type="minlength" value="6" error="Email must not be shorter than 6 characters" />
						<xfl:validate type="maxlength" value="128" error="Email must not be longer than 128 characters" />
						<xfl:validate type="regex" value="/[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z.]{2,30}/i" error="Email must be a valid email" />
					</input>
				</li>
				<li>
					<label>Password</label>
					<input type="password" name="password" maxlength="28">
						<xfl:validate type="required" value="yes" error="Password is required" />
						<xfl:validate type="minlength" value="6" error="Password must not be shorter than 6 characters" />
						<xfl:validate type="maxlength" value="28" error="Password must not be longer than 28 characters" />
						<xfl:validate type="regex" value="/[a-z0-9]+/" error="Password must only contain lowercase letters and numbers" />
					</input>
				</li>
				<li>
					<label>Sex</label>
					<select name="sex">
						<xfl:collection type="required" value="yes" error="Sex is required" />
					</select>
				</li>
				<li>
					<label>Type</label>
					<xfl:collection type="required" value="yes" error="Select a submission type">
						<input type="radio" name="type" value="logo" />
						<input type="radio" name="type" value="website" />
					</xfl:collection>
				</li>
				<li>
					<label>Colour</label>
					<xfl:collection type="range" value="1-3" error="Select between 1 and 3 colours">
						<input type="checkbox" name="colour[]" value="red" />
						<input type="checkbox" name="colour[]" value="yellow" />
						<input type="checkbox" name="colour[]" value="pink" />
					</xfl:collection>
				</li>
				<li>
					<label>Select Some Spam</label>
					<select name="spam[]" multiple="multiple">
						<xfl:collection type="range" value="1-3" error="You must choose between 1 and 3 ways in which marketers can spam you" />
						<option value="emailspam">Email Spam</option>
						<option value="mailspam">Mail Spam</option>
						<option value="telephonespam">Telephone Spam</option>
						<option value="salespeople">Sales People</option>
					</select>
				</li>
				<li>
					<label>Description</label>
					<textarea name="description">
						<xfl:sanitise type="plainText" />
						<xfl:validate type="required" value="yes" error="Description is required" />
						<xfl:validate type="minlength" value="6" error="Description must not be shorter than 6 characters" />
						<xfl:validate type="maxlength" value="5000" error="Description must not be longer than 5000 characters" />
					</textarea>
				</li>
			</ul>
		</xfl:foreach>
		<label>Accept Our Terms</label>
		<input type="checkbox" name="terms" value="1">
			<xfl:validate type="required" value="yes" error="Please accept our terms and conditions" />
		</input>
		<button name="xfl_submit">Submit</button>
	</form>
</xfl>

eXtensible Form Language

Version: 0.3.1 (open beta²)

Download

Requirements: PHP 5.2

SEM Labs

Handcrafted Pixels, Code & Title Tags

eXtensible Form Language Demos

Source Array

XFL Document