dataGrid前台修改数据,不刷新页面

原创 2007年09月26日 08:43:00

#region 声明
//----------------------------------------------------------------------
//
// 修改: 李淼(Nick.Lee)
//
// dataGrid前台修改数据,不刷新页面

// 时间:2005-04-05

// boyorgril@msn.com
// QQ:16503096
//注意:引用请标明修改出处,谢谢
//----------------------------------------------------------------------
#endregion

WebForm3.aspx
<%@ Page language="c#" Codebehind="WebForm3.aspx.cs" AutoEventWireup="false" Inherits="WebApplication1.WebForm3" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
 <HEAD>
  <title>WebForm3</title>
  <meta http-equiv="content-type" content="text/html;charset=gb2312">
  <meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
  <meta name="CODE_LANGUAGE" Content="C#">
  <meta name="vs_defaultClientScript" content="JavaScript">
  <meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
  <script language="javascript" src="./GridClick.js"></script>
 </HEAD>
 <body>
  <form id="Form1" method="post" runat="server">
   <asp:DataGrid id="DataGrid1" runat="server" BorderColor="#3366CC" BorderStyle="None" BorderWidth="1px"
    BackColor="White" CellPadding="4" Font-Size="9pt" Width="100%" HorizontalAlign="Center">
    <SelectedItemStyle Font-Bold="True" ForeColor="#CCFF99" BackColor="#009999"></SelectedItemStyle>
    <ItemStyle HorizontalAlign="Center" ForeColor="#003399" BackColor="White"></ItemStyle>
    <HeaderStyle Font-Bold="True" HorizontalAlign="Center" ForeColor="#CCCCFF" BackColor="#003399"></HeaderStyle>
    <FooterStyle ForeColor="#003399" BackColor="#99CCCC"></FooterStyle>
    <PagerStyle HorizontalAlign="Left" ForeColor="#003399" BackColor="#99CCCC" Mode="NumericPages"></PagerStyle>
   </asp:DataGrid>
  </form>
 </body>
</HTML>

后台cs文件
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;

namespace WebApplication1
{
 /// <summary>
 /// WebForm3 的摘要说明。
 /// </summary>
 public class WebForm3 : System.Web.UI.Page
 {
  protected System.Data.SqlClient.SqlDataAdapter sqlDataAdapter1;
  protected System.Data.SqlClient.SqlCommand sqlSelectCommand1;
  protected System.Data.SqlClient.SqlConnection sqlConnection1;
  protected WebApplication1.DataSet1 dataSet11;
  protected System.Web.UI.WebControls.DataGrid DataGrid1;
 
  private void Page_Load(object sender, System.EventArgs e)
  {
   // 在此处放置用户代码以初始化页面
   this.sqlDataAdapter1.Fill(this.dataSet11);
   this.DataGrid1.DataSource=this.dataSet11.Tables[0];
   this.DataBind();
  }

  #region Web 窗体设计器生成的代码
  override protected void OnInit(EventArgs e)
  {
   //
   // CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。
   //
   InitializeComponent();
   base.OnInit(e);
  }
  
  /// <summary>
  /// 设计器支持所需的方法 - 不要使用代码编辑器修改
  /// 此方法的内容。
  /// </summary>
  private void InitializeComponent()
  {   
   this.sqlDataAdapter1 = new System.Data.SqlClient.SqlDataAdapter();
   this.sqlSelectCommand1 = new System.Data.SqlClient.SqlCommand();
   this.sqlConnection1 = new System.Data.SqlClient.SqlConnection();
   this.dataSet11 = new WebApplication1.DataSet1();
   ((System.ComponentModel.ISupportInitialize)(this.dataSet11)).BeginInit();
   //
   // sqlDataAdapter1
   //
   this.sqlDataAdapter1.SelectCommand = this.sqlSelectCommand1;
   this.sqlDataAdapter1.TableMappings.AddRange(new System.Data.Common.DataTableMapping[] {
                           new System.Data.Common.DataTableMapping("Table", "Categories", new System.Data.Common.DataColumnMapping[] {
                                                     new System.Data.Common.DataColumnMapping("CategoryID", "CategoryID"),
                                                     new System.Data.Common.DataColumnMapping("CategoryName", "CategoryName"),
                                                     new System.Data.Common.DataColumnMapping("Description", "Description"),
                                                     new System.Data.Common.DataColumnMapping("Picture", "Picture")})});
   //
   // sqlSelectCommand1
   //
   this.sqlSelectCommand1.CommandText = "SELECT TOP 10 CategoryID, CategoryName, Description, Picture FROM Categories";
   this.sqlSelectCommand1.Connection = this.sqlConnection1;
   //
   // sqlConnection1
   //
   this.sqlConnection1.ConnectionString = "workstation id=/"STAR-NICK/";packet size=4096;user id=sa;data source=/"(local)/";pers" +
    "ist security info=False;initial catalog=Northwind;pwd=sa";
   //
   // dataSet11
   //
   this.dataSet11.DataSetName = "DataSet1";
   this.dataSet11.Locale = new System.Globalization.CultureInfo("zh-CN");
   this.DataGrid1.ItemDataBound += new System.Web.UI.WebControls.DataGridItemEventHandler(this.DataGrid1_ItemDataBound);
   this.Load += new System.EventHandler(this.Page_Load);
   ((System.ComponentModel.ISupportInitialize)(this.dataSet11)).EndInit();

  }
  #endregion

