这是网上找的extjs3.4的代码(可以运行),需要做哪些更改升级为4.2的,谢谢大神们。学习当中

Ext.onReady(function () {
Ext.QuickTips.init(); //HtmlEditor需要这个,不加,编辑时不提示
var sm = new Ext.grid.CheckboxSelectionModel({ handleMouseDown: Ext.emptyFn });
var cm = new Ext.grid.ColumnModel([
new Ext.grid.RowNumberer(), //显示行号
sm,
{ header: '编号', dataIndex: 'ID', sortable: true },
{ header: '姓名', dataIndex: 'Names' },
{ header: '时间', dataIndex: 'Date', renderer: Ext.util.Format.dateRenderer('Y-m-d') },
{ header: '描述', dataIndex: 'Descn' }
]);

//创建数据源
var store = new Ext.data.Store({
    proxy: new Ext.data.HttpProxy({ url: '1' }),
    reader: new Ext.data.JsonReader({
        totalProperty: 'totalCount',
        root: 'roots'
    },
    [
      { name: "ID" },
      { name: "Names" },
      {
          name: "Date", dateFormat: 'Y-m-d', convert: function (v) {
              if (v == null) {
                  return null;
              }
              var d = new Date();
              var str = v.toString();
              var str1 = str.replace("/Date(", "");
              var str2 = str1.replace(")/", "");
              var dd = parseInt(str2);
              d.setTime(dd);
              return d;
          }
      },
      { name: "Descn" }
    ])

});
//加载数据
store.load({ params: { start: 0, limit: 5 } });

//创建form表单
var frm = new Ext.form.FormPanel({
    id: "frmDemo",
    frame: true,
    lableWidth: 75,
    lableAlign: "right",
    items: [
      { xtype: "hidden", id: "types" },
      { xtype: "numberfield", fieldLabel: "编号", id: "id", allowNegative: false, allowBlank: false, blankText: "请输入有效的整数" },
      { xtype: "textfield", fieldLabel: "姓名", id: "name" },
      { xtype: "datefield", fieldLabel: "日期", id: "date", format: "Y-m-d" },
      { xtype: "textfield", fieldLabel: "描述", id: "descn" }
    ]
});

//创建窗体
var window = new Ext.Window({
    title: '基本信息',
    width: 400,
    height: 300,
    minWidth: 300,
    minHeight: 200,
    closeAction: 'hide',
    modal: true, //弹窗遮层
    plain: true,    //与背景色保持协调
    bodyStyle: 'padding:5px;',
    buttonAlign: 'center',
    items: frm,     //添加内容
    buttons: [
  {
      text: '提交', handler: function () {
          var types = Ext.getCmp("types").getValue();
          var id = Ext.getCmp("id").getValue();
          var name = Ext.getCmp("name").getValue();
          var date = Ext.getCmp("date").getValue();
          var descn = Ext.getCmp("descn").getValue();
          if (types == "add") {
              if (id.lenght < 1 || name.lenght < 1 || date.lenght < 1 || descn.lenght < 1) {
                  Ext.MessageBox.alert("提示", "请填写完整的数据");
                  return;
              }
              Ext.Ajax.request({
                  url: "3",
                  method: "post",
                  params: { id: id, name: name, date: date, descn: descn },
                  success: function (response, opts) {
                      if (response.responseText == "false") {
                          Ext.MessageBox.alert("提示", "添加失败");
                          return;
                      }
                      Ext.MessageBox.alert("提示", "添加成功");
                      window.hide();
                      store.reload();
                      Ext.getCmp("id").setValue("");
                      Ext.getCmp("name").setValue("");
                      Ext.getCmp("date").setValue("");
                      Ext.getCmp("descn").setValue("");
                  }
              });
          } else if (types == "update") {
              if (id.lenght < 1 || name.lenght < 1 || date.lenght < 1 || descn.lenght < 1) {
                  Ext.MessageBox.alert("提示", "请填写完整的数据");
                  return;
              }
              Ext.Ajax.request({
                  url: "2",
                  method: "post",
                  params: { id: id, name: name, date: date, descn: descn },
                  success: function (response, opts) {
                      if (response.responseText == "false") {
                          Ext.MessageBox.alert("提示", "修改失败");
                          return;
                      }
                      Ext.MessageBox.alert("提示", "修改成功");
                      window.hide();
                      store.reload();
                      Ext.getCmp("id").setValue("");
                      Ext.getCmp("name").setValue("");
                      Ext.getCmp("date").setValue("");
                      Ext.getCmp("descn").setValue("");
                  }
              });
          }
      }
  },
 {
     text: "重置", handler: function () {
         Ext.getCmp("id").setValue("");
         Ext.getCmp("name").setValue("");
         Ext.getCmp("date").setValue("");
         Ext.getCmp("descn").setValue("");
     }
 }
    ]


});


//创建显示面板
var grid = new Ext.grid.GridPanel({
    autoHeight: true,
    forceFit: true,  //智能分配每列宽度
    loadMask: true,   //未加载前显示loading...
    store: store,
    stripeRows: true, //斑马线
    sm: sm,
    cm: cm,
    tbar: [
     {
         xtype: "button", text: "添加", handler: function (btnAdd) {
             Ext.getCmp("types").setValue("add");
             Ext.getCmp("id").setValue("");
             Ext.getCmp("name").setValue("");
             Ext.getCmp("date").setValue("");
             Ext.getCmp("descn").setValue("");
             window.show();
         }
     },
     {
         xtype: "button", text: "删除", handler: function (btnDel) {

             var gd = btnDel.ownerCt.ownerCt;
             var st = gd.getStore();
             var data = gd.getSelectionModel().getSelections();
             if (data.length == 0) {
                 Ext.MessageBox.alert("提示", "请至少选择一条数据删除");
                 return;
             } else {
                 if (confirm('是否删除选中的信息?')) {
                     var ids = "";
                     for (var i = 0; i < data.length; i++) {
                         ids += data[i].json.ID + ",";
                     }
                     Ext.Ajax.request({
                         url: "4",
                         params: { ids: ids },
                         method: "post",
                         success: function (response, opts) {
                             if (response.responseText == "false") {
                                 Ext.MessageBox.alert("提示", "删除失败");
                                 return;
                             }
                             Ext.MessageBox.alert("提示", "删除成功");

                             store.reload();
                         }
                     });
                 }
             }
         }
     },
     {
         xtype: "button", text: "修改", handler: function (btnUpdate) {
             var gd = btnUpdate.ownerCt.ownerCt;
             var st = gd.getStore();
             var data = gd.getSelectionModel().getSelections();
             if (data.length != 1) {
                 Ext.MessageBox.alert("提示", "请选择一条信息进行修改");
                 return;
             }
             var emp = data[0];
             Ext.getCmp("types").setValue("update");
             Ext.getCmp("id").setValue(emp.json.ID);
             Ext.getCmp("name").setValue(emp.json.Names);
             Ext.getCmp("date").setValue(emp.json.Date);
             Ext.getCmp("descn").setValue(emp.json.Descn);
             window.show();

         }
     }
    ],
    bbar: new Ext.PagingToolbar({
        pageSize: 5,
        store: store,
        displayInfo: true,
        displayMsg: '显示第{0}条到{1}条记录,一共{2}条',
        emptyMsg: "没有记录",
        plugins: new Ext.ux.ProgressBarPager()    //分页进度条
    }),
    viewConfig: {
        columnsText: '显示的列',
        forceFit: true,
        sortAscText: '升序', /*调试成可用的*/
        sortDescText: '降序'
    },
    autoExpandColumn: 'Descn',
    collapsible: true,
    animCollapse: false
});
//渲染
grid.render('grid');

});

