码迷,mamicode.com
首页 > Web开发 > 详细

jquery.form.js 让表单提交更优雅

时间:2019-01-15 17:10:39      阅读:199      评论:0      收藏:0      [点我收藏+]

标签:类型   attr   orm   9.1   ajaxform   _id   不刷新   for   使用   

jquery.form.js 让表单提交更优雅。可以页面不刷新提交表单,比jQuery的ajax提交要功能强大。
1.引入

<script src="/src/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="/src/jquery.form.js"></script>

2.使用

$(function () {
        var E = window.wangEditor;
        var content_editor = new E(‘#content_editor‘);
        content_editor.create();
        var content_val = $("#content").val();
        // 设置内容
        content_editor.txt.html(content_val);

        var answer_editor = new E(‘#answer_editor‘);
        answer_editor.create();
        var answer_val = $("#answer").val();
        // 设置内容
        answer_editor.txt.html(answer_val);

        $("#cancel_btn").on(‘click‘,function () {
            window.location.href = ‘index‘;
        });

        // 只是准备工作,需要表单提交才触发
        $("#edit_form").ajaxForm({
            dataType: "json",
            success : function(res){
                if(res.errno == 0){
                    alert(‘已保存‘);
                    window.location.href = ‘index‘;
                }else{
                    alert(res.errdesc);
                }
                return false;
            }
        });

        // 提交按钮点击
        $("#edit_btn").on("click", function(){
            // 获取并判断各个值是否填写并正确
            var id   = $("#id").val();
            var title =$("#title").val();
            // 获取内容
            var content = content_editor.txt.html();
            var answer = answer_editor.txt.html();
            var question_type_id = $("#question_type_id").val();
            if(!title){
                alert(‘标题不能为空‘);
                return;
            }
            if (!content && !answer) {
                alert(‘内容和答案不能全为空‘);
                return;
            }
            if(!question_type_id){
                alert(‘类型不能为空‘);
                return;
            }

            // 设置新内容
            $(‘#content‘).val(content);
            $(‘#answer‘).val(answer);

            // 表单触发submit事件
            $("#edit_form").submit();
            return false;
        });

});

jquery.form.js 让表单提交更优雅

标签:类型   attr   orm   9.1   ajaxform   _id   不刷新   for   使用   

原文地址:https://www.cnblogs.com/wordblog/p/10272398.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!