  private void DataGrid1_ItemDataBound(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e)
  {
   if(e.Item.ItemType==ListItemType.AlternatingItem|e.Item.ItemType==ListItemType.Item)
   {
    for(int i=0;i<e.Item.Cells.Count;i++)
    {
     e.Item.Cells[i].Attributes["onClick"]="editCell(this);";
    }
   }
  }
 }
}

脚本文件:
/**
 * <p>Title: datagrid点击编辑(不刷新页面)</p>
 * <p>Description: 实现datagrid点击编辑(不刷新页面)</p>
 * <p>Copyright: 2005-2005 by mail_ricklee Corporation</p>
 * <p>Company: mail_ricklee Corporation</p>
 * <p>CreateTime: 2005-04-05 11:30</p>
 * <p>ModifyTime:                 </p>
 * @CreateAuthor 李淼    * @version 1.0
 * @ModifyAuthor         * @version 1.0
 */
function editCell (cell) {
if (document.all) {
 cell.innerHTML = '<INPUT ID="editCell" ONCLICK="event.cancelBubble = true;" ONCHANGE="setCell(this.parentElement, this.value)" ONBLUR="setCell(this.parentElement, this.value)" VALUE="' + cell.innerText + '" SIZE="' + cell.innerText.length + '">';
 document.all.editCell.focus();
 document.all.editCell.select();
 }
else if (document.getElementById) {
 cell.normalize();
 var input = document.createElement('INPUT');
 input.setAttribute('value', cell.firstChild.nodeValue);
 input.setAttribute('size', cell.firstChild.nodeValue.length);
 input.onchange = function (evt) { setCell(this.parentNode, this.value); };
 input.onclick = function (evt) {
 evt.cancelBubble = true;
 if (evt.stopPropagation)
        evt.stopPropagation();
 };
cell.replaceChild(input, cell.firstChild);
input.focus();
input.select();
}
}

function setCell (cell, value) {
if (document.all)
cell.innerText = value;
else if (document.getElementById)
cell.replaceChild(document.createTextNode(value), cell.firstChild);
/*
if(confirm('确认修改?')==false)
{
    location.reload();
}
else
{
if (document.all)
cell.innerText = value;
else if (document.getElementById)
cell.replaceChild(document.createTextNode(value), cell.firstChild);
}
*/
}

 

easyui datagrid使用数据刷新

加载相关js和css,因为easyui依赖jquery,所有加载easyui前要先加载jquery,否则为提示找不到datagrid     Html代码          ...
  • waysoflife
  • waysoflife
  • 2014年06月10日 17:03
  • 16301

85-002-17 用EasyUI中的组件DataGrid实现页面的数据表格显示

图文版:http://note.youdao.com/yws/public/redirect/share?id=abc20790e48da5130e227d9390e4df92&type=false ...
  • jizhu4873
  • jizhu4873
  • 2016年06月29日 14:06
  • 5207

easyui datagrid 数据库日期格式数据在前台显示

在利用datagrid展示后台数据库数据的过程中,会发现,日期数据无法正常显示,而是显示一连串的数字。在controller层debug调试时显示数据为Date型数据,应该是在页面无法读取,导致页面显...
  • gengyazhou123
  • gengyazhou123
  • 2016年09月18日 15:53
  • 2697

easyUI datagrid删除行数据bug 解决办法

当使用批量删除的时候 会出现这种问题,明明已经删除了的那条数据,在后台跟踪代码的时候会发现id还是会传过去,原因就在于,选中多行进行提交时删除后,还有id还在缓存中; 解决办法在每次执行删除后,手动对...
  • woshishui6501
  • woshishui6501
  • 2013年07月29日 19:26
  • 9771

JSP页面刷新与参数传递的几种方法

SpringMVC框架中,JSP页面刷新主要用到3种方法: 方法1.最简单的用跳转 方法2.用AJAX异步刷新页面(画面部分刷新) 方法3.提交Form表单并刷新页面(画面全部刷新) 以下是例子: ...
  • sunroyi666
  • sunroyi666
  • 2016年08月04日 10:53
  • 2216

js实现EasyUI-datagrid前台分页

牛腩新闻发布系统中讲到过两种分页的方式:真分页与假分页       这两种分页方式是怎么回事呢?所谓真分页就是从数据库中查询出需要展示的条数,比如10条,下次我再要展示25条的时候它再次访问数据库,...
  • lxy344x
  • lxy344x
  • 2015年08月12日 22:39
  • 3570

前台dataGrid表单数据传递到后台

最近在做基于SSH的WEB开发,前两天在
  • u010810431
  • u010810431
  • 2014年11月05日 22:11
  • 5738

Ajax对表格中的信息不刷新页面进行更新数据

html: Title 1111 ...
  • Grit_ICPC
  • Grit_ICPC
  • 2016年11月05日 17:18
  • 3040

《EasyUI + MVC + EF +WCF》——实现对Datagrid中数据的批量修改或保存

这两天在干组织部项目的时候,用到了EasyUI的可编辑表格,这时候用户在保存,修改信息的时候变得方便多了,因为这样可以直接在表格中更改数据,不用再选中数据后然后点击编辑,最后弹出一个部分视图来,将待修...
  • u013067402
  • u013067402
  • 2016年03月01日 10:23
  • 1537

EasyUI 之 dataGrid前台状态值转换

$('#dg').datagrid({ columns:[[ {field:'id', hidden:true}, {field:'questionContent'...
  • u010786678
  • u010786678
  • 2016年06月27日 22:39
  • 921
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:dataGrid前台修改数据,不刷新页面
举报原因:
原因补充:

(最多只允许输入30个字)