zoukankan      html  css  js  c++  java
  • ajax表单提交

    HTML代码:

    <form id="formCity" action="/SiteMap/Search" method="get" onsubmit="return false">
        <div class="form-group">
            <div style="padding: 0; line-height: 30px; float: left; font-size: 16px; ">
                快速查找:
            </div>
            <div class="col-md-3">
                <input id="city_search" name="search" class="form-control" data-provide="typeahead" type="text" value="" required />
            </div>
        </div>
        <input class="btn btn_main_sm" value="搜索" type="submit" onclick="findCity('formCity')">
    </form>

    Js代码:

    <script type="text/javascript" src="/Resource/Scripts/jquery.validate.js"></script>
    <script type="text/javascript" src="/Resource/Scripts/jquery.validate.Extend.js"></script>
    <script type="text/javascript">
        function findCity(formId) {
            var form = $("#" + formId);
            var valid = form.valid();
            var method = form.attr("method");
            var action = form.attr("action");
            var btnSubmit = form.find("[type=submit]");
            var btnText = btnSubmit.val();
            if (valid) {
                $.ajax({
                    type: method,
                    url: action,
                    beforeSend: function () {
                        btnSubmit.addClass('disabled').text("正在查询...");
                    },
                    data: form.serialize(),
                    success: function (data) {
                        if (data.IsSuccess) {
                            location.href = data.Message;
                        }
                        else {
                            alert(data.Message);
                        }
                        btnSubmit.removeClass("disabled").text(btnText);
                    }
                   , error: function (XMLHttpRequest, textStatus, errorThrown) {
                       alert("NetworkError:" + XMLHttpRequest.status + " " + XMLHttpRequest.statusText)
                       btnSubmit.removeClass("disabled").text(btnText);
                   }
                })
            }
    
        }
  • 相关阅读:
    Step by Step To Create a K8S Cluster
    Linux简单操作指令
    安装redis 最新版 redis-6.2.6
    GCC升级到11.2.0
    SQL开窗函数
    SQL 树形结构递归查询
    一文详解python的类方法,普通方法和静态方法
    _new_()与_init_()的区别
    关于Python的import机制原理
    【原创】android内存管理-hprof文件
  • 原文地址:https://www.cnblogs.com/genesis/p/5775486.html
Copyright © 2011-2022 走看看