javascript for mouse click events

Use this board to ask questions or have discussions with other Rich Displays users.
Post Reply
Stuart
Profound User
Posts: 30
Joined: Tue Apr 17, 2012 4:37 pm
First Name: Stuart
Last Name: Leonard
Company Name: Summit Holdings
Phone: 813-665-6060
Address 1: 2310 Commerce Point Drive
City: Lakeland
State / Province: Florida
Zip / Postal Code: 33594
Country: United States
Contact:

javascript for mouse click events

Post 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?
Stuart
Profound User
Posts: 30
Joined: Tue Apr 17, 2012 4:37 pm
First Name: Stuart
Last Name: Leonard
Company Name: Summit Holdings
Phone: 813-665-6060
Address 1: 2310 Commerce Point Drive
City: Lakeland
State / Province: Florida
Zip / Postal Code: 33594
Country: United States
Contact:

Re: javascript for mouse click events

Post 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.
Scott Klement
Experienced User
Posts: 2711
Joined: Wed Aug 01, 2012 8:58 am
First Name: Scott
Last Name: Klement
Company Name: Profound Logic
City: Milwaukee
State / Province: Wisconsin

Re: javascript for mouse click events

Post 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?
Stuart
Profound User
Posts: 30
Joined: Tue Apr 17, 2012 4:37 pm
First Name: Stuart
Last Name: Leonard
Company Name: Summit Holdings
Phone: 813-665-6060
Address 1: 2310 Commerce Point Drive
City: Lakeland
State / Province: Florida
Zip / Postal Code: 33594
Country: United States
Contact:

Re: javascript for mouse click events

Post 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)
Scott Klement
Experienced User
Posts: 2711
Joined: Wed Aug 01, 2012 8:58 am
First Name: Scott
Last Name: Klement
Company Name: Profound Logic
City: Milwaukee
State / Province: Wisconsin

Re: javascript for mouse click events

Post 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?
Stuart
Profound User
Posts: 30
Joined: Tue Apr 17, 2012 4:37 pm
First Name: Stuart
Last Name: Leonard
Company Name: Summit Holdings
Phone: 813-665-6060
Address 1: 2310 Commerce Point Drive
City: Lakeland
State / Province: Florida
Zip / Postal Code: 33594
Country: United States
Contact:

Re: javascript for mouse click events

Post 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!
Paul_Ramcharitar
Profound User
Posts: 91
Joined: Fri Aug 03, 2012 11:07 am
First Name: Paul
Last Name: Ramcharitar
Company Name: Banks DIH
City: Georgetown
Zip / Postal Code: 592
Country: Guyana
Contact:

Re: javascript for mouse click events

Post 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.
Post Reply

Who is online

Users browsing this forum: No registered users and 2 guests