PHPMaker generates your pages that contain Search Panel using the standard style. In addition, that Search Panel status will always using one condition based on the setting we chose when we generate the script files using PHPMaker. If we want to use the default status whether collapsed or expanded, then we have to re-generate the related script files. This is not good situation, I think.
The following modification will change the look of your Search Panel, so that it will look more eye-catching and more beauty by adding the colored background and the outlines around its box or section. Also, this following modification will give you the flexibility to decide; whether to use Collapsed or Expanded as the default status. You can simply adjusting the related constant from the configuration (ewcfg*.php) file. In other words, you don’t have to re-generate your related script files that contain the search panel each time you want to switch from collapsed to expanded (and vice versa) for that Search Panel.
All we have to do is customizing PHPMaker template files. In other words, we will not modify the generated script files at all. Please note that the default value of the Search Panel whether collapsed or expanded will be get from PHPMaker setting under the Tools -> Advanced Settings -> Initiate search panel as collapsed.
Updated on May 29, 2012: This customization has been implemented in PHPMaker version 9.0.2, it matches to each other, and as a result, it works properly.
Updated on July 21, 2012: This customization has been implemented in PHPMaker version 9.0.3, it matches to each other, and as a result, it works properly.
Updated on September 4, 2012: This customization has been implemented in PHPMaker version 9.0.4, it matches to each other, and as a result, it works properly.
Updated on November 27, 2012: This customization has been implemented in PHPMaker version 9.1.0, it matches to each other, and as a result, it works properly.
Updated on February 9, 2013: This customization has been implemented in PHPMaker version 9.2.0, it matches to each other, and as a result, it works properly.
[hidepost]
-
Open your \Script\ewcfg.php file, and find this code:
// General
before that line, please insert the following code:
// Begin of modification Customizing Search Panel, by Masino Sinaga, for customize search panel, May 1, 2012 define("MS_SEARCH_PANEL_COLLAPSED", PROJ.GetV("SearchPanelCollapsed"), TRUE); // Whether to collaps or expand the search panel, get the value from PHPMaker setting // End of modification Customizing Search Panel, by Masino Sinaga, for customize search panel, May 1, 2012 -
Open your \Script\ew_addon.js file, and find this code (PHPMaker version <= 9.0.2):
[code lang="php"]
// Init search panel as collapsed
.InitSearchPanel = true;
[/code]or if you are using PHPMaker version >= 9.0.3 and version <= 9.2.0, find this code: [code lang="php"]
// Init search panel as collapsed
if () .InitSearchPanel = true;
[/code]then replace it with the following code (PHPMaker version <= 9.0.2): [code lang="php"]
// Init search panel as collapsed
.InitSearchPanel = true;
// Init search panel as expanded
.InitSearchPanel = false;
[/code]or if you are using PHPMaker version >= 9.0.3 and version <= 9.2.0 then replace with the following code: [code lang="php"]
// Init search panel as collapsed
if () .InitSearchPanel = true;
// Init search panel as expanded
if () .InitSearchPanel = false;
[/code] -
Open your \Script\list-script-search.php file, and find this code:
<?php if ($<!--##=gsTblVar##-->->Export == "" && $<!--##=gsTblVar##-->->CurrentAction == "") { ?> <form name="<!--##=sFormNameSearch##-->" id="<!--##=sFormNameSearch##-->" class="ewForm" action="<?php echo ew_CurrentPage() ?>"<!--## if (bExtendedBasicSearch) { ##--> onsubmit="return ewForms[this.id].Submit();"<!--## } ##-->> <a href="javascript:<!--##=sFormNameSearch##-->.ToggleSearchPanel();" style="text-decoration: none;"><img id="<!--##=sFormNameSearch##-->_SearchImage" src="<!--##=sImageFolder##-->collapse.gif" alt="" width="9" height="9" border="0"></a><span class="phpmaker"> <!--##@Search##--></span><br /> <div id="<!--##=sFormNameSearch##-->_SearchPanel">then replace it with the following code:
<?php // Begin of modification Customizing Search Panel, by Masino Sinaga, May 1, 2012 ?> <?php if ($<!--##=gsTblVar##-->->Export == "" && $<!--##=gsTblVar##-->->CurrentAction == "") { ?> <form name="<!--##=sFormNameSearch##-->" id="<!--##=sFormNameSearch##-->" action="<?php echo ew_CurrentPage() ?>"<!--## if (bExtendedBasicSearch) { ##--> onsubmit="return ewForms[this.id].Submit();"<!--## } ##-->> <a href="javascript:<!--##=sFormNameSearch##-->.ToggleSearchPanel();" style="text-decoration: none;"><img id="<!--##=sFormNameSearch##-->_SearchImage" src="<!--##=sImageFolder##-->collapse.gif" alt="" width="9" height="9" border="0"></a><span class="phpmaker"> <!--##@Search##--></span><br /> <div id="<!--##=sFormNameSearch##-->_SearchPanel" class="msSearchPanel"> <?php // End of modification Customizing Search Panel, by Masino Sinaga, May 1, 2012 ?> -
Still in the \Script\list-script-search.php file, and find this code for PHPMaker version < 9.1.0:
[code lang="php"]
[/code]
or if you are using PHPMaker version >= 9.1.0, then find this code:
<div id="xsr_<!--##=RowCnt+2##-->" class="ewRow"> <label><input type="radio" name="<?php echo EW_TABLE_BASIC_SEARCH_TYPE ?>" value="="<?php if ($<!--##=sPageObj##-->->BasicSearch->getType() == "=") { ?> checked="checked"<?php } ?> /><!--##@ExactPhrase##--></label> <label><input type="radio" name="<?php echo EW_TABLE_BASIC_SEARCH_TYPE ?>" value="AND"<?php if ($<!--##=sPageObj##-->->BasicSearch->getType() == "AND") { ?> checked="checked"<?php } ?> /><!--##@AllWord##--></label> <label><input type="radio" name="<?php echo EW_TABLE_BASIC_SEARCH_TYPE ?>" value="OR"<?php if ($<!--##=sPageObj##-->->BasicSearch->getType() == "OR") { ?> checked="checked"<?php } ?> /><!--##@AnyWord##--></label> </div>then replace it with the following code:
<div id="xsr_<!--##=RowCnt+2##-->" class="ewRow"> <?php // Begin of modification Customizing Search Panel, by Masino Sinaga, May 1, 2012 ?> <?php // End of modification Customizing Search Panel, by Masino Sinaga, May 1, 2012 ?> </div>
-
Still in the \Script\list-script-search.php file, now move your mouse cursor to the very top left of your text editor (at column 0, row 0), and find this code for PHPMaker version < 9.1.0:
[code lang="php"]
[/code]or if you are using PHPMaker version >= 9.1.0, find this code:
<!--## if (bBasicSearch) { ##--> <input type="text" name="<?php echo EW_TABLE_BASIC_SEARCH ?>" id="<?php echo EW_TABLE_BASIC_SEARCH ?>" size="20" value="<?php echo ew_HtmlEncode($<!--##=sPageObj##-->->BasicSearch->getKeyword()) ?>" />then replace it with the following code for PHPMaker version < 9.1.0: [code lang="php"]
[/code]or replace it with the following code for PHPMaker version >= 9.1.0:
<?php // Begin of modification Customizing Search Panel, by Masino Sinaga, May 1, 2012 ?> <!--## if (bBasicSearch) { ##--> <label><input type="radio" name="<?php echo EW_TABLE_BASIC_SEARCH_TYPE ?>" value="="<?php if ($<!--##=sPageObj##-->->BasicSearch->getType() == "=") { ?> checked="checked"<?php } ?> /><!--##@ExactPhrase##--></label> <label><input type="radio" name="<?php echo EW_TABLE_BASIC_SEARCH_TYPE ?>" value="AND"<?php if ($<!--##=sPageObj##-->->BasicSearch->getType() == "AND") { ?> checked="checked"<?php } ?> /><!--##@AllWord##--></label> <label><input type="radio" name="<?php echo EW_TABLE_BASIC_SEARCH_TYPE ?>" value="OR"<?php if ($<!--##=sPageObj##-->->BasicSearch->getType() == "OR") { ?> checked="checked"<?php } ?> /><!--##@AnyWord##--></label> <input type="text" name="<?php echo EW_TABLE_BASIC_SEARCH ?>" size="20" value="<?php echo ew_HtmlEncode($<!--##=sPageObj##-->->BasicSearch->getKeyword()) ?>" /> <?php // End of modification Customizing Search Panel, by Masino Sinaga, May 1, 2012 ?> -
Next step, we will add our new style to the .css file that will be generated by PHPMaker. This will beautify your search panel by adding colored background and outlined around its panel. From your PHPMaker application, go to HTML tab, then click on Styles sub-tab, and then click on Edit Styles button. You will see a CSS Editor window afterwards. Scroll down to the bottom of that textbox, and find this code:
/*END_USER_STYLES*/
before that line, please insert the following code:
/* Begin of modification Customizing Search Panel, by Masino Sinaga, May 1, 2012 */ .msSearchPanel { background-color: #EEEEEE; padding: 0.5em; border-left: 1px solid #CACACA; border-right: 1px solid #CACACA; border-top: 1px solid #CACACA; border-bottom: 1px solid #CACACA; text-align: left; font-family: tahoma; /* font name */ display: block; vertical-align:top; } /* End of modification Customizing Search Panel, by Masino Sinaga, May 1, 2012 */ - Finally, re-generate your script files as usual using PHPMaker.
[/hidepost]
Is there a piece missing from Step 2 for >= 9.1.0?
I just changed:
“or if you are using PHPMaker version >= 9.0.3, find this code:”
become:
“or if you are using PHPMaker version >= 9.0.3 and version <= 9.1.0, find this code:" The code itself that is replaced in step 2 for >=9.0.3 and <= 9.1.0 is the same.