When an in-line input validation is inside a button, which is inside a form tag, Validation does not work. I expect the error message to appear, but it does not. I tested both forms of button, i.e., input type="button" and <button>. Neither work. When I remove the button code, the input tag validates and Validation produces the error message. Of course, my page no longer has a button, so this is not a fix. I used the current version of jQuery via Google, Firefox 4.0, and WindowsXP. The code, with button, is below.

HTML:

<form action = "rentInputProcessor.php" method="POST" id = "rentDataInput" name = "rentDataInput" accept-charset = "utf-8" enctype = "multipart/form-data">

<input type="button" id="editPosting" name="editPosting" title="creates a dialog box to begin editting an existing posting" value="Edit an existing posting" />

<div id="editEntryItems" style='display: none;' > <!-- used to create the dialog box for editing existing postings -->

<label for="contactEmailAddress"></label>

<p>My E-Mail Address Is:</p>

<input type="text" id="contactEmailAddress" name="contactEmailAddress" class="validCharsCheck" size="50" maxlength="50" />

<p>My Password Is:</p>

<label for="contactPassword"></label>

<input type="password" name="contactPassword" id="contactPassword" class="validCharsCheck" size="12" maxlength="12" />

jQuery:

check for unwanted characters

$.validator.addMethod('validCharsCheck', function (value)

{

var result = true;

unwanted characters

var iChars = "!@#$%^&*()=[]\\\\\\;/{}|\\":<>?"; //what about . , ' + - They are useful, but can be used poorly

for (var i = 0; i < value.length; i++) {

if (iChars.indexOf(value.charAt(i)) != -1) {

return false;

}

}

return result;

},

'Use numbers and alphabetic characters');

$("#rentDataInput").validate({

debug: true, )};

</div> <!--End editEntryItems -->