Asp.net页面无刷新请求实现

时间：2023-11-23 21:13:32




Asp.net页面无刷新请求实现



<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="omAjaxSubmit.aspx.cs" Inherits="OMDemo.demo.omAjaxSubmit" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title></title>

    <script src="../operamasks-ui/jquery-1.7.1.js"></script>

    <script src="../operamasks-ui/operamasks-ui.min.js"></script>

    <link href="../operamasks-ui/themes/apusic/operamasks-ui.css" rel="stylesheet" />

    <script>

        var btnclick;

        $(document).ready(function () {

            var type;

            btnclick = function btnclick(btn) {

                var txt = $(btn).val();

                type = txt;

            }

            $('#form1').bind('submit', function (e) {

                e.preventDefault(); //阻止form默认的提交行为

                var btn = $(e);

                $(this).omAjaxSubmit(//使用ajax提交

                    {

                        data: { type: type },

                        //target: "#output"

                        target: document.body

                    }

                );

            });

        });

    </script>

</head>

<body>

    <form id="form1" runat="server">

        <div>

            <input type="text" runat="server" name="name" id="name" value=" " />

            <input type="text" runat="server" name="age" value=" " id="age" />

            <asp:Button ID="Button1" runat="server" Text="add" OnClientClick="btnclick(this)" />

            <asp:Button ID="Button2" runat="server" Text="edit" OnClientClick="btnclick(this)" />

            <asp:Button ID="Button3" runat="server" Text="del" OnClientClick="btnclick(this)" />

            <div id="output"></div>

        </div>

    </form>

</body>

</html>




后台如下：




using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

namespace OMDemo.demo

{

    public partial class omAjaxSubmit : System.Web.UI.Page

    {

        protected void Page_Load(object sender, EventArgs e)

        {

            var type = Request["type"];

            if (type == "add")

            {

                var name = Request["name"];

                var age = Request["age"];

                Response.Write("添加：" + name + age);

                Response.End();

            }

            else if (type == "edit")

            {

                //Response.Write("修改：" + name.Value + age.Value);

                name.Value = "中国宋兴柱";

                //Response.End();

            }

            else if (type == "del")

            {

                Response.Write("删除：" + name.Value + age.Value);

                //Response.End();

            }

        }

    }

}


相关文章