Page 1 of 1

javascript for mouse click events

Posted: Tue Jul 30, 2013 1:24 pm
by Stuart
Hello, I need to activate/deactivate buttons based on if the user clicked an item in a dropdown list or a grid. What is the necessary javascript needed to intercept the mouse clicked event for these components and return an indicator to the RPG program to control activation/deactivation of the buttons?

Re: javascript for mouse click events

Posted: Tue Jul 30, 2013 2:31 pm
by Stuart
I don't believe that a variable can be returned from js function to the RPG program, only a response "pui.click("Enter");"

Here is a better definition of what I'd like to do:

screen flow:
Scenario 1 (drop down list with add button activation)

dropDown list

user clicks on items(s) in the drop down

Add button is now enabled, because uer has selected item(s) in the list.

user presses Add button, selected values from dropdown list are added to a one column grid

Scenario 2 (removing items from the grid)

User clicks on item(s) in a one column grid.

Remove button is enabled, because user has selected one or more rows in the grid

When remove button is clicked, items are removed from grid.

Re: javascript for mouse click events

Posted: Tue Jul 30, 2013 11:49 pm
by Scott Klement
have you considered doing drag and drop? That would be more elegant, imho, than having add/remove buttons.

But, the buttons are certainly doable. Turn on the "row selection" property of the grid, and bind a field to the "selection field" property. You can use this to determine which rows were selected with the mouse in both subfiles.

When the user clicks the add button, loop thru the first subfile, find any selected records, and remove them from that subfile, but add them to the second subfile.

For the remove button, do the same thing, except find the selected rows in the 2nd subfile, and write them to the 1st subfile.

Make sense?

Re: javascript for mouse click events

Posted: Wed Jul 31, 2013 8:23 am
by Stuart
Hello Scott, Thank you for your informative response. Not sure if DnD is the manner in which I should handle this, but here's some clarification of how items are to be added to the grid:

User will select item(s) from a dropdown list widget

The "add items to grid" button will be activated because items have been selected from the dropdown list (I think this would require js, to detect mouse clicked event in the dropdown, and enable the "add items to grid" button) I also need to keep track of the items selected from the drop down list, when the user clicks the "add items to grid" button.

User presses "add items to grid button". Items are added from dropdown list to the grid.

When the items are added to the grid, the items will simultaneously be added to a database table, and removed from the drop down list. (this part I can handle in the RPG program)

Re: javascript for mouse click events

Posted: Wed Jul 31, 2013 11:47 am
by Scott Klement
ahh, sorry about that... I visualized a grid on the left, a grid on the right, and add/remove buttons between them, even though you did say "drop down". Ooops!

The select box ("drop down") widget does have Javascript events for when you click an item in the list. You could write your own JS code to run on this 'onclick' event. There's also an 'onchange' event that might work better? You could give each one a try and see what works better.

Anyway, when your event fires, you could get the value property and see if anything is selected -- and if not, disable the "add" button, or if something is selected, enable the "add" button.

Is that what you had in mind?

Re: javascript for mouse click events

Posted: Wed Jul 31, 2013 12:35 pm
by Stuart
Yes, thank you!

Actually what you described (classic add/subtract list) with the 2 grids might just be more feasible than using the select box widget.

Again, I appreciate all your help!

Re: javascript for mouse click events

Posted: Thu Aug 15, 2013 1:27 pm
by Paul_Ramcharitar
Hi, if you are going to use the drop down method, Set the visibility property of your button to "hidden". So when the your program loads initially the button isn't shown. Then in the onchange event of your drop down widget add the 2 lines below.

Code: Select all

applyProperty("StyledButton1", "visibility", "visible");  // set visibility property
applyProperty("StyledButton1", "field type", "styled button");  // reapply "field type" to render with new property settings
first parameter is the ID of the button, second parameter is the name of the property and the third parameter is the value of the property.http://www.profoundlogic.com/docs/displ ... opValue%29

This will show the button when the value in the drop down widget is changed. When you click the button, a response is sent to make your changes and reload the screen with the button hidden again.