Page 3 of 3 FirstFirst 123
Results 21 to 30 of 30

Thread: Adding a Checkbox in a Grid row and connect it to JSON?

  1. #21
    Sencha User
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,245

    Default

    Code:
    Ext.grid.CheckColumn = function (config) {
        Ext.apply(this, config);
        if (!this.id) {
            this.id = Ext.id();
        }
        this.renderer = this.renderer.createDelegate(this);
    };
    Ext.grid.CheckColumn.prototype = {
        init: function (grid) {
            this.grid = grid;
            this.grid.on('render', function () {
                var view = this.grid.getView();
                view.mainBody.on('mousedown', this.onMouseDown, this);
            }, this);
        },
        onMouseDown: function (e, t) {
            if (t.className && t.className.indexOf('x-grid3-cc-' + this.id) != -1) {
                e.stopEvent();
                var index = this.grid.getView().findRowIndex(t);
                var record = this.grid.store.getAt(index);
                record.set(this.dataIndex, record.data[this.dataIndex] === '1' ? '0' : '1');
            }
        },
        renderer: function (v, p, record) {
            p.css += ' x-grid3-check-col-td';
            return '<div class="x-grid3-check-col' + (v === '1' ? '-on' : '') + ' x-grid3-cc-' + this.id + '">&#160;</div>';
        }
    };

  2. #22

    Default

    Quote Originally Posted by Condor View Post
    Code:
    Ext.grid.CheckColumn = function (config) {
    Ext.apply(this, config);
    if (!this.id) {
    this.id = Ext.id();
    }
    this.renderer = this.renderer.createDelegate(this);
    };
    Ext.grid.CheckColumn.prototype = {
    init: function (grid) {
    this.grid = grid;
    this.grid.on('render', function () {
    var view = this.grid.getView();
    view.mainBody.on('mousedown', this.onMouseDown, this);
    }, this);
    },
    onMouseDown: function (e, t) {
    if (t.className && t.className.indexOf('x-grid3-cc-' + this.id) != -1) {
    e.stopEvent();
    var index = this.grid.getView().findRowIndex(t);
    var record = this.grid.store.getAt(index);
    record.set(this.dataIndex, record.data[this.dataIndex] === '1' ? '0' : '1');
    }
    },
    renderer: function (v, p, record) {
    p.css += ' x-grid3-check-col-td';
    return '<div class="x-grid3-check-col' + (v === '1' ? '-on' : '') + ' x-grid3-cc-' + this.id + '">&#160;</div>';
    }
    };
    Ok, I did get it to work. But it seems it is not storing the new value in the database. What code do I need to write to get it to update the database automatically?

  3. #23
    Sencha User
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,245

    Default

    It only updates the store. If you want to update the database then you need to send a request to the server with the changed data and have your server process this.

  4. #24

    Default

    Quote Originally Posted by Condor View Post
    It only updates the store. If you want to update the database then you need to send a request to the server with the changed data and have your server process this.
    Can you give me some sample code to update the database with the changed data?

  5. #25
    Sencha User
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,245

    Default

    Do you want do update on every single change or do you want a save button to save all changes?

    ps. The server software you will have to write yourself. I'm not helping with that.

  6. #26

    Default

    Quote Originally Posted by Condor View Post
    Do you want do update on every single change or do you want a save button to save all changes?

    ps. The server software you will have to write yourself. I'm not helping with that.
    I think both options work fine. What option is the easiest one to code?

  7. #27
    Sencha User
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,245

    Default

    Doesn't really matter.

    First solution:
    Code:
    store.on('update', function(store, rec, phase){
      if (phase == Ext.data.Record.EDIT) {
        Ext.Ajax.request({
          url: 'update-record.php',
          params: rec.data,
          success: function(){
            rec.commit();
          },
          failure: function(){
            rec.reject();
            Ext.Msg.alert('Error', 'Updating failed');
          }
        });
      }
    });

  8. #28

    Default

    Seems I almost got it to work. It does update just fine, but what I need is to send a value, called, say, test, to identify the row. What would work for example is to send the value of any field in the grid, say, company_name but how do I accomplish this?
    This is the code that I have so far, it updates the mySQL just fine:

    Code:
     
    onMouseDown: function (e, t) {
            if (t.className && t.className.indexOf('x-grid3-cc-' + this.id) != -1) {
                e.stopEvent();
                var index = this.grid.getView().findRowIndex(t);
                var record = this.grid.store.getAt(index);
                record.set(this.dataIndex, record.data[this.dataIndex] === '1' ? '0' : '1');
                Ext.Ajax.request({
          url: 'content/registercompany/registercompany.php?mode=oppdaterAktiv',
         // params: 'aktiv=' + this.grid.getView().findRowIndex(t), //+ ':' + record.data[this.dataIndex],
          params: 'aktiv=' +  record.data[this.dataIndex]+'&test=' + userCM.id,
          success: function(){
           Ext.Msg.alert('Oppdater', 'Oppdatert!');
          },
          failure: function(){
            //rec.reject();
            Ext.Msg.alert('Error', 'Updating failed');
          }
        });

  9. #29

    Lightbulb

    Ok, I almost got it to work.
    The problem is that I need to fetch some data from the extJS grid, in order to select the correct ID from the database.
    How can I retrieve the value of, say, 'company_name' or 'company_id' (which is hidden) in the grid and pass it on?
    The value of the checkbox (aktiv) I am able to pass just fine using POST.

    This is the code I have so far:

    Code:
     
    onMouseDown: function (e, t) {
            if (t.className && t.className.indexOf('x-grid3-cc-' + this.id) != -1) {
                e.stopEvent();
                var index = this.grid.getView().findRowIndex(t);
                var record = this.grid.store.getAt(index);
                record.set(this.dataIndex, record.data[this.dataIndex] === '1' ? '0' : '1');
                Ext.Ajax.request({
          url: 'content/registercompany/registercompany.php?mode=oppdaterAktiv',
         // params: 'aktiv=' + this.grid.getView().findRowIndex(t), //+ ':' + record.data[this.dataIndex],
          params: 'aktiv=' +  record.data[this.dataIndex]+'&test=' +Ext.id,
          success: function(){
           //Ext.Msg.alert('Oppdater', 'Oppdatert!');
          },
          failure: function(){
            //rec.reject();
            Ext.Msg.alert('Error', 'Updating failed');
          }
        });

  10. #30
    Sencha User
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,245

    Default

    Code:
    params: {
      aktiv: record.get(this.dataIndex),
      test: Ext.id,
      company_id: record.get('company_id'),
      company_name: record.get('company_name')
    }

Page 3 of 3 FirstFirst 123

Similar Threads

  1. Can Ext.Ajax connect to GWT RPC method that returns JSON?
    By richardcatlin in forum Sencha Touch 1.x: Discussion
    Replies: 1
    Last Post: 29 Sep 2010, 3:31 PM
  2. Adding Checkbox Column to a grid
    By mannyk in forum Ext Designer: Help & Discussion
    Replies: 2
    Last Post: 23 Aug 2010, 10:00 PM
  3. Row editor grid Adding new row
    By mayurid in forum Ext 3.x: Help & Discussion
    Replies: 2
    Last Post: 18 Jul 2010, 8:42 PM
  4. Adding a row to a grid
    By shajeerkt in forum Ext GWT: Discussion
    Replies: 1
    Last Post: 17 Oct 2009, 12:44 AM
  5. Adding Id's to Row's in Grid
    By Vikram1507 in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 17 Mar 2009, 6:20 AM

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •