Physics & Computer Science > CP363 : Home > Implementation Information
Version: 2020-02-06 11:02

CP363 : Filling Forms

The examples on this page assumes the use of the class and connection defined at the top of the Selecting Data page.


Text Inputs

Earlier we looked at the form:

We can pre-fill this with data from a database or a previous call to the form. Why from a previous call? If we are displaying the result of processing a form on the same page that the form is filled out on then we usually want to show the user the data that they provided so that they know what they are seeing as a result, and so that they can edit it for further searching. In the following example already posted data is used to fill out the form:

      // Define the surname entry.
      $this->xml->startElement( 'tr' );
      $this->xml->startElement( 'td' );
      $this->xml->startElement( 'label' );
      $this->xml->writeAttribute( 'for', 'last_name' );
      $this->xml->text( 'Surname: ');
      $this->xml->endElement(); // label
      $this->xml->endElement(); // td
      
      $this->xml->startElement( 'td' );
      $this->xml->startElement( 'input' );
      $this->xml->writeAttribute( 'name', 'last_name' );
      $this->xml->writeAttribute( 'type', 'text' );
      $this->xml->writeAttribute( 'size', 25 );
      
      // Insert posted data into the field.
      if( isset( $_POST['last_name'] ) ) {
          $this->xml->writeAttribute( 'value', $_POST['last_name'] );
      }
      $this->xml->fullEndElement(); // input
      $this->xml->endElement(); // td
      $this->xml->endElement(); // tr

      // Define the forename entry.
      $this->xml->startElement( 'tr' );
      $this->xml->startElement( 'td' );
      $this->xml->startElement( 'label' );
      $this->xml->writeAttribute( 'for', 'first_name' );
      $this->xml->text( 'First Name: ');
      $this->xml->endElement(); // label
      $this->xml->endElement(); // td
      
      $this->xml->startElement( 'td' );
      $this->xml->startElement( 'input' );
      $this->xml->writeAttribute( 'name', 'first_name' );
      $this->xml->writeAttribute( 'type', 'text' );
      $this->xml->writeAttribute( 'size', 25 );
      
      // Insert posted data into the field.
      if( isset( $_POST['first_name'] ) ) {
          $this->xml->writeAttribute( 'value', $_POST['first_name'] );
      }
      $this->xml->fullEndElement(); // input
      $this->xml->endElement(); // td
      $this->xml->endElement(); // tr

      // Define the institution entry.
      $this->xml->startElement( 'tr' );
      $this->xml->startElement( 'td' );
      $this->xml->startElement( 'label' );
      $this->xml->writeAttribute( 'for', 'institution' );
      $this->xml->text( 'Institution: ');
      $this->xml->endElement(); // label
      $this->xml->endElement(); // td
      
      $this->xml->startElement( 'td' );
      $this->xml->startElement( 'input' );
      $this->xml->writeAttribute( 'name', 'institution' );
      $this->xml->writeAttribute( 'type', 'text' );
      $this->xml->writeAttribute( 'size', 40 );

      // Insert posted data into the field.
      if( isset( $_POST['institution'] ) ) {
          $this->xml->writeAttribute( 'value', $_POST['institution'] );
      }
      $this->xml->fullEndElement(); // input
      $this->xml->endElement(); // td
      $this->xml->endElement(); // tr

      $this->xml->endElement(); // table

This code first verifies that the posted data exists using the isset function, then adds it to the value attribute of the input tag. (If we did not check to see if the posted variable existed PHP would generate an error message. Thus the following code verifies that the user has previously entered a value for the institution field and puts that value into the field before displaying it.

      // Insert posted data into the field.
      if( isset( $_POST['institution'] ) ) {
          $this->xml->writeAttribute( 'value', $_POST['institution'] );
      }

Thus when the form is displayed the fields are pre-filled:

but the user may edit those values and resubmit the form.


Select Inputs

A typical selection element looks like this:

Keywords

The underlying HTML code is:

      <select name="keyword_ids[]" multiple="multiple" size="10">
        <option value="7">Arms Control and Non-Proliferation Studies</option>
        <option value="13">Civil-Military Relations</option>
        ...
        <option value="16">Weapons Systems</option>
      </select>

This element lists all of the keywords in the DCRIS database and allows the user to select multiple values. The values in the selection are dynamically extracted from the database and inserted into the select in a server page as follows:

    // Select all data from the Keywords table.
    $sql = 'SELECT * FROM keyword ORDER BY k_desc';
    $stmt = $this->conn->prepare( $sql );
    $stmt->execute();
    $stmt->setFetchMode( PDO::FETCH_ASSOC );
    $keywords = $stmt->fetchAll();

    // Define the 'select' tag. Allow multiple selections,
    // use an array name for the element.
    $this->xml->startElement( 'select' );
    $this->xml->writeAttribute( 'name', 'keyword_ids[]' );
    $this->xml->writeAttribute( 'multiple', 'multiple' );
    $this->xml->writeAttribute( 'size', 10 );

    // Put the data into the select element.
    foreach( $keywords as $keyword ) {
        $xml->startElement( 'option' );
        $xml->writeAttribute( 'value', $keyword['keyword_id'] );

        // See if the data is already selected.
        if( in_array( $keyword['keyword_id'], $selected ) ) {
            $xml->writeAttribute( 'selected', 'selected' );
        }
        $xml->text( $keyword['k_desc'] );
        $xml->endElement(); // option
    } 
    $this->xml->endElement();  // select

The SQL code at the top of this section is nothing new - it simply selects all of the data from the keywords table an puts it into an associative array named $keywords.

The following section uses the XMLWriter class to define the select tags and its options. The resulting opening tag:

      <select name="keyword_ids[]" multiple="multiple" size="10">

uses the multiple attribute to allow users to select more than one option from the list. (Without this attribute users are allowed to select only one of the options listed.) Because users are allowed to select multiple options the field name must be an array, thus keyword_ids[]. The size may be anything - if set to 1 the select element becomes a drop-down selection list.

The for loop generates each of the options in the list:

        <option value="7">Arms Control and Non-Proliferation Studies</option>

using each $keyword['keyword_id'] for the value attribute (these are the actual values that will be returned in the $_POST['keyword_ids'] array) and displaying $keyword['k_desc'] as the visible text.

If values in the selection list are to be displayed as already being selected, then you need a list of those values and a check to see if each selected item is in that list. The following code examines each keyword ID to see if it is in the list of already selected values:

        // See if the data is already selected.
        if( in_array( $keyword['keyword_id'], $selected ) ) {
            $xml->writeAttribute( 'selected', 'selected' );
        }

If the array $selected contains the values ( 11, 21 ) the the keywords Defence Management and Policy and Doctrine will be marked as selected when the list is displayed. The in_array function returns true if its first parameter is a value in its second parameter, which must always be an array.