WTK

User Tools

Site Tools

Trace:
browse_box

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision		Previous revision
browse_box [2024/12/02 03:53] – [WTK Page Builder] wtkadminbrowse_box [2024/12/02 04:14] (current) – added php to code tags wtkadmin
Line 5: Line 5:
 As an example of the simplest use, these few lines create a fully functioning page by calling **wtkFillBrowsePage** which is a wrapper for both **wtkBuildDataBrowse** and **wtkMergePage**. As an example of the simplest use, these few lines create a fully functioning page by calling **wtkFillBrowsePage** which is a wrapper for both **wtkBuildDataBrowse** and **wtkMergePage**.
  
-<code>+<code php>
 <?php <?php
 $gloLoginRequired = false; $gloLoginRequired = false;
Line 21: Line 21:
 This assumes you have `UID`, `id` or `GUID` in your SQL query because that value will be passed to the Edit or Delete page for determining which row to affect.  The library is smart enough to use whichever one you put in the SELECT query.  If your unique identifying column name is not one of these three, then to make the **wtkBuildDataBrowse** work properly you will need to alias it.  For example: This assumes you have `UID`, `id` or `GUID` in your SQL query because that value will be passed to the Edit or Delete page for determining which row to affect.  The library is smart enough to use whichever one you put in the SELECT query.  If your unique identifying column name is not one of these three, then to make the **wtkBuildDataBrowse** work properly you will need to alias it.  For example:
  
-<code>+<code sql>
 SELECT `pet_id` AS `UID`, `pet_name` SELECT `pet_id` AS `UID`, `pet_name`
   FROM `pets`   FROM `pets`
Line 30: Line 30:
 With the WTK library, usually the Add page uses the same PHP page as the Edit page.  So although you can have the Add button go anywhere, most of the time you will define them as such: With the WTK library, usually the Add page uses the same PHP page as the Edit page.  So although you can have the Add button go anywhere, most of the time you will define them as such:
  
-<code>+<code php>
 $gloEditPage = '/demo/petEdit'; $gloEditPage = '/demo/petEdit';
 $gloAddPage  = $gloEditPage; $gloAddPage  = $gloEditPage;
Line 41: Line 41:
 For example, in the `pets` demo table we use the `DelDate` logic so the delete functionality is defined as: For example, in the `pets` demo table we use the `DelDate` logic so the delete functionality is defined as:
  
-<code>+<code php>
 $gloDelPage = 'petsDelDate'; // have DelDate at end if should DelDate instead of DELETE $gloDelPage = 'petsDelDate'; // have DelDate at end if should DelDate instead of DELETE
 </code> </code>
Line 51: Line 51:
 These extra buttons will be put to the between the Edit button and the Delete button. These extra buttons will be put to the between the Edit button and the Delete button.
  
