Javascript functions for form fields

4.14 (21 votes)

A number of useful functions for accessing various properties and values of form fields.

Getting the selected index and value from a select list

function getValues(){
var dd = document.getElementById('dropdown');
theindex = dd.options[dd.selectedIndex].value;
thevalue = dd.options[dd.selectedIndex].text;
var span = document.getElementById('span1');
span.innerHTML = '  Selected Index: ' + theindex + 
	', Selected Value: ' + thevalue
}

Detect which checkbox was ticked or unticked, and an array of selected values

function getchk(val){
var output = 'You clicked ' + val + ' Selected: ';
for(var i = 0; i < document.forms[0].check.length; i++){
	if(document.forms[0].check[i].checked)
	output += document.forms[0].check[i].value + ' ';
	}
document.getElementById('span2').innerHTML = output;
}

1
2
3
4

Get the text and number of characters from a text box

function getText(){
var txt = document.getElementById('txt');
var output = txt.value;
var length = output.length;
document.getElementById('span3').innerHTML = 'Count: ' + length
	+ ' Text: ' + output;
}

You might also like...

Date Posted:
Last Updated:
Posted by:
Total Views to date: 11477

3 Comments

- Deep

I have a form which ask for YEAR. How can I restrict user to only allow to input numbers.

I have put a validation which doesn't allow non-numeric but it is tested after the form is POSTed.

Any suggestion for suppressing the non-numeric keys in "NUMERIC-ONLY" text box ???

- Mike

You should use a Javascript library like jQuery's Validate plug in to manage that kind of thing in the browser. In fact, this whole article is pretty obsolete because jQuery makes the tasks outlined above much easier.

- tiara

verry good

Recent Comments

Pam 30/08/2017 11:30
In response to Sending Email in Razor Pages
Mike, RazorPages sound like a nice choice for somebody still working in ASP classic who wants to to...

Robby Robson 15/08/2017 00:43
In response to Routing in Razor Pages
Mike: great stuff. Now that .Core Standard 2.0 is formally out, how soon will you rewrite your book...

Satyabrata Mohapatra 28/07/2017 08:59
In response to Sending Email in Razor Pages
Bit off topic, but congratulation sir for your MVP award. You deserve it !!!...

Satyabrata Mohapatra 23/07/2017 16:43
In response to Razor Pages - The Elevator Pitch
@Dale Severin You can continue to build apps using asp.net web pages....

Satyabrata Mohapatra 23/07/2017 16:40
In response to Sending Email in Razor Pages
Thanks for sharing...learned a lot...

Gfw 22/07/2017 11:53
In response to Sending Email in Razor Pages
Question... Does System.Net.Mail support SSL?...

Dale Severin 20/07/2017 03:38
In response to Razor Pages - The Elevator Pitch
I work with razor web pages extensively. I appreciate the rapid development it permits me to I am as...

Obinna Okafor 14/07/2017 01:19
In response to Routing in Razor Pages
Thank you, Mike. Good post....

Satyabrata Mohapatra 11/07/2017 16:02
In response to Routing in Razor Pages
Very powerful routing system!!...

Cyrus 05/07/2017 03:41
In response to Razor Pages - Getting Started With The Preview
How can I trim packages and services as much as possible to use just razor pages? I don’t want to to...