amazeui表单form异步提交方法

最新推荐文章于 2025-07-13 15:44:45 发布

weixin_30477797

最新推荐文章于 2025-07-13 15:44:45 发布

阅读量425

点赞数

CC 4.0 BY-SA版权

文章标签： json

原文链接：http://www.cnblogs.com/shark1100913/p/9468062.html

本文介绍了一个使用jQuery Validator插件实现的表单验证及提交功能案例。该案例通过前端JavaScript进行表单验证，确保所有必填字段不为空，并在验证通过后使用POST方法提交数据到服务器。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

// 留言提交
        $(function() {
            var $form = $('#ue-form');
            $form.validator({
                validateOnSubmit: true,
                submit: function() {alert(1)
                    if(this.isFormValid()) {
                        $.post(
                            "{:url('index/msg')}",
                            $("input[type=\'text\'],input[type='email'],select"),
                            function(d){
                                console.log(d);
                            }
                            , "json");
                    }
                    return false;
                }
            });
        })

<form id="ue-form" class="am-form">
            <fieldset>
                <input type="hidden" value="0">
                <div class="t_box">
                    <div class="am-form-group">
                        <input type="text" placeholder="名*" name="ming" class="am-form-field"
                               required="名字不能为空">

                    </div>
                    <div class="am-form-group">
                        <input type="text" placeholder="姓*" name="xing" class="am-form-field"
                               required="">
                    </div>
                </div>
                <div class="am-form-group">
                    <input type="email" placeholder="电子邮箱*" name="email" required="">
                </div>

                <div class="am-form-group">
                    <input type="text" placeholder="公司名称*" name="company" class="am-form-field"
                           required="">
                </div>
                <div class="t_box">
                    <div class="am-form-group">
                        <input type="text" placeholder="职务*" name="job" class="am-form-field"
                               required="">

                    </div>
                    <div class="am-form-group">
                        <select name="county_id" class="am-form-field">
                            <option value="">国家</option>
                            {volist name="country" id="c"}
                            <option value="{$c.id}">{$c.name}</option>
                            {/volist}
                        </select>
                    </div>
                </div>
                <div class="am-form-group">
                    <input type="text" placeholder="备注" name="beizhu" class="am-form-field">
                </div>
                <div class="t_bitian">
                    *必填内容
                </div>
                <button class="btn" type="submit">提交</button>
            </fieldset>
        </form>