Ext 2.0如何给GridPanel加上ASPX --- GridView一样的模板列

Ext 2.0如何给GridPanel加上ASPX --- GridView一样的模板列2011-10-29 博客园 Annie我做的是一个添加删除按钮的例子，先看一下效果。

代码：

代码操作数据库那部分没有写，在下面的代码有标明。

 1<！DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2<html xmlns="http://www.w3.org/1999/xhtml"> 3<head> 4    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5    <title>Example</title> 6    <link rel="stylesheet" type="text/css" href="../ext/resources/css/ext-all.css" /> 7    <script type="text/javascript" src="../ext/adapter/ext/ext-base.js"></script> 8    <script type="text/javascript" src="../ext/ext-all.js"></script> 9    <script type="text/javascript">Ext.BLANK_IMAGE_URL = "../exthttp://www.bianceng.cn/default/s.gif";</script>1011<script language="javascript" type="text/javascript">1213    var store = new Ext.data.SimpleStore（{14                //调用后台代码，获取数据 15                fields: [16                        "ID",17                        "Name"18                        ],19                 }）;20    store.load（）;2122    //创建Grid23    var grid = new Ext.grid.GridPanel（{24            el: "exampleContainer",25            autoHeight: true,26            store: store,27            disableSelection: false,28            loadMask: true,29            deferRowRender: false,30            cm: new Ext.grid.ColumnModel（[            31               {32                header: "Name",33                dataIndex: "Name",34                sortable: true,35                renderer: encodeHtml36                }, {header: "",37                dataIndex: "ID",38                renderer:AddButtonDel//调用函数，新建Delete Button 按钮39                }  40                ]）,41            viewConfig: {42                forceFit: true43            } 44        }）;4546    //加上Delete按钮在Grid的每一行47    //String.format（""） , ""里可以加上你想要的任何模板列 48    //Eg: String.format（"<b><a href="http://www.cnblogs.com" target="_blank">Delete</a></b>"）;49    function AddButtonDel（id）{50        return String.format（51                "<input id="btnDelete" style="background-image: url（../Img/delete.gif）; width: 22px; height: 22px" type="button" title="Delete" onclick="return DeleteClick（"+id+"）" />"52                ）;53    }5455    //删除函数56    function DeleteClick（id）57    {58        Ext.Msg.confirm（"Warning", "Are you sure delete this item？",59            function（btn, text,s）{60                if （btn == "yes"）{61                    var params = id;6263                    wrappedSBar.StatusBar.showBusy（"Deleting"）;64                   //调用后台代码删除数据65                }66       }）;67    }68    69    Ext.onReady（function（）{70        Ext.QuickTips.init（）;71        grid.render（）;72    }）;73</script>74</head>75<body>76<div id="exampleContainer"></div>77</body>78</html>