Creating and using HTML dialogs

Opening the dialog

You should be familiar with the use of dynamic panes . A dialog is displayed by outputting the following HTML sequence:

<xch_pane action=open name="my dialog" panetitle="Registration Form" href="http://www.chaco.com/reg_dialog.html" width=640 options="floating fit">

Note a few things about this HTML sequence:

The name= tag specifies the name of the dialog pane. This can be any name you choose, and should be unique for the dialog. In this example, I’m using the name “my dialog”. The name is important when you wish to close the dialog.

The width= tag here specifies an optimal width for the dialog. I’m using 640 pixels since that’s the smallest resolution folks use these days.

The options= tag includes the fit option. This ensures that the dialog will be sized to properly fit the fields you’ve specified. Use this. It looks good.

The options= tag should not include the noclose option. You want the user to be able to close the dialog. See the discussion of this below.

The href= attribute points to a file which contains the dialog description. This is a file stored on your web server, and is just a web page containing a form. If you’re not familiar with forms, there are several very good tutorials available on the web. The best I’ve seen is Carlos’ Forms Tutorial. You’ll find it at http://robot0.ge.uiuc.edu/~carlosp/cs317/cft.html.

All of the forms elements Pueblo supports are documented in this help file. They’re listed in the ‘Also see’ section at the bottom of this page.

Specifying a form command

HTML forms normally send their results to an HTTP server. Pueblo allows the result of the form to go to the world server by specifying method=xch_cmd in the <form> statement. By default, the command ‘PUEBLOFORM ’ is sent, followed by the form data.

Note: The default PUEBLOFORM command includes a trailing space to separate the command name from the form results. If you don’t specify this trailing space, the form results are immediately appended to the command.

If you have the right privileges on your server, you can change the command sent to your world. To do this, specify the MD5 attribute on the <form> statement with the MD5 that Pueblo supplied via the PUEBLOCLIENT command. If the MD5 value is valid for the client, then you may use the ACTION attribute to specify the command that should be user for the form.

The specified ACTION will only be used if the MD5 attribute matches the MD5 specified by the client. If the MD5 does not match, then the command PUEBLOFORM will be sent.

Processing the data

HTML forms normally send their results to an HTTP server. Pueblo allows the result of the form to go to the world server by specifying method=xch_cmd in the form statement. When this method is used, the 'PUEBLOFORM ' command is sent to the world when the form is submitted. The results of the form are immediately appended to the command. Here is an example:

<form method=xch_cmd>

...

</form>

When this form is submitted, the command "PUEBLOFORM form_data" will be sent to the world, where form_data is the data from the form. Form data consists of a question mark (?) followed by a stream of name=value pairs separated by the & character. Each name=value pair is URL encoded.

Note: If you have access to the MD5 value for the user, you can specify your own command to use instead of PUEBLOFORM. See the previous section of this document.

The ‘value’ portion of the form data is encoded according to a few simple rules:

Spaces are changed to plusses (‘+’)

Non-alphanumeric characters are encoded into hexadecimal notation. These characters are encoded by a character triplet consisting of the character "%" followed by the two hexadecimal digits (from "0123456789ABCDEF") which forming the hexadecimal ASCII value of the character. (The characters "abcdef" may also be used in encodings.)

Alphanumeric characters (a-z, A-Z, 0-9) are not encoded.

For example, let’s consider the following form:

<FORM METHOD=xch_cmd>

What's your first name? <INPUT TYPE="text" NAME="name"><BR>

<P>

What's your favorite color? <SELECT NAME="color">

<OPTION>black

<OPTION>burnt umber

<OPTION>forest green

<OPTION>indigo

</SELECT>

<P>

<INPUT TYPE="submit" VALUE="Okay!">

</FORM>

If the user enters “Coyote & friends” for their name and selects ‘indigo’ for their favorite color, and then presses the ‘Okay!’ button, the following command will be sent to the world server:

PUEBLOFORM ?name=Coyote+%26+friends&color=indigo

Note that the spaces in ‘Coyote & friends’ were changed into plusses, while the ampersand in the string was escaped into hexadecimal (the ASCII value of ampersand is 0x26.)

Chaco may already have code available to decode this information for your world server. Surf to http://www.chaco.com/products/servers/ for more information.

Note: Previously, Pueblo allowed HTML programmers to specify the command which was sent back to the world server. This was a security risk on some MUD servers, so we've removed that behavior in favor of the PUEBLOFORM command. A future version of Pueblo will include improved security features so that world server authors can specify the command to be used by their forms in a secure way.

Closing the dialog

Panes are not automatically closed when their contents are submitted. You can cause the pane to be closed by outputting the following HTML string:

<xch_pane action=close name="my dialog">

Note that the name= field should contain the same string that you specified when you opened the pane.

Also see

Pueblo Enhancers Guide

Dynamic Panes

Form Elements:

<form>

<input>

<option>

<select>

<textarea>