asp_异步列表的增删查改

最新推荐文章于 2021-08-05 20:50:44 发布
最新推荐文章于 2021-08-05 20:50:44 发布
阅读量778 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u010909858/article/details/17096381
版权

UserList.html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!--html是静态页面，不能执行C#代码，则不能用<% %>来执行C#代码，若想执行，则是用JQuery-->
    <title></title>
    <link rel="stylesheet" type="text/css" href="../css/tableStyle.css" />
    <script src="../js/jquery-1.7.1.js" type="text/javascript"></script>


   
    <!--主题引用-->
    <link href="../js/jquery-easyui-1.3.1/themes/default/easyui.css" rel="stylesheet"
        type="text/css" />
    <!-- 图标引用-->
    <link href="../js/jquery-easyui-1.3.1/themes/icon.css" rel="stylesheet" type="text/css" />
   <!-- 一下三条jquary顺序不能颠倒-->
    <script src="../js/jquery-easyui-1.3.1/jquery-1.8.0.min.js" type="text/javascript"></script>
    <script src="../js/jquery-easyui-1.3.1/jquery.easyui.min.js" type="text/javascript"></script>
    <script src="../js/jquery-easyui-1.3.1/locale/easyui-lang-zh_CN.js" type="text/javascript"></script>


    <script src="../js/datapattern.js" type="text/javascript"></script><!--日期转换-->
    <script type="text/javascript">
        $(function () {


            initTableList();
            //            (eval(value.replace(/\/Date\((\d+)\)\//gi, "new Date($1)"))).pattern("yyyy-M-d h:m:s.S");
            $("#showDetail").css("display", "none");
            $("#editDiv").css("display", "none");
            $("#addDiv").css("display", "none");
        });
            //提交添加新闻表单到后台
            function subAddFrom() {
                //把整个表单序列化成JSON  ARRAY
                var formData = $("#frmAdd").serializeArray();
                var sendData = { txtTitle: $("#txtTitle").val(), txtPeople: $("#txtPeople").val() };
                //表单提交
                //                $.post("Add.ashx", formData, function (data) {
                //                    if (data == "OK") {
                //                        //关闭对话框刷新列表
                //                        $("#addDiv").dialog("close");
                //                        //刷新表格
                //                        initTableList();


                //                    }
                //                });


                //$.get
                //$.post
                //$.getJSON
                $.ajax({
                    url: "Add.ashx",
                    type: "POST",
                    data: fromData,
                    async: true, //true时为异步请求，默认是true
                    cache: false, //解决缓存问题
                    success: function (data) {
                        if (data == "OK") {
                            //关闭对话框刷新列表
                            $("#addDiv").dialog("close");
                            //刷新表格
                            initTableList();
                        }
                        else {
                            alert(data);
                        }
                    }
                });
            }
            function BindAddEvent(){
            $("#btnAdd").click(function () {
                $("#addDiv").css("display", "block");
                $("#addDiv").dialog({
                    title: "对话框",
                    model: true,
                    width: 300,
                    height: 300,
                    collapsible: true,
                    minimizable: true,
                    maxmizable: true,
                    resizable: true,
                    button: [{
                        text: "添加",
                        id: 'btnAdd',
                        iconCls: 'icon-add',
                        handler: function () {
                            subAddFrom
                            //                            //把整个表单序列化成JSON  ARRAY
                            //                            var temp = $("#frmAdd").serializeArray();
                            //                            var temp2 = { txtTitle: $("#txtTitle").val(), txtPeople: $("#txtPeople").val() };
                            //                            //表单提交
                            //                            $.post("AddMain.ashx", temp, function () {


                            //                            });
                        }
                    }, {
                        text: "关闭",
                        id: 'btnClose',
                        iconCls: 'icon-cancel', //图标
                        handler: function () {//按钮被点击时  执行此方法
                            $("#addDiv").dialog("close");
                        }
                    }]
                });
            });
        
        }
        function initTableList() {
            $.getJSON("LoadAllNews.ashx", {}, function (data) {


                $("#tbData").html("");
                for (var key in data) {//加载表格的数据
                    var main = data[key];
                    $("#tbData").append("<tr><td>" + main.ID + "</td><td>" + main.title + "</td><td>" + (eval(main.Date.replace(/\/Date\((\d+)\)\//gi, "new Date($1)"))).pattern("yyyy-M-d h:m:s.S") + "</td><td><a href='#' class='detail' nId='" + mian.ID + "'>详情</a>&nbsp;&nbsp;<a class='editLink' href='javascript:void(0)' uId='" + main.ID + "'>修改</a>&nbsp;&nbsp;<a class='deleteLink' href='#'>删除</a></td></tr>");
               
                bindDetailEvent();
                bindDeleteEvent();
                BindAddEvent();
                bindEditEvent();
               
        }
         });
        function bindEditEvent()
        {
            $(".editLink").click(function () { 
            var id=$(this).attr("uId");
            //弹出对话框之前，对文本赋值
            $.ajax({
              url:"GetNewsById.ashx",
              data:{newId:id},
              type:"Post",
              dataType:"json",
              success:function(data){
                 var editId=data.ID;
                 $("#hidId").val(editId);
                 var title=data.title;
                 $("#txtEditTitle").val(title);
                 var people=data.people;
                  $("#txtEditPeople").val(people);
              }
            });
                //弹出一个修改的对话框});
                $("#editDiv").css("display","block");
                  $("#editDiv").dialog({
                    title: "对话框",
                    model: true,
                    width: 300,
                    height: 300,
                    collapsible: true,
                    minimizable: true,
                    maxmizable: true,
                    resizable: true,
                    button: [{
                        text: "修改",
                        id: 'btnEdit',
                        iconCls: 'icon-add',
                        handler: function () {
                            subEditFrom
                            //                            //把整个表单序列化成JSON  ARRAY
                            //                            var temp = $("#frmAdd").serializeArray();
                            //                            var temp2 = { txtTitle: $("#txtTitle").val(), txtPeople: $("#txtPeople").val() };
                            //                            //表单提交
                            //                            $.post("AddMain.ashx", temp, function () {


                            //                            });
                        }
                    }, {
                        text: "关闭",
                        id: 'btnClose',
                        iconCls: 'icon-cancel', //图标
                        handler: function () {//按钮被点击时  执行此方法
                            $("#editDiv").dialog("close");
                        }
                    }]
                });
            });
        }
         //提交修改的表单
         function subEditFrom(){
           //将修改的表单提交到后台
           var editFrmData=$("#editFrm").serializeArray();
           $.post("Edit.ashx",editFrmData,function(data){
              if(data=="OK")
              {
                   //如果后台返回成功
           //关闭对话框
            $("#editDiv").dialog("close");
           //刷新列表
           initTableList();
              }
              else
              {
                 alert(data);
              }
           });
          
         }


        function bindDetailEvent() {
            //详情的点击事件，必须在加载完成之后
            $(".detail").click(function () {
                //通过当前的ID把数据再查一遍
                $.getJSON("GetNewsById.ashx", { id: $(this).attr("nId") }, function () {
                    $("#title").text(data.title);
                    $("#people").text(data.people);
                    $("#Date").text(data.Date);
                    $("#content").text(data.content);
                });
                //弹出对话框
                //先隐藏一个div
                $("#showDetail").css("display", "block");
                $("#showDetail").dialog({
                    title: "对话框",
                    model: true,
                    width: 300,
                    height: 300,
                    collapsible: true,
                    minimizable: true,
                    maxmizable: true,
                    resizable: true,
                    button: [{
                        text: "确定",
                        id: 'btnOK',
                        iconCls: 'icon-add',
                        handler: function () {
                            alert("确定被点击了");
                        }
                    }, {
                        text: "关闭",
                        id: 'btnClose',
                        iconCls: 'icon-cancel', //图标
                        handler: function () {//按钮被点击时  执行此方法
                            alert("取消被点击了");
                        }
                    }]
                });
        


        function bindDeleteEvent() {
        //删除方法1
//            $("#tbData a:contains('删除')").click(function () {
//                if (confirm("您会删除吗")) {
//                    //发送异步请求，把Id发送到后台，后台删除这条数据
//                    //删除成功之后
//                    $(this).parent().hide(2000); // $(this).parent().hide("slow").remove();
//                }
//            });
     //删除方法2：
        $(".deleteLink").click(function(){
          var id=$(this).attr("uId");
          var trDom=$(this).parent().parent();
//        $.messager.alert("提醒消息","提醒的内容");
            $.messager.confirm("提醒的消息","您会删除吗？",function(r){
              if (r){
                 $.get("Delete.ashx",{id:id},function(data){
                      if (data=="ok")
                      {
                      trDom.hide(1500);
                      }
                      else
                      {
                         $.messager.alert("提醒消息标题","删除败了");
                      }
                 });
              }
            });
        });
        }
    </script>
</head>
<body>
  <a id="btnAdd" href="javascript:void(0)">添加</a>
<!--表格数据的 开始-->
   <table>
   <thead>
      <tr>
        <th>编号</th>
         <th>新闻标题</th>
          <th>新闻发布时间</th>
           <th>操作</th>
      </tr>
      </thead>
      <tbody id="tbData">
         <tr>
          
         </tr>
      </tbody>
   </table>
   <!--表格数据的结束-->




   <!--弹出的详情对话框-->
   <div id="showDetail">
     <h3>我是弹出来的对话框</h3>
     <table>
       <tr>
         <td>新闻标题</td><td><span id="title"></span></td>
       </tr>
       <tr>
         <td>新闻发布人</td><td><span id="people"></span></td>
       </tr>
       <tr>
         <td>新闻发布时间</td><td><span id="Date"></span></td>
       </tr>
       <tr>
         <td>新闻内容</td><td><span id="content"></span></td>
       </tr>
     </table>
   </div>
   <!--弹出的详情对话框的结束-->


   <!--弹出的添加对话框开始-->
       <div id="addDiv">
     <h3>我是弹出来的对话框</h3>
     <form id="frmAdd">
     <table>
       <tr>
         <td>新闻标题</td><td><input type="text" name="txtTitle" id="txtTitle"/></td>
       </tr>
       <tr>
         <td>新闻发布人</td><td><input type="text" name="txtPeople" id="txtPeople"/></td>
       </tr>
       
     </table>
     </form>
   </div>
    <!--弹出的添加对话框结束-->


    
   <!--弹出的修改对话框开始-->
       <div id="editDiv">
     <h3>修改的表单</h3>
     <form id="editFrm">
     <input type="hidden" value="" id="hidId" name="hidId"/>
     <table>
       <tr>
         <td>新闻标题</td><td><input type="text" name="txtEditTitle" id="txtEditTitle"/></td>
       </tr>
       <tr>
         <td>新闻发布人</td><td><input type="text" name="txtEditPeople" id="txtEditPeople"/></td>
       </tr>
       
     </table>
     </form>
   </div>
    <!--弹出的修改对话框结束-->
</body>
</html>

jodie_wwz
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
简单的ASP MVC 5增删查改练习 源码
09-23
在这个“简单的ASP MVC 5增删查改练习”中，我们可以学习到如何在MVC架构下实现基本的数据操作功能。 **模型（Model）** 模型是业务逻辑和数据的载体。在这个练习中，模型通常包含一个或多个类，这些类对应于数据库...
C# ajax增删查改
12-18
在这个主题中，“C# ajax增删查改”指的是使用C#后端语言和AJAX前端技术来实现对数据库中的数据进行添加、删除、查询和修改的操作。下面我们将详细探讨这一知识点。 首先，C#通常与ASP.NET框架一起使用，创建服务器...
asp_异步增删查改（3）
u010909858的专栏
12-03 422
GetNewsById.ashx:  public void ProcessRequest(HttpContext context)         {             context.Response.ContentType = "text/plain";             int id = int.Parse(context.Request["id"]??"0");  
asp_异步增删查改（2）
u010909858的专栏
12-03 458
LoadAllNews.ashx:   public void ProcessRequest(HttpContext context)         {             context.Response.ContentType = "text/plain";             BLL.HKSJ_Main mainServer = new BLL.HKSJ_Main();
异步通讯（js-asp/asp-asp）
asp、.net专栏
05-30 1719
http协议传输post/getjavascript----aspvar Http = new ActiveXObject("Microsoft.XMLHTTP") ;Http.open ("GET","http://10.1.9.157/login.asp?username=" + username + "&passwd=" + passwd ,false);Http.send() ;str
实现异步页面的两种用法
Tang
09-19 4680
ASP.NET页面会被HTTP处理程序作为Page类的实例处理。每个请求会占用ASP.NET线程池中的一个线程，在请求完毕后该线程才会被释放。如果被请求的页面频繁地启动外部的、高耗时的任务时，经常会出现ASP.NET进程闲置，但池中没有空闲的线程来处理新入的其他页面的请求。这种情况下，创建异面页面可以减轻这个问题。     异步ASP.NET页面的构建涉及两个方面： @Page指令的一个新属性A
asp ajax更新数据,ASP实战一实现AJAX异步刷新
weixin_39878989的博客
08-05 419
1.客户端请求的代码：var XMLHttpReq;//分为两种情况进行创建xmlhttp对象function createXMLHttpRequest() {if(window.XMLHttpRequest) { //Mozilla 浏览器XMLHttpReq = new XMLHttpRequest();}else if (window.ActiveXObject) { // IE浏览器try...
S2北大青鸟结业考试题 .net包含数据库 外加增删查改 异步操作等
03-03
在"S2北大青鸟结业考试题 .NET包含数据库 外加增删查改 异步操作等"中，我们可以推断这是一份针对.NET开发者的学习或考核资料，涵盖了数据库操作、CRUD（Create, Read, Update, Delete）基本操作以及异步编程等多个...
GridView增删查改
11-08
本教程主要围绕"GridView增删查改"这一主题，介绍如何利用GridView实现对数据的CRUD（Create、Read、Update、Delete）操作，同时结合分页功能和3层架构技术，为初学者提供实践指导。 1. GridView的基本使用 - ...
asp异步刷新最好的例子
11-12
asp的异步刷新，里面有get 和post的方法，有后台数据库的调用，初学的好好看看这个。
基于ASP编程实现数据库的增删改查
07-10
管理员可以通过ASP页面对数据库执行增（Add）、删（Delete）、改（Modify）和查（Query）操作。这通常涉及到SQL语句的编写和执行，如INSERT用于新增记录，DELETE用于删除记录，UPDATE用于修改记录，以及SELECT用于...
ajax实现异步查询记录与分页
07-31 321
前端代码 <script type="text/javascript" src="js/jquery-3.3.1.js"></script> <script type="text/javascript"> var Allcount=0; var allNum=0; var ALLPAGE=0; function query(begin, num){ $...
使用XmlHttp结合ASP实现网页的异步调用
ξσ Dicky's Blog σξ
03-16 1645
通过xmlHttp和ASP的结合，我们可以轻松完成网页的异步调用。代码如下：1.新建Display.asp(这是前台显示页面)注意xmlhttp.readyState的4个属性1:LOADING;2:LOADED;3:INTERACTIVE;4:COMPLETEDxmlhttp = new ActiveXObject("Msxml2.XMLHTTP");function fnDo(ID){    
1203GMT-VB一种N-Channel沟道DFN8(5X6)封装MOS管
07-20
1203GMT-VB；Package：DFN8(5X6)；Configuration：Single-N-Channel；VDS：30V；VGS：20（±V）；Vth：1.7V；RDS(ON)=9mΩ@VGS=4.5V；RDS(ON)=7mΩ@VGS=10V；ID：80A；Technology：Trench；
Solid Edge 2024是顶级的3D建模程序，用于生成、建模和规划出色的3D模型
最新发布
07-20
注意：文件为BT文件。Solid Edge 2024是顶级的3D建模程序，用于生成、建模和规划出色的3D模型。它是一个可靠的工具，使用户能够在流畅的工作环境中创建各种复杂和详细的设计，并非常注重细节。它是一套全面且功能齐全的工具集，为专业人士提供了他们进行高效建模和零件制造所需的所有详细信息。这个优秀的应用程序允许你进行快速、灵活的设计修改，强大的组件管理，以及轻松整合多CAD数据。它还提供改进的结构和热模拟，包括快速热移动。此外，它可以直接用于复杂组件的布局，如电线、梁、传输线等项目。它允许专业人士在同一个协作设计平台上处理并发和传统的结构组件。你也可以下载Altair SimSolid 2024。
asp.net webapi增删查改sql
03-16
ASP.NET WebAPI 是一种用于构建 RESTful Web 服务的框架，可以通过 HTTP 协议对数据进行增删查改操作。而 SQL 则是一种关系型数据库管理系统，可以用于存储和管理数据。 在 ASP.NET WebAPI 中，可以通过 HTTP 请求...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值