Topic: example: PEAR QuickForm and Xajax

Hi,

There isn't on the net much information about how to use PEAR's HTML_QuickForm package and Xajax together. It is not difficult to display a form using both resources, but there is a small problem with QuickForm's pre-built field validation when data comes from xajax's "xajax.getFormValues" function and after some months I think I found my favorite workaround. That's why I wanted to share it with all you.

So, first things first, here is the code:

<?php
include './xajax/xajax_core/xajax.inc.php';
$xajax = new xajax();
//$xajax->configure('debug', true);
$xajax->register(XAJAX_FUNCTION, 'showForm');

function showForm($form_values = null)
{
  // Load the main class
  require_once 'HTML/QuickForm.php';

  // Load submitted values on $_POST
  if ( $form_values != null )
    $_POST = $form_values;

  // Load empty array because there are some values in $_POST that confuse QuickForm
  else
    $_POST = array();

  // Instantiate the HTML_QuickForm object
  $form = new HTML_QuickForm("firstForm", 'post', 'javascript:void(null);', '', array('onSubmit' => "xajax_showForm(xajax.getFormValues('firstForm'));"));

  // Set defaults for the form elements
  $form->setDefaults(array(
      'name' => 'Joe User'
  ));

  // Add some elements to the form
  $form->addElement('header', null, 'Mixing Xajax and QuickForm:');
  $form->addElement('text', 'name', 'Enter your name:', array('size' => 50, 'maxlength' => 255));
  $form->addElement('submit', null, 'Send');

  // Define filters and validation rules
  $form->applyFilter('name', 'trim');
  $form->addRule('name', 'Please enter your name', 'required', null, 'server');


  // Try to validate a form 
  if ($form->validate()) {
    $message = '<h1>Hello, ' . htmlspecialchars($form->exportValue('name')) . '!</h1>';
  }

  // Invalid form -> Redraw
  else
    $message = $form->toHtml();

  // Instantiate Xajax Response Object
  $response = new xajaxResponse();


  // Send Response
  $response->assign('formId', 'innerHTML', $message);
  return $response;
}

$xajax->processRequest();

$xajax->printJavascript();
?>
<script>xajax_showForm();</script>
<a href="">Restart Test</a>
<div id="formId"></div>

In this simple example I tried to reproduce the simplest QuickForm example "the xajax way".

The key on it is that QuickForm checks if the form has been submitted from the $_POST data. In a non-xajax application this global variable is empty if the form is not submitted and has the form's values if some form has been submitted, but the xajax.getFormValues returns something slightly different in the case that the form is not submitted, something like:

array(2) {
  ["xjxfun"]=> string(8) "showForm"
  ["xjxr"]=> string(13) "1219776324996"
}

This confuses QuickForm, and I think the best way to avoid it is to use the lines:

  // Load submitted values on $_POST
  if ( $form_values != null )
    $_POST = $form_values;

  // Load empty array because there are some values in $_POST that confuse QuickForm
  else
    $_POST = array();

If you do not put the "else" part, you will see that the form is directly displayed as if it was submitted, also before submitting it, this happens because of the $_POST value explained before.

I hope this is useful for somebody !!
Marc ///

Re: example: PEAR QuickForm and Xajax

Thanks for sharing your experiences! smile