The Fortunate.Javascript object - button-click confirmations, pop-up windows, auto-focus on a control, and many more javascript web development tasks.

Here are demos of each script included in the Fortunate.Web.Javascript component. Code samples are shown at the bottom of the page.

Method: AddControlToMonitor
Call this method for each control you want to monitor. If any control being monitored has been changed and the page is navigated away from before saving those changed a prompt asking the user if they are certain they want to leave without saving will appear.

To test this behaviour navigate away from this page without changing the drop down list below. Then come back, change the drop down list and try navigating away again. Unless you click the save button you will be prompted to make sure you don't leave without saving your changes.

Method: AttachConfirmation
Pops up a confirmation box. The confirmation can be displayed for any object's event. It is most commonly used to confirm a delete button click.

Method: AttachDisableSubmit
Keeps the submit button from being clicked more than once, but first checks that the page is valid. Enter some text and then click submit more than once to test.

Name:
Please enter your name.

Method: AttachWindowPopup
Attach a window popup to the javascript event of your choice.

Method: ScrollToElement
Attach a javascript to the object of your choice which will automatically scroll the window to the object.

Method: SetFocus
Sets focus on the object entered. Can be used on pageload or postback to set focus on any page element.

Click the Set Focus button below and note that on post back the cursor will automatically appear in the text box.

Method: TextBoxEnterEventHandler
Normally in .NET pressing the enter key while in a text box does not always trigger the expected submit button. This method allows you to set any text box to click any button when the enter key is pressed while within the text box.

If you place your cursor in the text box above this which was used in the set focus example and click enter you will note that nothing happens. But if you place your cursor in the text box below and click enter the "Enter" button will be clicked for you. (Note that the page posts back.)

Sample Code: AddControlToMonitor
The AddControltoMonitor method allows you to add as many controls as you'd like one after the other. If any of the control's values change and a user attempts to leave the page before saving the changes they are prompted to save changes.

Adding controls to monitor is simple:

Fortunate.Web.Javascript.AddControlToMonitor(Page, StateDropDownList)
Fortunate.Web.Javascript.AddControlToMonitor(Page, NameTextBox)

Of course if you have more than one button on the page you may not want more than one button to trigger this alert. If there is a control that is going to cause a post back or page change which you don't want this alert raised for you can exclude a control like so:

Fortunate.Web.Javascript.BypassMonitorChanges(DeleteButton)

Sample Code: AttachConfirmation
Pops up confirmation dialog with a message of your choice requesting that the user verify the action.

Fortunate.Web.Javascript.AttachConfirmation(DeleteButton, Fortunate.Web.Javascript.EventType.OnClick, "Are you sure you want to delete this information?")

Sample Code: AttachDisableSubmit
Disables the submit button after a successful submit in order to keep more than one post back from occurring.

Fortunate.Web.Javascript.AttachDisableSubmit(Page, SubmitButton)

Sample Code: AttachWindowPopUp
Attaches a pop-up window to the page event of your choice. Opens a centered pop-up window with dimensions and settings of your choice.

Fortunate.Web.Javascript.AttachWindowPopUp(Page, PopupWindowButton, [Uri as String], Fortunate.Web.Javascript.EventType.OnClick, [Window Name as String], [Width in pixels], [Height in pixels], [Show toolbar True|False], [Show locationbar True|False], [Show statusbar True|False], [Show menubar True|False], [Show scrollbars True|False], [Allow resizable True|False], [Also causes form PostBack True|False])

Sample Code: ScrollToElement
ASP.NET has had SmartNavigation which may be used to maintain a user's place on a page during postbacks. But many people have reported SmartNavigation as being very buggy and my own experiences using it have not been consistent. To give the same type of effect I created this method which scrolls a user directly to the input element:

Fortunate.Web.Javascript.ScrollToElement(Page, MessageLabel)

If an element is contained within another element that has it's own scroll bars like a scrolling div then include the name of the outer element:

Fortunate.Web.Javascript.ScrollToElement(Page, MessageLabel, "ContentDiv")

Sample Code: SetFocus
Set's focus on the control entered.

Fortunate.Web.Javascript.SetFocus(Page, UserNameTextBox)

Sample Code: TextBoxEnterEventHandler
Any text box and button may be hooked up so that pressing enter in the text box causes the associated button to be clicked.

Fortunate.Web.Javascript.TextBoxEnterEventHandler(SearchTextBox, SearchButton)
Fortunate.Web.Javascript.TextBoxEnterEventHandler(PasswordTextbox, LoginButton)