这个改动大了。。自己看下面的注释标注出来的。。

自己多看下API:http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.tree.Panel


    Ext.onReady(function () {
        Ext.QuickTips.init(); //HtmlEditor需要这个,不加,编辑时不提示
        //////////////////////////////////////////////////////////////////////
        var sm = new Ext.selection.CheckboxModel/*Ext.grid.CheckboxSelectionModel*/({ /*handleMouseDown*/selectionchange: Ext.emptyFn });
        var cm = /*new Ext.grid.ColumnModel(*/[
        new Ext.grid.RowNumberer(), //显示行号
       // sm,
        { header: '编号', dataIndex: 'ID', sortable: true },
        { header: '姓名', dataIndex: 'Names' },
        { header: '时间', dataIndex: 'Date', renderer: Ext.util.Format.dateRenderer('Y-m-d') },
        { header: '描述', dataIndex: 'Descn' }
        ]//);

        //创建数据源
        var store = new Ext.data.Store({
            proxy: {
                type: 'ajax',
                url: 'data.txt',
                reader: {
                    totalProperty: 'totalCount',
                    root: 'roots'
                }
            },
            fields: [
          { name: "ID" },
          { name: "Names" },
          {
              name: "Date", dateFormat: 'Y-m-d', convert: function (v) {
                  if (v == null) {
                      return null;
                  }
                  var d = new Date();
                  var str = v.toString();
                  var str1 = str.replace("/Date(", "");
                  var str2 = str1.replace(")/", "");
                  var dd = parseInt(str2);
                  d.setTime(dd);
                  return d;
              }
          },
          { name: "Descn" }
            ], listeners: { load: function () { alert(this.getCount())}}
        });
        //////////////////////////////////////////////////////////////////////
        //加载数据
        store.load({ params: { start: 0, limit: 5 } });

        //创建form表单
        var frm = new Ext.form.FormPanel({
            id: "frmDemo",
            frame: true,
            lableWidth: 75,
            lableAlign: "right",
            items: [
              { xtype: "hidden", id: "types" },
              { xtype: "numberfield", fieldLabel: "编号", id: "id", allowNegative: false, allowBlank: false, blankText: "请输入有效的整数" },
              { xtype: "textfield", fieldLabel: "姓名", id: "name" },
              { xtype: "datefield", fieldLabel: "日期", id: "date", format: "Y-m-d" },
              { xtype: "textfield", fieldLabel: "描述", id: "descn" }
            ]
        });

        //创建窗体
        var window = new Ext.Window({
            title: '基本信息',
            width: 400,
            height: 300,
            minWidth: 300,
            minHeight: 200,
            closeAction: 'hide',
            modal: true, //弹窗遮层
            plain: true,    //与背景色保持协调
            bodyStyle: 'padding:5px;',
            buttonAlign: 'center',
            items: frm,     //添加内容
            buttons: [
          {
              text: '提交', handler: function () {
                  var types = Ext.getCmp("types").getValue();
                  var id = Ext.getCmp("id").getValue();
                  var name = Ext.getCmp("name").getValue();
                  var date = Ext.getCmp("date").getValue();
                  var descn = Ext.getCmp("descn").getValue();
                  if (types == "add") {
                      if (id.lenght < 1 || name.lenght < 1 || date.lenght < 1 || descn.lenght < 1) {
                          Ext.MessageBox.alert("提示", "请填写完整的数据");
                          return;
                      }
                      Ext.Ajax.request({
                          url: "3",
                          method: "post",
                          params: { id: id, name: name, date: date, descn: descn },
                          success: function (response, opts) {
                              if (response.responseText == "false") {
                                  Ext.MessageBox.alert("提示", "添加失败");
                                  return;
                              }
                              Ext.MessageBox.alert("提示", "添加成功");
                              window.hide();
                              store.reload();
                              Ext.getCmp("id").setValue("");
                              Ext.getCmp("name").setValue("");
                              Ext.getCmp("date").setValue("");
                              Ext.getCmp("descn").setValue("");
                          }
                      });
                  } else if (types == "update") {
                      if (id.lenght < 1 || name.lenght < 1 || date.lenght < 1 || descn.lenght < 1) {
                          Ext.MessageBox.alert("提示", "请填写完整的数据");
                          return;
                      }
                      Ext.Ajax.request({
                          url: "2",
                          method: "post",
                          params: { id: id, name: name, date: date, descn: descn },
                          success: function (response, opts) {
                              if (response.responseText == "false") {
                                  Ext.MessageBox.alert("提示", "修改失败");
                                  return;
                              }
                              Ext.MessageBox.alert("提示", "修改成功");
                              window.hide();
                              store.reload();
                              Ext.getCmp("id").setValue("");
                              Ext.getCmp("name").setValue("");
                              Ext.getCmp("date").setValue("");
                              Ext.getCmp("descn").setValue("");
                          }
                      });
                  }
              }
          },
         {
             text: "重置", handler: function () {
                 Ext.getCmp("id").setValue("");
                 Ext.getCmp("name").setValue("");
                 Ext.getCmp("date").setValue("");
                 Ext.getCmp("descn").setValue("");
             }
         }
            ]


        });


        //创建显示面板
        var grid = new Ext.grid.GridPanel({
            autoHeight: true,
            forceFit: true,  //智能分配每列宽度
            loadMask: true,   //未加载前显示loading...
            store: store,
            stripeRows: true, //斑马线
            //////////////////////////////////////////////////////////////////////
            /*sm*/selModel: sm,
            /* cm*/columns: cm,
            //////////////////////////////////////////////////////////////////////
            tbar: [
             {
                 xtype: "button", text: "添加", handler: function (btnAdd) {
                     Ext.getCmp("types").setValue("add");
                     Ext.getCmp("id").setValue("");
                     Ext.getCmp("name").setValue("");
                     Ext.getCmp("date").setValue("");
                     Ext.getCmp("descn").setValue("");
                     window.show();
                 }
             },
             {
                 xtype: "button", text: "删除", handler: function (btnDel) {

                     var gd = btnDel.ownerCt.ownerCt;
                     var st = gd.getStore();
                     var data = gd.getSelectionModel().getSelections();
                     if (data.length == 0) {
                         Ext.MessageBox.alert("提示", "请至少选择一条数据删除");
                         return;
                     } else {
                         if (confirm('是否删除选中的信息?')) {
                             var ids = "";
                             for (var i = 0; i < data.length; i++) {
                                 ids += data[i].json.ID + ",";
                             }
                             Ext.Ajax.request({
                                 url: "4",
                                 params: { ids: ids },
                                 method: "post",
                                 success: function (response, opts) {
                                     if (response.responseText == "false") {
                                         Ext.MessageBox.alert("提示", "删除失败");
                                         return;
                                     }
                                     Ext.MessageBox.alert("提示", "删除成功");

                                     store.reload();
                                 }
                             });
                         }
                     }
                 }
             },
             {
                 xtype: "button", text: "修改", handler: function (btnUpdate) {
                     var gd = btnUpdate.ownerCt.ownerCt;
                     var st = gd.getStore();
                     var data = gd.getSelectionModel().getSelections();
                     if (data.length != 1) {
                         Ext.MessageBox.alert("提示", "请选择一条信息进行修改");
                         return;
                     }
                     var emp = data[0];
                     Ext.getCmp("types").setValue("update");
                     Ext.getCmp("id").setValue(emp.json.ID);
                     Ext.getCmp("name").setValue(emp.json.Names);
                     Ext.getCmp("date").setValue(emp.json.Date);
                     Ext.getCmp("descn").setValue(emp.json.Descn);
                     window.show();

                 }
             }
            ],
            bbar: new Ext.PagingToolbar({
                pageSize: 5,
                store: store,
                displayInfo: true,
                displayMsg: '显示第{0}条到{1}条记录,一共{2}条',
                emptyMsg: "没有记录",
                plugins: new Ext.ux.ProgressBarPager()    //分页进度条
            }),
            viewConfig: {
                columnsText: '显示的列',
                forceFit: true,
                sortAscText: '升序', /*调试成可用的*/
                sortDescText: '降序'
            },
            autoExpandColumn: 'Descn',
            collapsible: true,
            animCollapse: false
        });
        //渲染
        grid.render('grid');

    });

这是gridpanel的代码,我想把他放在搭建好的4.2的环境中也可以运行

3.0的版本和4.0的版本有差异的,会有部分效果出不来,到时候看哪些效果出不来再去照着api修改