This topic is locked
[SOLVED]

 Dynamic Hide/Show of buttons on List Page

11/18/2017 2:59:41 PM
PHPRunner General questions
T
thamestrader author

In my application I have a Customer List page, which has an 'Add New' button that links to the Add page for the table. I'd like to 'encourage' users to actually do a search for the customer before attempting to add them as a new customer. I thought I could do this by initially hiding the Add New button until a search had been performed.
I've got the hide/show of the Add New button working using the following code in the JavaScript Onload event for the List page.
var id = "addButton";

var button = $("[id^=" + id + "]");

Runner.addDisabledClass(button);

if (proxy.Show_Button == true) {

Runner.delDisabledClass(button);

}
Firstly in the Before Process event I have the following:
if (!$_SESSION["Show_AddButton"]) {

$_SESSION["Show_AddButton"] = false;

}
Then in the Before Display event I have the following code.

$pageObject->setProxyValue("Show_Button", $_SESSION["Show_AddButton"]);

$_SESSION["Show_AddButton"] = true;
Finally I have had to include the following code in the Before Process on ALL the other pages the users have access to. Although this is working perfectly this feels like a work-around as the right place for the unset would be on leaving the List page, but I can see no way of detecting that.

unset($_SESSION["Show_AddButton"])
I've been searching through the Forum for ideas that might help me but I've drawn a blank.
I'd like to be able to detect whenever the list page is selected from the menu - to hide the button and only show the button when a search has been completed, even if it returns 0 records. I was hoping that it might be possible to examine the variables used for messages displayed on a List page "Nothing to see. Run some search" = Hide and "No results found" or records listed = Show.
Does any one have any thoughts on whether there is a better way to do this please?

jadachDevClub member 11/19/2017

Try making the search page as default from the menu. Then move your add new button in the message block. Remove the default message.
This way users go to search first, and only when no results show, they can add new.

T
thamestrader author 11/28/2017



In my application I have a Customer List page, which has an 'Add New' button that links to the Add page for the table. I'd like to 'encourage' users to actually do a search for the customer before attempting to add them as a new customer. I thought I could do this by initially hiding the Add New button until a search had been performed.
I've got the hide/show of the Add New button working using the following code in the JavaScript Onload event for the List page.
var id = "addButton";

var button = $("[id^=" + id + "]");

Runner.addDisabledClass(button);

if (proxy.Show_Button == true) {

Runner.delDisabledClass(button);

}
Does any one have any thoughts on whether there is a better way to do this please?


** Update *
The above code did change the button background colour, but the link was still active.
I tried adapting the code from the Save Confirm example

Runner.delDisabledClass(pageobj.saveButton);

i.e.

Runner.delDisabledClass(pageobj.addButton);
This didn't do anything.
So then I tried:

document.getElementById("addButton1").disabled = false;
This did disable the button, but the colours were unchanged. Slowly getting there.

Further update..

What I've got working requires a combination of the PHPRunner code and the raw JS.
Runner.addDisabledClass(pageobj.addButton); // to manage the colours

document.getElementById("addButton1").disabled = true; // to actually disable
And to re-enable the button with the correct colours.

Runner.delDisabledClass(pageobj.addButton); // to manage the colours

document.getElementById("addButton1").disabled = false; // to actually enable
Possible not the most elegant, but it seems to be working as I require for disabling/enabling.

T
thamestrader author 11/28/2017



** Update *
The above code did change the button background colour, but the link was still active.
I tried adapting the code from the Save Confirm example

Runner.delDisabledClass(pageobj.saveButton);

i.e.

Runner.delDisabledClass(pageobj.addButton);
This didn't do anything.
So then I tried:

document.getElementById("addButton1").disabled = false;
This did disable the button, but the colours were unchanged. Slowly getting there.

Further update..

What I've got working requires a combination of the PHPRunner code and the raw JS.
Runner.addDisabledClass(pageobj.addButton); // to manage the colours

document.getElementById("addButton1").disabled = true; // to actually disable
And to re-enable the button with the correct colours.

Runner.delDisabledClass(pageobj.addButton); // to manage the colours

document.getElementById("addButton1").disabled = false; // to actually enable
Possible not the most elegant, but it seems to be working as I require for disabling/enabling.


Does onyone have any suggestions on how to detect whether a basic search has been initiated on a list page? As I need to detect this in order to enable the button again.

T
thamestrader author 11/29/2017



Try making the search page as default from the menu. Then move your add new button in the message block. Remove the default message.
This way users go to search first, and only when no results show, they can add new.


Thanks for the suggestion. Currently the users have a single "Customer Search' menu option which is basically a list page, with popup Add, Edit and View pages. The search bar has been simplified leaving just the search field and the only 2 fields on the list page are searchable last name and post code. The users don't use the Advanced Search or the extended basic search.

T
thamestrader author 12/1/2017


To cut a long boring story short........here is what I found works.
To disable/enable the Add new button on a List Page.
In the _[b]BeforeDisplay
_event - create a proxy variable to indicate whether the button should be disabled (false) or enabled (true). I have chosen to make this decision according to whether or not the user has submitted a search to check if the record already exists, more of this further on.
$pageObject->setProxyValue("Show_Button", False); [color="#008000"]// default to false

if (strlen($_SERVER['QUERY_STRING']) > 0) {

if (substr($_SERVER['QUERY_STRING'],0,1) == "q") { [color="#008000"]// and is it a search and not a return.

$pageObject->setProxyValue("Show_Button", true);}

}
In the JSOnLoad event include the following code. This is a modified version of the code in the PHPRunner manual.



// Disable/Enable 'Add New' button


var id = "addButton";

var button = $("[id^=" + id + "]");
if (proxy['Show_Button'] == true) {

Runner.delDisabledClass(button);

document.getElementById("addButton1").disabled = false; [color="#008000"]// this actually disables but doesn't change the colours

}

else {

Runner.addDisabledClass(button);

document.getElementById("addButton1").disabled = true; [color="#008000"]// this actually disables but doesn't change the colours

}
A note on $_SERVER['QUERY_STRING'].
The contents can be checked for different searches by looking at the webpage address, what I found was as follows:

  1. a=return - when return to the master table from the detail table.
  2. q= something - when either basic search or advanced search is used.
  3. qs = something - when using the simple combo search field.
    If AJAX search, sorting and pagination is selected (ticked) for the List Page only Advanced Search will populate QUERY_STRING, even though the other 2 methods still work.