View Full Version : [mootools] class display form inputs value

07-28-2008, 07:53 PM
Hello JavaSpecialists,

Need to write class for [form] using [mootools]

form has (input.text, select, texarea, checkbox)
after i write in input text (some text) next to this input should appear <div> with animation (alpha 0-100%) with message "this field was changed to ...."
after 3 seconds <div> with message should disappear

Need help in writing this class or guidelines how to do that

What i have

html code below
mootools library
i know the parts of [mootools] framework that should be used
don't know how put it all together

Is there any [mootools] specialist?

Best regards!

<!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" xml:lang="en" lang="en">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Class that display form value</title>
<link rel="stylesheet" href="style.css" type="text/css" media="screen" />
<script src="mootools-1-2.js" type="text/javascript"></script>
<div id="container">
<div id="form">
<form action="" method="get" name="myform">
<legend>My Form</legend>
<div class="fieldbox">
<input class="padding" name="text" type="text" />
<div class="fieldbox">
<select name="select">
<option value="option1">option1</option>
<option value="option2">option2</option>
<option value="option3">option3</option>
<div class="fieldbox">
<textarea name="message" cols="50" rows="5"></textarea>
<div class="fieldbox">
<input class="padding" name="check" type="checkbox" value="" />
<input name="submit" value="submit" type="button" />