Page 2 of 5 FirstFirst 1234 ... LastLast
Results 11 to 20 of 48

Thread: Visible Checkbox in EditorGrid

  1. #11

    Default

    I made a sort of workaround for this.
    Instead of using an editor I use grid.on('cellclick'), then check for the column and if the value in the cell is true then set to false and reverse.

    That makes the following code:

    PHP Code:
    grid.on('cellclick', function(gridrowIndexcolumnIndexe) { 
        if(
    columnIndex == && rowIndex>3)
       {
                 
    //get value
                    
    var ds.getAt(rowIndex); // records from DataStore
                       
    var colName cm.getDataIndex(2); // name of column from Record
                       
    var cellValue r.get(colName); // testlogin
                       
                       //change value     
                       
    if(cellValue == 'j')
                       {
                           
    r.set('2''n');
                       }
                       else
                       {
                           
    r.set('2''j');
                       }
       }
    }); 
    The only problem that my code to update the database doesn't work for it, but I can simply duplicate the code to update the cell.

  2. #12

    Default

    My teammate on a school project asked me to try and do this, so I went for it --I found a way that seems to work okay. At least it is a start: I will not go over the rendering that is covered already

    form.checkbox made like so:

    var pmApproved_field= new fm.Checkbox(); pmApproved_field.addListener("focus",function(ele){ele.setValue(ele.getValue() ? false : true)});

    okay so that takes care of one of your clicks
    so now you just need to make the cell edit on click instead of double click

    so, in my project I want 1 click editing on all cells so I use:
    grid.addListener("cellclick", function(ele,r,c,e){
    grid.startEditing(r,c);
    });

    so test that out, if it works okay but you don't want 1 click editing on every cell you can attach the cellclick / focus listener to something else like columnmodel maybe.

    Hope that helps someone,
    Bob

  3. #13

    Default

    Thanks a lot for the input. I actually am looking again at this issue this week since 1.1 came out.

    So thanks for the timely help

    m

  4. #14
    Sencha User mystix's Avatar
    Join Date
    Mar 2007
    Location
    Singapore
    Posts
    6,236

    Default

    just in case anyone's still monitoring this thread, there's a pretty simple way to achieve single-click checkbox toggling in EditorGrids (slick Ext checkbox image was inspired by @jsakalos's post).

    I'll use the Inline Editing example found in the Ext 1.1 download available here.

    locate the file edit-grid.js in the ext/examples/grid directory, and make the following changes:
    • to the method formatBoolean
      Code:
      // show Ext's menu checkbox instead of html checkbox
      function formatBoolean(value, cell, rec, rowIndex, colIndex, ds) {
        return [
          '<img ',
            'class="checkbox" ', // give the checkbox image a css class of "checkbox"
            'src="../../resources/images/default/menu/',
            value? 'checked.gif' : 'unchecked.gif',
          '"/>'
        ].join("");
      };
    • to the ColumnModel definition
      Code:
      {
        header: "Indoor?",
        dataIndex: 'indoor',
        width: 55,
        renderer: formatBoolean,
        editable: false // prevent editing of the "Indoor?" column
      }
    • to the EditorGrid definition
      Code:
      // create the editor grid
      var grid = new Ext.grid.EditorGrid('editor-grid', {
        ds: ds,
        cm: cm,
        enableColLock:false,
        listeners: { // add a cellclick listener to the grid
          cellclick: function(o, row, cell, e) {
            // ensure mouseclick occurred within checkbox icon's visible area
            if (o.getColumnModel().getDataIndex(cell) == 'indoor' && e.getTarget('.checkbox', 1)) {
              var rec = o.getDataSource().getAt(row);
              rec.set('indoor', !rec.get('indoor')); // toggle "indoor" value
            }
          }
        }
      });


    and here's the result of single-clicking the checkbox icon (note the usual dirty field indicator in the currently selected cell):
    _____________________________________________

  5. #15
    Sencha User
    Join Date
    Mar 2007
    Posts
    464

    Default

    Excellent!
    I suggest you apply these changes using Ext.override() rather then changing source files though.

  6. #16
    Sencha User mystix's Avatar
    Join Date
    Mar 2007
    Location
    Singapore
    Posts
    6,236

    Default

    Quote Originally Posted by JorisA View Post
    Excellent!
    I suggest you apply these changes using Ext.override() rather then changing source files though.
    Ext.override?

    dude, i'm not changing any object prototypes. edit-grid.js is the js source for the "Inline Editing" example available in the Ext 1.1 download.

    i merely changed the definition for the formatBoolean custom renderer, made the ColumnModel's 'indoor' column uneditable, and added a cellclick listener (or should i say handler?) on the EditorGrid. there's no need for an Ext.override.

  7. #17

    Default

    Thanks Marc, worked perfectly first time.

  8. #18
    Ext User violinista's Avatar
    Join Date
    Apr 2007
    Location
    Serbia
    Posts
    293

    Default

    great work!

    Thanks a lot, it could be fine to override Ext's CheckBox() to provide such functionality as default. Don't know how to do that, will try and post here if success. If somebody has already done that, let us other know.
    "It is better to be young, pretty and rich instead old, ugly and poor."
    (c) Alan Ford.

  9. #19
    Sencha Developer
    Join Date
    Mar 2007
    Location
    Germany
    Posts
    482

    Default

    Marc,

    great idea and great work

    @violinista
    ...
    it could be fine to override Ext's CheckBox() to provide such functionality as default.
    ...
    Have a look at the code. There is no checkbox involved...

  10. #20
    Ext User violinista's Avatar
    Join Date
    Apr 2007
    Location
    Serbia
    Posts
    293

    Default

    Of course, I saw it, but what if I have, say, >10 editable grids in my application,and all of them are using this nice checkbox extension? it would be nice reuse them, but not writing every time the same code.
    "It is better to be young, pretty and rich instead old, ugly and poor."
    (c) Alan Ford.

Page 2 of 5 FirstFirst 1234 ... LastLast

Posting Permissions

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