【问题标题】:jquery autocomplete and jquery validationjquery 自动完成和 jquery 验证
【发布时间】:2012-11-17 03:23:21
【问题描述】:

在我的 aspx 页面上,我正在尝试使用自动完成功能并验证表单是否已填写。但是,当我同时使用这两个库时,无法通过鼠标单击选择自动完成下拉列表,但可以使用箭头和输入键。有没有办法同时使用这两个包而不出现这个问题?

我从http://jqueryui.com/autocomplete/ 复制了示例并添加了验证。

    <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
            <script type="text/javascript"src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>
    <script type="text/javascript" src="<%=Url.Content("~/Scripts/jquery.validate.min.js") %>"></script>
        <script type="text/javascript">
            $(document).ready(function () {
                $('#myForm').validate();
            });

            function vaidateForm() {
                if (!$('#QAForm').valid()) return false;
                alert("IS VALID");
            };
        </script>
        <form id="myForm">
            <div id="AssignTo">
                <label for="tags" class="required">Tags: </label>
        <input id="tags" />
            </div>                            
         <input type="button"  onclick="vaidateForm()" value="Save" />
</form>






        <script type="text/javascript">
            $(function () {
                var availableTags = [
            "ActionScript",
            "AppleScript",
            "Asp",
            "BASIC",
            "C",
            "C++",
            "Clojure",
            "COBOL",
            "ColdFusion",
            "Erlang",
            "Fortran",
            "Groovy",
            "Haskell",
            "Java",
            "JavaScript",
            "Lisp",
            "Perl",
            "PHP",
            "Python",
            "Ruby",
            "Scala",
            "Scheme"
        ];
                $("#tags").autocomplete({
                    source: availableTags
                });
            });
        </script>  

【问题讨论】:

    标签: jquery asp.net-mvc jquery-ui jquery-validate jquery-autocomplete


    【解决方案1】:

    请看这里:工作演示 http://jsfiddle.net/G3Qqc/1/

    验证插件:http://docs.jquery.com/Plugins/Validation

    这应该适合你的事业:)

    代码

    $(document).ready(function(){
        $("#registerForm").validate();
    });
    
    
    $( "#tags" ).autocomplete({
        source: [ "c++", "java", "php", "coldfusion", "javascript", "asp", "ruby", "python", "c", "scala", "groovy", "haskell", "perl" ],
        delay: 0
    });
    
    ​
    

    【讨论】:

    • 这行得通!但你能告诉我具体出了什么问题吗?是我在使用 jquery 和 jquery-ui 还是我试图有一个没有提交按钮的表单....
    • @segFault 很高兴它帮助了你 :) 阅读 JQ 验证插件,参见上面演示中的 class=required 标签以及名称和 ID 标签,你会看到不同的 :) 让我知道它是怎么回事
    • 当我尝试运行您的示例时出现此错误:$("#registerForm").validate is not a function $("#registerForm").validate();
    • @segFault 你在哪里得到任何错误?希望您已将该 ID 重命名为 myform 等。`
    • 我复制并粘贴了示例代码来代替我的页面。一旦它尝试执行表示 form.validate 的 onready js 函数,我就会得到它
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-11-22
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多