Click to See Complete Forum and Search --> : Comparing Text Field Data


streeves
09-05-2003, 05:53 PM
I have a form that has 3 text fields and 1 textarea field. When the User edits the record, the data that was entered and stored in the database is being output into the fields so the User an edit it..

Here's my question. If the user modifies the data in either two of the text fields, I want the data that is displaying in the TEXTAREA field to go blank, forcing the user to input "New Text/Comments" in the TEXTAREA...The TEXTAREA is a required field and if the user changes the "Contract Value" field for example, I want to force them to enter "new comments" about why they are changing it before they submit the form and update the database record.

I know I will have to compare the data in javascript to see if the data is changed in either two text fields, but I'm not sure how to do this and whether to use OnChange, etc in the actual text field tag...

Any ideas are appreciated...

Thanks

Khalid Ali
09-05-2003, 06:30 PM
use onblur event for both text fields like

onblur="if(this.value!==variableName){alert('make sure to updated comments.');}">

streeves
09-05-2003, 06:40 PM
Thanks Kahlid...this will only warn the User to Update the Comment box correct?

How bout if I want the Textarea to erase the text that is in it if they change one of the text fields above? Is there a simple way to do that, thereby forcing them to Update it since they can't submit the form with the Textarea being blank...

Thanks

Jupac
09-05-2003, 07:20 PM
try this untested tho
<script type="text/javascript">
function erase(){
document.formname.textareaname.value=""
}
</script>

and use onchange="erase()"

Charles
09-06-2003, 06:17 AM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="Content-Script-Type" content="text/javascript">
<title>Example</title>

<style type="text/css">
<!--
label {display:block; margin:1em 0em}
input, textarea {display:block}
-->
</style>

<form action="">
<div>
<label>Project Name<input type="text" name="project" onchange="this.form.comments.value=''; this.form.comments.focus()"></label>
<label>Client<input type="text" name="client" onchange="this.form.comments.value=''; this.form.comments.focus()"></label>
<label>Contract Value<input type="text" name="value" onchange="this.form.comments.value=''; this.form.comments.focus()"></label>
<label>Comments<textarea name="comments">Fee, Fie, Foe, Fum</textarea></label>
</div>
</form>

streeves
09-08-2003, 12:57 PM
Hey thanks..those were all good solutions..Charles, I ended up using the onchange, simple and did exactly what I wanted...thanks again for your responses.