-<code>+<code php>
 $gloMoreButtons = array( $gloMoreButtons = array(
                 'User Logins' => array(                 'User Logins' => array(
Line 74: Line 74:
 In the above example, the 'User Logins' will be the hover-over title on the button.  The 'act' value defines the page which will be gone to.  For example, the 'User Logins' button will go to the userLogins.php page in the /admin/ folder.  The 'img' determines the MaterializeCSS icon which will be used.  In the 'User Logins' example the generated HTML code will be: In the above example, the 'User Logins' will be the hover-over title on the button.  The 'act' value defines the page which will be gone to.  For example, the 'User Logins' button will go to the userLogins.php page in the /admin/ folder.  The 'img' determines the MaterializeCSS icon which will be used.  In the 'User Logins' example the generated HTML code will be:
  
-<code>+<code html>
 <a onclick="JavaScript:ajaxGo('/admin/userLogins',0,7);" <a onclick="JavaScript:ajaxGo('/admin/userLogins',0,7);"
    class="btn btn-floating btn-small"><i class="material-icons"    class="btn btn-floating btn-small"><i class="material-icons"
Line 90: Line 90:
 For example, if you only wanted to allow wtkUsers with a SecurityLevel of 80 to be allowed to edit, you would add these two lines before the call to **wtkBuildDataBrowse**. For example, if you only wanted to allow wtkUsers with a SecurityLevel of 80 to be allowed to edit, you would add these two lines before the call to **wtkBuildDataBrowse**.
  
-<code>+<code php>
 $gloEditCondCol     = 'SecurityLevel'; $gloEditCondCol     = 'SecurityLevel';
 $gloEditCondition   = '80'; $gloEditCondition   = '80';
Line 97: Line 97:
 Likewise, you can set a condition on Delete button displaying by setting the following PHP variables. Likewise, you can set a condition on Delete button displaying by setting the following PHP variables.
  
-<code>+<code php>
 $gloDelCondCol     = 'SecurityLevel'; $gloDelCondCol     = 'SecurityLevel';
 $gloDelCondition   = '90'; $gloDelCondition   = '90';
Line 106: Line 106:
 If the page is in printing mode or the data is being exported, then the Add, Edit and Delete buttons will not be displayed.  This can be set by: If the page is in printing mode or the data is being exported, then the Add, Edit and Delete buttons will not be displayed.  This can be set by:
  
-<code>+<code php>
 $gloPrinting = true; $gloPrinting = true;
 </code> </code>
Line 113: Line 113:
 All columns will be left justified by default.  To make a column center or right justified, just assign it in the PHP global variable like this: All columns will be left justified by default.  To make a column center or right justified, just assign it in the PHP global variable like this:
  
-<code>+<code php>
 $gloColumnAlignArray = array ( $gloColumnAlignArray = array (
     'Priority' => 'center',     'Priority' => 'center',
Line 124: Line 124:
 Choosing which columns should be summed is easy also.  This only sums the values shown in the list.  So if your list is for 200 and your page navigation is set to 50, it will only show the first 50 rows and the total for the rows which are visible. Choosing which columns should be summed is easy also.  This only sums the values shown in the list.  So if your list is for 200 and your page navigation is set to 50, it will only show the first 50 rows and the total for the rows which are visible.
  
-<code>+<code php>
 $gloTotalArray = array ( $gloTotalArray = array (
     'OrderCount' => 'SUM'     'OrderCount' => 'SUM'
Line 133: Line 133:
 Passing SUM tallies the numbers.  Using DSUM makes it so the sum at the bottom uses your chosen currency. The nubmer formatting and currency setting are defined by these two global variables which you set in the wtk/wtkServerInfo.php file.  Passing SUM tallies the numbers.  Using DSUM makes it so the sum at the bottom uses your chosen currency. The nubmer formatting and currency setting are defined by these two global variables which you set in the wtk/wtkServerInfo.php file. 
  
-<code>+<code php>
 $gloPHPLocale = 'en_US';  // determines number formatting $gloPHPLocale = 'en_US';  // determines number formatting
 $gloCurrencyCode = 'USD'; // determines currency code in number formatting $gloCurrencyCode = 'USD'; // determines currency code in number formatting
Line 167: Line 167:
  
 Here is an example SQL query and the associated Sort Options. Here is an example SQL query and the associated Sort Options.
-<code>+<code sql>
 SELECT p.`UID`, u.`FirstName` AS `Owner`, p.`PetName`, p.`City`, SELECT p.`UID`, u.`FirstName` AS `Owner`, p.`PetName`, p.`City`,
   DATE_FORMAT(p.`BirthDate`,'%b %D, %Y') AS `DOB`   DATE_FORMAT(p.`BirthDate`,'%b %D, %Y') AS `DOB`
Line 183: Line 183:
 So for the above example, in the PHP you would simply add this before the wtkBuildDataBrowse call. So for the above example, in the PHP you would simply add this before the wtkBuildDataBrowse call.
  
-<code>+<code php>
 wtkSetHeaderSort('Owner'); // Defaults column name but can change with second parameter wtkSetHeaderSort('Owner'); // Defaults column name but can change with second parameter
 wtkSetHeaderSort('City', 'Town'); wtkSetHeaderSort('City', 'Town');
Line 194: Line 194:
 By default when you have your unique identifying column (UID, GUID, ID) in the SELECT statement, it will not be shown.  If you want it shown, you can simply set this variable to false. By default when you have your unique identifying column (UID, GUID, ID) in the SELECT statement, it will not be shown.  If you want it shown, you can simply set this variable to false.
  
-<code>+<code php>
 $gloHideUID = false; $gloHideUID = false;
 </code> </code>
Line 202: Line 202:
 By default your result set will not be truncated.  However if you want each column truncated to 80 characters you can easily by setting this variable before calling **wtkBuildDataBrowse**: By default your result set will not be truncated.  However if you want each column truncated to 80 characters you can easily by setting this variable before calling **wtkBuildDataBrowse**:
  
-<code>+<code php>
 $gloBrowseTruncate = true; $gloBrowseTruncate = true;
 </code> </code>
Line 210: Line 210:
 You can set the follow variable and any HTML formatting will be removed from the SQL results before putting them into the browse list.  This uses the **wtkRemoveStyle** function which is defined in wtk/lib/Utils.php. You can set the follow variable and any HTML formatting will be removed from the SQL results before putting them into the browse list.  This uses the **wtkRemoveStyle** function which is defined in wtk/lib/Utils.php.
  
-<code>+<code php>
 $gloBrowseNoStyle = true; $gloBrowseNoStyle = true;
 </code> </code>
Line 218: Line 218:
 If you want the SQL results to have <br> added in place of line breaks, set this PHP variable to true  before calling **wtkBuildDataBrowse**: If you want the SQL results to have <br> added in place of line breaks, set this PHP variable to true  before calling **wtkBuildDataBrowse**:
  
-<code>+<code php>
 $gloBrowseNL2BR = true; $gloBrowseNL2BR = true;
 </code> </code>
Line 228: Line 228:
 Simply before calling **wtkBuildDataBrowse** put in this line: Simply before calling **wtkBuildDataBrowse** put in this line:
  
-<code>+<code php>
 $gloSkipFooter = true; $gloSkipFooter = true;
 </code> </code>
Line 238: Line 238:
 This **20** can be globally changed by setting the following PHP variable in wtk/wtkServerInfo.php.  Of course if you want you can set this on any individual page to override the global default. This **20** can be globally changed by setting the following PHP variable in wtk/wtkServerInfo.php.  Of course if you want you can set this on any individual page to override the global default.
  
-<code>+<code php>
 $gloRowsPerPage = 30; $gloRowsPerPage = 30;
 </code> </code>
  
 +===== Custom HTML Row and Header =====
 +
 +Usually you want the data returned in simple columns, and that is the default for wtkBuildDataBrowse.  If you need a custom HTML layout and Header, that is easily done.  Simply define those in these two PHP variables and wtkBuildDataBrowse will replace @ColumnNames@ with the data from the associated column.  For example, from the demo/listCustomRowHTM.php page you can see this code:
 +
 +<code php>
 +
 +$pgSQL =<<<SQLVAR
 +SELECT `UID`, DATE_FORMAT(`AddDate`, '$gloSqlDateTime') AS `Date`,
 +    CONCAT(`FilePath`, `NewFileName`) AS `WTKIMAGE`,
 +    CONCAT(`FirstName`, ' ', COALESCE(`LastName`,'')) AS `Name`,
 +    `Address`, `City`, `State`, `Zipcode`
 +  FROM `wtkUsers`
 + WHERE `NewFileName` IS NOT NULL
 +ORDER BY `FirstName` ASC
 +SQLVAR;
 +
 +$gloColHdr = '<th class="center">The WTK Demo List</th>';
 +
 +$gloRowHtm =<<<htmVAR
 +<td><div class="row">
 +        <div class="col s5 center">
 +            @WTKIMAGE@
 +            <a class="btn" onclick="JavaScript:alert('My UID is @UID@ and my name is @Name@')">Click Me</a>
 +        </div>
 +        <div class="col s7">
 +            <h4>@Name@</h4><br>
 +            <p><em>added @Date@</em><br>
 +            @Address@<br>
 +            @City@, @State@ @Zipcode@</p>
 +        </div>
 +    </div>
 +</td>
 +htmVAR;
 +
 +$pgHtm  = '<h4>Listing with Custom Row Template</h4>' . "\n";
 +$pgHtm .= wtkBuildDataBrowse($pgSQL);
 +</code>
 ===== wtkRowFunction ===== ===== wtkRowFunction =====
  
Line 250: Line 287:
 Here is example code: Here is example code:
  
-<code>+<code php>
 // You define the next function in any way you like // You define the next function in any way you like
 function wtkRowFunction($fncHtmRow, $fncData){ function wtkRowFunction($fncHtmRow, $fncData){
Line 282: Line 319:
  
 Utilizing this, the wtkBuildDataBrowse function will call your **wtkRowFunction** function passing it the row of data that was retrieved and formatted.  Your function can modify the row HTML in any way and has full access to the data via the passed **$fncData[]** array.  Then you return the modified HTML which will be used in the browse list. Utilizing this, the wtkBuildDataBrowse function will call your **wtkRowFunction** function passing it the row of data that was retrieved and formatted.  Your function can modify the row HTML in any way and has full access to the data via the passed **$fncData[]** array.  Then you return the modified HTML which will be used in the browse list.
 +
 +====== Demo Pages ======
 +
 +We have several demos showing all the different functionality for the **wtkBuildDataBrowse** function which you will find is one of the most useful functions in the Wizard's Toolkit library.
 +
 +The PHP demos have exact minimalist code examples of how easy it is to use the powerful feature of passing a SQL query to generate a full listing web page with all of the features listed above.
 +
 +  * /demo/listDataMin.php - uses wtkFillBrowsePage
 +  * /demo/listCustomHTML.php - demo wtkFillBrowsePage with custom HTML template
 +  * /demo/listSortAligns.php - uses wtkSetHeaderSort
 +  * /demo/list3demo.php - 3 lists on one page
 +  * /demo/listWithImage.php - demo of WTKIMAGE feature
 +  * /demo/listRowFunction.php - demo wtkRowFunction for extreme flexibility
 +  * /demo/listCustomRowHTM.php - demo $gloColHdr and $gloRowHtm
 +
  
 ====== WTK Page Builder ====== ====== WTK Page Builder ======
browse_box.1733111633.txt.gz · Last modified: 2024/12/02 03:53 by wtkadmin