This recipe lets you add a double-click action to a work-with-panel's subfile row to invoke a default action on that row. The default action will be one of the actions originally offered for the subfile row. For example, consider a work-with panel where option #2 invokes the update function for the data displayed in the subfile row. By hooking up this recipe, your users can easily get to the update panel just by double-clicking on the subfile row. To add to the user experience this recipe also dynamically highlights the current row the cursor is hovering over.
The only constraints required to use this recipe is the the record format can only have one subfile on it and it must offer a drop-down set of actions (this accounts for nearly 99% of all record formats using subfiles).
Figure 1 below shows this in action. Double-clicking on the row selected invokes its default action.
Figure 1. Moving the cursor over a row selects it.
Working on the client side
<asp:ContentPlaceHolder ID="PageScriptPlaceHolder" runat="server" />
Then in the display's content page add this code.
<asp:Content ID="Content1" runat="server" ContentPlaceHolderID="PageScriptPlaceHolder">
var SFL1_DOUBLE_CLICK_ACTION_CODE = 2;
wingsHelpers.subfile.assignDoubleClickAction( "SFL1", SFL1_DOUBLE_CLICK_ACTION_CODE );
The first argument passed to the wingsHelpers.subfile.assignDoubleClickAction() method is the case-senstive alias of the subfile for which you're assigning the double-click action. To get this value, in the design-time view of the ASPX page on which the subfile resides, give the subfile focus and press F4 to see its properties. Its Alias property is shown in the Alias row (as shown below in Figure 2).
Figure 2. Seeing the subfile's Alias in Visual Studio's properties window.
The DOUBLE_CLICK_ACTION_CODE is provided for readability--to avoid having the "2" look like a magic value in the method call. By convention I name this value the alias of the subfile + "_DOUBLE_CLICK_ACTION_CODE." This value needs to be one of the available options for a subfile row. You can assign actions like this for as many subfiles as necesary in the display file.
There are four support files you need to use this double-click feature:
- rpError.css - CSS for error display.
- jquery.tmpl.min.js - jQuery template add-on (used by rpError.js).
To add these files to your Wings project, create an "OtherAssets" folder under the "Monarch" folder and add folders named "CSS" and "JS" under the OtherAssets folder. Add the files to these folders as shown in the image in Figure 3. Use the "Download code" below link to download these files.
Figure 3. Folder structure for the double-click action's support files.
jQuery to the rescue