javascript - Textarea validation with jQuery - Stack Overflow

admin管理员组

文章数量:1394585

I wish to have input of only letters into a text area in form It works well with the input fields, can't validate the textarea is it possible with jquery validate ? or what is another alternative 2) will this block malicious code input (such as xss.js)

      <form action="" method="POST" enctype="multipart/form-data" name="messageForm">
  <p>name of sender: 
   <input class="input" name="sender" id="sender" value="" size="13"
     maxlength="13" dir="ltr" autoplete="on" type="text" height="20" minlength="3" required><br>
   <p>name of receiver: 
      <input class="input" name="receiver" id="receiver" value="" size="13"
     maxlength="13" dir="ltr" autoplete="on" type="text" height="20" minlength="3" required><br>
   <p>Message: <br>
     <textarea name="message" id="message"  type="text" value="" rows="5" cols="30" dir="ltr" required></textarea><br>
   <input value="Submit" name="button" alt="submit" onsubmit="" border="0" type="submit" align="absmiddle"></p>

 </form>
<script>
    $("#messageForm").validate();
</script>

javascript

$().ready(function () {

    $("#submit").validate({
    rules: {
        sender: {
            required: true,
            minlength: 3,
          lettersonly: true
        },
        receiver: {
            required: true,
            minlength: 3,
            lettersonly: true
        },
        message: {
          required: true,
          minlength: 5,
          maxlength: 30,
          lettersonly: true
        },
      },
     messages: {
                sender: {required:"Please enter your name"},
                receiver:{required: "Please enter receiver name up to 3 characters"},
                message: {required: "Enter your message 3-20 characters"},
          },
 });

});

when it runs on chrome gives an error on last part: Unexpected identifier

I wish to have input of only letters into a text area in form It works well with the input fields, can't validate the textarea is it possible with jquery validate ? or what is another alternative 2) will this block malicious code input (such as xss.js)

      <form action="" method="POST" enctype="multipart/form-data" name="messageForm">
  <p>name of sender: 
   <input class="input" name="sender" id="sender" value="" size="13"
     maxlength="13" dir="ltr" autoplete="on" type="text" height="20" minlength="3" required><br>
   <p>name of receiver: 
      <input class="input" name="receiver" id="receiver" value="" size="13"
     maxlength="13" dir="ltr" autoplete="on" type="text" height="20" minlength="3" required><br>
   <p>Message: <br>
     <textarea name="message" id="message"  type="text" value="" rows="5" cols="30" dir="ltr" required></textarea><br>
   <input value="Submit" name="button" alt="submit" onsubmit="" border="0" type="submit" align="absmiddle"></p>

 </form>
<script>
    $("#messageForm").validate();
</script>

javascript

$().ready(function () {

    $("#submit").validate({
    rules: {
        sender: {
            required: true,
            minlength: 3,
          lettersonly: true
        },
        receiver: {
            required: true,
            minlength: 3,
            lettersonly: true
        },
        message: {
          required: true,
          minlength: 5,
          maxlength: 30,
          lettersonly: true
        },
      },
     messages: {
                sender: {required:"Please enter your name"},
                receiver:{required: "Please enter receiver name up to 3 characters"},
                message: {required: "Enter your message 3-20 characters"},
          },
 });

});

when it runs on chrome gives an error on last part: Unexpected identifier

• javascript
• jquery
• jquery-validate
• textarea

Share Improve this question Follow edited Jul 4, 2016 at 12:24 eyalix asked Jul 4, 2016 at 10:08 eyalixeyalix 14311 gold badge33 silver badges1818 bronze badges 2

• 2 You should use $(function() { or $(document).ready(function() { as $().ready(function () { was deprecated a long time ago, and was never really good practice to begin with. – Rory McCrossan Commented Jul 4, 2016 at 10:09
• When I used $(document).ready(function() { I can't get it to apply over firefox - how so – eyalix Commented Jul 4, 2016 at 10:14

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 2

You are calling .validate() twice...

Here...

<script>
    $("#messageForm").validate();
</script>

And here...

$().ready(function () {
    $("#submit").validate({...

The .validate() method is only used to initialize the plugin on your form and cannot be called twice. All subsequent calls are always ignored.

However, in your case, it's ignored because you've attached the second instance of .validate() to $("#submit"), where your form's id is not submit and your form does not even have an id. You can only attach the .validate() method to the form you want validated, which is name="messageForm".

You simply need this...

$(document).ready(function () {

    $("[name='messageForm']").validate({
        rules: {
            sender: {
                required: true,
                minlength: 3,
                lettersonly: true
                ...

As already stated in ments, $().ready(function () {... is no longer remended. Use $(document).ready(function () {... instead.

DEMO: jsfiddle/unapufhp/

本文标签： javascriptTextarea validation with jQueryStack Overflow