I have a page with radio buttons that either enable or disable textboxes depending on the radio button selection. When the user clicks submit the they are taken to a thank you page, but if they hit the back button on the browser the radio buttons both return false and the correct boxes are not disabled... Is there a way to trigger a function or store what boxes are diabled?

I tried clearing everything just before the redirect as a quick fix, but that did not help.

I am using this with .NET 2.0 C# if that makes a difference.

In a nutshell, I either need to make sure the form is cleared or the correct textboxes are disabled when the user hits the back button on the browser.

Recommended Answers

All 3 Replies

You could use a hidden form and javascript onchange submit to allow the code to assign the values to the cookie session and code the page to check the session for checked value. Maybe there is an easier way..... Let me think about it some more.....

You can have JavaScript save cookies. This is done immediately, so page reloads are not needed.

Example JS:

/**
* Set a cookie
* @param string cookie name
* @param string cookie value
* @param string cookie expiration counter in days
* @param string cookie path
* @param string cookie domain
* @param bool secure?
*/
function setCookie( name, value, expires, path, domain, secure ) {
	var today = new Date();
	today.setTime( today.getTime() );
	if ( expires ) {
		expires = expires * 1000 * 60 * 60 * 24;
	}
	var expires_date = new Date( today.getTime() + (expires) );
	document.cookie = name+"="+escape( value ) +
		( ( expires ) ? ";expires="+expires_date.toGMTString() : "" ) +
		( ( path ) ? ";path=" + path : "" ) +
		( ( domain ) ? ";domain=" + domain : "" ) +
		( ( secure ) ? ";secure" : "" );
}

/**
* Get a cookie value
* @param string cookie name
*/
function getCookie( name ) {
	var start = document.cookie.indexOf( name + "=" );
	var len = start + name.length + 1;
	if ( ( !start ) && ( name != document.cookie.substring( 0, name.length ) ) ) {
		return null;
	}
	if ( start == -1 ) return null;
	var end = document.cookie.indexOf( ";", len );
	if ( end == -1 ) end = document.cookie.length;
	return unescape( document.cookie.substring( len, end ) );
}

/**
* Remebers form inputs after you fill them in
* @param string ID of the form you want inputs remembered for
*/
function rememberFormInputs(form_id) {
	// get a reference to the form element with id 'form_test'
	var form = document.getElementById(form_id);
	// get all child input elements of the form
	var els = document.getElementsByTagName('input');
	// iterate through all form child input elements
	for (var i = 0; i < els.length; i++) {
		// this is the element with index of i
		var el = els.item(i);
		// make sure this is a text input field
		if (el.type == 'text') {
		
			// event handler to catch onblur events
			// it sets the cookie values each time you move out of an input field
			el.onblur = function() {
				// this is the name of the input field
				var name = this.name;
				// this is the value of the input field
				var value = this.value;
				// set the cookie
				setCookie( form_id + name, value);
				alert('setCookie: '+name + ' = '+value);
			};
			
			// this inserts all the remembered cookie values into the input fields
			var old_value = getCookie(form_id + el.name);
			if (old_value && old_value != '') {
				alert('old value remembered: '+old_value);
				el.value = old_value;
			}
		}
	}
}

You can then give your form an ID, and pass the ID to rememberFormInputs(form_id, prefix) when the window has finished loading:

<form id="myform">.... inputs ....</form>
// function will be run after window/document loads
window.onload = function() {
	rememberFormInputs('myform');
}

Here is a demo that uses this:
http://demo.fijiwebdesign.com/examples/forms/save_form_fields.html

View the source to see the code and how it works.

Note: this currently does not support radio buttons, but you can easily create function that does in the same manner.

Just thinking about it, a better way to do this would be to serialize the form inputs into a string. MooTools has a function that does this. I think its $('form_id').toQueryString();

Then save this to a cookie on the window.onbeforeunload event.

On the window.onload event, repopulate forms, or do your disabling etc. by reading the names of form elements and matching their values with the serialized string saved in the cookie.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.