NewSourceMedia Blog » autofill http://newsourcemedia.com/blog Focused on Interactive Design, Development and Marketing Wed, 11 Aug 2010 13:56:31 +0000 http://wordpress.org/?v=2.9.2 en hourly 1 Alert Boxes http://newsourcemedia.com/blog/alert-boxes/ http://newsourcemedia.com/blog/alert-boxes/#comments Mon, 29 Mar 2004 00:22:11 +0000 admin http://newsourcemedia.com/blog/2004/03/28/alert-boxes/ Alert boxes are small popup boxes that are triggered by user events. Here are a few good examples on how to alert your users.

Alert boxes could be used to help users find mistakes, warn them of hazards, or to display a status of events.

1) View Alert Box

Click here to see an alert!

Here is the source code:

<a href=”#” onclick=”alert(‘This is an alert’)”>Click here to see an alert!</a>

You could also use the onclick=”alert(“bla bla”)” or the onChange=”alert(“bla bla”)” inside form elements like buttons and pulldown menus.

2) Other Options:

You can also alert users before they enter your site by placing the “alert” inside the body tag like so:

<body onload=”alert(‘Warning: this site is crazy.’)”>

3) Confirm: Yes or Cancel Alert:

JavaScript provides a function called confirm. This generates an alert box with two buttons, asking “Yes” or “Cancel”. To create this alert we define our own function in the head of a document:

[Start of Code]

<script language=”javascript” type=”text/javascript”>
<!–
function alertURL(url) {
if(confirm(“Are you sure you want to click this link”))
{
location=url
}
}
//–>
</script>

<!– The new function “alertURL()” is called once the link (below) is clicked. Notice that the url address below is located inside the brackets. This is then passed to our function and handled by the javascript “location” statement if the user clicks yes: –>

<a href=”#” onClick=”alertURL(‘fake_page.html’)”>Click Here!</a>

[End of Code]

This could be used to persuade users to stay on the page they are visiting. Or if the link was directed to a server side program that would execute code that was unchangeable (ex: delete a file or update data), this would be a safe guard.

4) Confirm: Form Submissions Yes or No Alert

You can also use it on a form submission. This is easy. Just add the following code to your “form” tab:

[Code]

<form action=”" method=”get” onsubmit=”return confirm(‘Are you sure?’)”>

[End of Code]

]]> http://newsourcemedia.com/blog/alert-boxes/feed/ 0 Address Auto-Fill Ckeck Box http://newsourcemedia.com/blog/address-auto-fill-ckeck-box/ http://newsourcemedia.com/blog/address-auto-fill-ckeck-box/#comments Sat, 28 Feb 2004 00:22:11 +0000 admin http://newsourcemedia.com/blog/2004/02/27/address-auto-fill-ckeck-box/ Javascript code that automatically fills in the address in all places needed on the page after just once entering it and selecting the check box.

Introduction:

I ran across this code when working on a registration product site. The goal is to save the user’s time by not having them fill in the same address over and over, if the address for there billing is the same as the mailing address.

You can view a working form by clicking here.

Source Code

<html>
<title></title>
<head>
<script type="text/javascript" language="javascript">
function set_billing(box)
{
var f = box.form, b_which = box.checked, from_el, to_el, i = 0;
var fld_name = new Array('city' , 'state');
while (from_el = f[fld_name[i]])
{
to_el = f['bill' fld_name[i ]];
to_el.value = b_which ? from_el.value : '';
if (to_el.readOnly != null)
to_el.readOnly = b_which ? true : false;
else to_el.onfocus = b_which ? function() {this.blur();
}
: null;
}
}
</script>
</head>
<body>
<form>
<table>
<tr>
<td align="right">
<strong>Mailing Address</strong><br>
City: <input name="city" type="text" id="city" onchange="set_billing(billingaddrsame)"><br>
State: <input name="state" type="text" id="state" onchange="set_billing(billingaddrsame)"><br>
<strong>Billing Address</strong><br>
( same as above)
<input type="checkbox" name="billingaddrsame" onclick="set_billing(this)"><br>
City: <input name="billcity" type="text" id="billcity"><br>
State: <input name="billstate" type="text" id="billstate"><br>
</td>
</tr>
</table>
</form>
</body>
</html>
]]> http://newsourcemedia.com/blog/address-auto-fill-ckeck-box/feed/ 6 Telephon Check Box http://newsourcemedia.com/blog/telephon-check-box/ http://newsourcemedia.com/blog/telephon-check-box/#comments Sat, 28 Feb 2004 00:22:11 +0000 admin http://newsourcemedia.com/blog/2004/02/27/telephon-check-box/ Javascript code that automatically fills in the telephone number in all places needed after just once entering it and selecting a check box.

Introduction:

I ran accross this code when working on a registration product site. The goal is to save the user’s time by not having them fill in the same telephone number over and over, if the number is the same as other data fields.

You can view a working form by clicking here.

Source Code

<html>
<head>
<title>NSM | Tele Check Box</title>
</head>
<body>
<form>
Home Telephone:
<input name="home_phone" type="text" size="14" maxlength="12">
<br>
Work Telephone:
<input name="work_phone" type="text" size="14" maxlength="12">
<input type="checkbox" name="same_mail" onClick="work_phone.value=(this.checked)?home_phone.value:''">
(check if same as home number)
</form>
</body>
</html>
]]> http://newsourcemedia.com/blog/telephon-check-box/feed/ 0