How to enable/disable fields by radio button using javascript
Need your help over the below coding, this coding is done to generate a
web form for capturing users input for building a html style-sheet,
however, I wanted to create java-script coding in such a way that when
user select 'Atom' radio button, the rest of the below radio buttons
should get disabled, and when radio button 'Others' is selected, those
below radio buttons should get enabled again. Please run this code over
your browser, and you'll able to know what I'm here taking about, please
let me know if there is any more info needed.
Thanks,
Rahul
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<body>
<h1>Web Feed Request</h1>
Feed URL: <input type= "text" name= "FeedURL"/>
<br/>
<br/>
<label for="NumberFeeds">Number of Feeds: </label>
<select name="select">
<option value="" disabled="disabled" selected="selected">Number of
Feeds</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select>
<br/>
<br/>
<label for="FeedType">Feed Type: </label>
<label for="FeedTypeAtom">ATOM: </label>
<input type="radio" name="DescLength" id = "FeedAtom" value="Atom"
Atom />
<label for="FeedTypeOther">Other: </label>
<input type="radio" name="DescLength" id = "Feedother" value="Other"
Other />
<br/>
<br />
<form name="WebFeedsForm">
<label for="DisplayLength">Title/Description Length: </label>
<label for="DspLength35">35: </label>
<input type="radio" name="DescLength" id = "Length35" value="35" 35 />
<label for="DspLength80">80: </label>
<input type="radio" name="DescLength" id = "Length80" value="80" 80 />
<label for="DspLength100">100: </label>
<input type="radio" name="DescLength" id = "Length100" value="100" 100
/>
<br/>
<br/>
<label for="DisplayLength">Number of Description Lines: </label>
<label for="DspLines0">0: </label>
<input type="radio" name="DescLines" id = "Lines0" value="0" 0 />
<label for="DspLines2">2: </label>
<input type="radio" name="DescLines" id = "Lines2" value="2" 2 />
<label for="DspLines10">10: </label>
<input type="radio" name="DescLines" id = "Lines10" value="10" 10 />
<br/>
<br/>
<input type="checkbox" name="BetweenSpace" value="BlankLine" /> Blank
Line Between Feeds<br/>
<br/>
<label for="DisplayIcons">Icons on Feeds: </label>
<label for="DspIcons0">None: </label>
<input type="radio" name="DescIcons" id = "Icons0" value="None" 0 />
<label for="DspIconsB">Bullet: </label>
<input type="radio" name="DescIcons" id = "IconsB" value="Bullet" 2 />
<label for="DspIconsA">Arrow: </label>
<input type="radio" name="DescIcons" id = "IconsA" value="Arrow" 10 />
<br/>
<br/>
<input type="checkbox" name="ShowDate" value="ShowDate" /> Display
Date<br/>
<br/>
<input type="checkbox" name="ShowAuthor" value="ShowAuthor" /> Display
Author<br/>
<br/>
<br/>
</form>
</body>
</html>
No comments:
Post a Comment