HTML, PHP, Reporting, Uncategorized, User Interface

Editing Report URL Parameters

One of the best features of graphical user interfaces is discoverablity, for a user recognition is easier than recall. Users don’t have to look up the available parameters, the GUI controls and widgets themselves tell the user how to control the application. A GUI application is at least partly self documenting.

Design must convey the essence of a device’s operation; the way it works; the possible actions that can be taken; and, through feedback, just what it is doing at any particular moment. Design is really an act of communication, which means having a deep understanding of the person with whom the designer is communicating.

Don Norman, The Design of Everyday Things

I have been building a standard report page in PHP that automatically determines the date range that is sent to MySQL, queries MySQL and then displays the results.

In certain rare cases though the user needs to override the date range and supply their own dates. The user could directly edit the querystring, but that can be error prone for novices, so I used the old web page technique of creating a small HTML form in the page containing HTML input controls which are populated by the parameters in the querystring. The form also contains an update button, which causes the form with method=”get” to reload the page with the update querystring parameters. Any required parameters that shouldn’t be editable can populate hidden controls, which will form part of the querystring, but won’t be displayed in the form.

2018-01-17 14_48_02-Mozilla Firefox

 <input type='hidden' name='site' value='site'>
 <td><input type='text' name='FromUtc' value='$FromUtc'></td>
 <td><input type='text' name='ToUtc' value='$ToUtc'></td>
 <input type='submit' value='Import'>

Security note: when setting the value of anything in a HTML page be sure to escape any variables set from outside of the page such as querystrings to avoid your page being vulnerable to XSS attacks.