相关疑难解决方法(0)

使用Bootstrap进行表单验证(jQuery)

有人可以帮我这个代码吗？我正在使用表单的bootstrap并尝试使用jQuery验证它.不幸的是,表单验证并没有告诉我我做错了什么.我从http://jqueryvalidation.org/documentation/获得了脚本,并遵循了客户端验证的教程.

<!DOCTYPE html>

<html>
<head>
        <meta charset="utf=8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="js/jquery.validate.min.js"></script> //Script found online

        <script>
            $(document).ready(function(){

             $('#contact-form').validate(
             {
              rules: {
                name: {
                  minlength: 2,
                  required: true
                },
                email: {
                  required: true,
                  email: true
                },
                message: {
                  minlength: 2,
                  required: true
                }
              },
              highlight: function(element) {
                $(element).closest('.control-group').removeClass('success').addClass('error');
              },
              success: function(element) {
                element
                .text('OK!').addClass('valid')
                .closest('.control-group').removeClass('error').addClass('success');
              }
             });
            }); // end document.ready
        </script>

    </head>

    <div class="hero-unit">  
        <h1>Contact Form</h1> </br>

    <form method="POST" action="contact-form-submission.php" class="form-horizontal" id="contact-form">  
        <div class="control-group">  
            <label class="control-label" for="name">Name</label> …

Run Code Online (Sandbox Code Playgroud)

javascript forms validation jquery twitter-bootstrap

use*_*351

2016 08-23

27
推荐指数

2
解决办法

33万
查看次数

内联表单 Bootstrap 不起作用

我不明白为什么这不起作用。我试图将这两个表单元素并排放置。此外，我希望能够并排放置一些元素，并将一些元素以相同的形式排列在下方（因为将来的元素将位于这两个下方）。由于我使用的是 Struts 1，因此我忽略了 role="form"，这破坏了<html:form>标签。

<form name="someForm" method="post" action="/someAction.do" class="form-inline">

<div class="form-group">
    <div>
        <label for="startDate" >                
            From                
        </label>            
        <input type="text" name="startDate" value="" readonly="readonly" id="startDate" style="width: 70px;" class="datepicker form-control">
    </div>          
</div>
<div class="form-group">
    <div>           
        <label for="endDate">               
            To              
        </label>            
        <input type="text" name="endDate" value="" readonly="readonly" id="endDate" style="width: 70px;" class="datepicker form-control">
    </div>
</div>

Run Code Online (Sandbox Code Playgroud)

在此处输入图片说明