Results 1 to 2 of 2

Thread: Retaining invalid value in editable grid

    Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Sencha User
    Join Date
    Nov 2012
    Posts
    118

    Default Retaining invalid value in editable grid

    Hi,

    I have implemented following to retain invalid value in editable grid but it is not working as expected. Please help me out.

    Code:
    // This override is needed to deal with an ExtJS 4.2.1 bug that results from
    // grouping a grid.  Without it, when you hover over the first row in the grid
    // you'll get an error and the row won't be highlighted.  The only change is in x
    // you'll return statement (original shown in comments).
    
    
    
    
    
    
    Ext.onReady(function() {
    
    
      Ext.create('Ext.data.Store', {
        storeId:'simpsonsStore',
        fields:[{name : 'subject1'}, 'subject2', 'subject3'],
        data:{'items':[
            { 'subject1': 123,  "subject2":456,  "subject3":789  },
            { 'subject1': 123,  "subject2":456,  "subject3":789  },
            { 'subject1': 123,  "subject2":456,  "subject3":789  },
            { 'subject1': 123,  "subject2":456,  "subject3":789  },
        ]},
        proxy: {
            type: 'memory',
            reader: {
                type: 'json',
                root: 'items'
            }
        }
    });
    
    
     
    
    
    
    
    var cellEditing = Ext.create("Ext.grid.plugin.CellEditing", {
          clicksToEdit : 1
         
          
        }); // End Ext.create().
    var onKeyDown = function(inField, inEvent, inOpts){
    
    
      
          var charCode = inEvent.getCharCode();
          var v = inField.getValue();
          var vLen = v.length;
          var allowNeg = Ext.valueFrom(inField.allowNegative, false);
          //var rightOfDecMax = inField.rightOfDecimalMax;
       
          
           if ((charCode == 173 || charCode == 189 || charCode == 109) && !
            allowNeg) {
            inEvent.stopEvent();
            return;
          }
    
    
         if ((charCode == 173 || charCode == 189 || charCode == 109) &&
            allowNeg) {
    
    
            if (v.charAt(0) == "-") {
              inEvent.stopEvent();
              return;
            }
    
    
          }
         
          if ((charCode == 190 || charCode == 110) && ((v.split(".").length -1) > 0 
            )) {
            inEvent.stopEvent();
            return;
          }
    
    
    }
    
    
    
    
    var validateThisField = function(inValue){
    
    
    
    
         var leftOfDecMin = this.leftOfDecimalMin;
         var leftOfDecMax = this.leftOfDecimalMax;
         var rightOfDecMin = this.rightOfDecimalMin;
         var rightOfDecMax = this.rightOfDecimalMax;
         var allowNeg = Ext.valueFrom(this.allowNegative, false);
         
    
    
         //if (Ext.isEmpty(inValue) && this.allowBlank == true) {
           //return true;
         //}
    
    
         // Get absolute value of this field.  That means we need to get
         // rid of negative sign, if any, and all commas, if any.
         var v = inValue;
         v = v.replace("-", "");
         v = v.replace(/,/g, "");
    
    
         // Split the value at decimal point (if any).
         var vSplit = v.split(".");
         
         /*if(!this.allowZero){
           
           var tempVal = parseInt(v,10);
           if(tempVal == 0){
             return "Value should be greater than zero";
           }
         }*/
         
    
    
         // Make sure there's not too many digits to left of decimal.
         if (vSplit[0].length > leftOfDecMax) {
           return "Too many digits to the left of the decimal (" +
             leftOfDecMax + " allowed)";
         }
    
    
         // Make sure there's not too many digits to right of decimal,
         // if there's any.
         if (vSplit[1] && vSplit[1].length > rightOfDecMax) {
           return "Too many digits to the right of the decimal (" +
             rightOfDecMax + " allowed)";
         }
         
         // Check for minimum digits to the left if leftOfDecMin > 0.
         if (vSplit[0] == "" && leftOfDecMin >0) {
           return "Not enough digits to the left of the decimal (" +
             leftOfDecMin + " required)";
         }
    
    
    
    
         // Check for minimum digits to the left.
         if (vSplit[0].length < leftOfDecMin) {
           return "Not enough digits to the left of the decimal (" +
             leftOfDecMin + " required)";
         }
    
    
         // Check for minimum digits to the right if rightOfDemical > 0
         if (vSplit[1] == "" && rightOfDecMin > 0) {
           return "Not enough digits to the right of the decimal (" +
             rightOfDecMin + " required)";
         }
    
    
         // Again Check for minimum digits to the right.
         if (!Ext.isEmpty(vSplit[1]) && vSplit[1].length < rightOfDecMin) {
           return "Not enough digits to the right of the decimal (" +
             rightOfDecMin + " required)";
         }
    
    
         // Check for negative value if allowNegative is false.  This is necessary
         // in case of the user pasting a value into the field.
         if (!allowNeg && (inValue.indexOf("-") > -1)) {
           return "Value cannot be negative";
         }
         
         // Check if -ve is allowed and at proper position
         if (allowNeg && inValue.indexOf("-") > -1 &&(inValue.lastIndexOf("-") != 0)) {
           return "Not a negative value";
         }
         
         if(!Ext.isEmpty(this.minValue) && v<this.minValue){
           return "Minimum value should be or greater than" + this.minValue;
         }
         
         if(!Ext.isEmpty(this.maxValue) && v>this.maxValue){
           return "Maximum value should be or lesser than " + this.maxValue;
         }
    
    
         return true;
    
    
       
    
    
    }
    
    
    
    
    Ext.override( Ext.Editor, {
        updateEl : true,
        revertInvalid : true,
        completeEdit : function(remainVisible){
                console.log("in overriden method");
               var me = this,
                field = me.field,
                value;
    
    
            if (!me.editing) {
                return;
            }
    
    
            
            if (field.assertValue) {
                field.assertValue();
            }
    
    
            value = me.getValue();
            if (!field.isValid()) {
                if (me.revertInvalid !== false) {
                    //me.cancelEdit(remainVisible);
                }
                //return;
            }
    
    
            if (String(value) === String(me.startValue) && me.ignoreNoChange) {
                me.hideEdit(remainVisible);
                return;
            }
    
    
            if (me.fireEvent('beforecomplete', me, value, me.startValue) !== false) {
                
                value = me.getValue();
                if (me.updateEl && me.boundEl) {
                    me.boundEl.update(value);
                }
                me.hideEdit(remainVisible);
                me.fireEvent('complete', me, value, me.startValue);
            }
        
        },
    
    
         cancelEdit : function(remainVisible) {
            var me = this,
                startValue = me.startValue,
                field = me.field,
                value;
    
    
            if (me.editing) {
                value = me.getValue();
                // temporarily suspend events on field to prevent the "change" event from firing when setValue() is called
                field.suspendEvents();
                me.setValue(value);
                field.resumeEvents();
                me.hideEdit(remainVisible);
                me.fireEvent('canceledit', me, value, startValue);
            }
        }    
    });
    
    
    
    
    
    
    
    
    Ext.create('Ext.grid.Panel', {
        title: 'Simpsons',
        margin : 50,
        store: Ext.data.StoreManager.lookup('simpsonsStore'),
        selType : 'cellmodel',
        
        plugins : [cellEditing],
        columns: [
            { text: 'Subject 1',  dataIndex: 'subject1',
              align : "right",
              width : 150,
                 editor: {
                    maxLength : 16,
                    enforceMaxLength : true,
                    maskRe: /[\d.,-]/,
                    enableKeyEvents: true,
                    fieldStyle: "text-align:right;",
                    allowNegative : true,
                    leftOfDecimalMin : 2,
                    leftOfDecimalMax : 13,
                    rightOfDecimalMin : 2,
                    rightOfDecimalMax : 2,
                    validator: validateThisField,
                    listeners : {
                      keydown : onKeyDown
                      
                    }
                  },
                renderer : function(v){
                    return v;
                   //return Ext.util.Format.number(v, '0,000.00');
                }
             },      
            { text: 'Subject 2', dataIndex: 'subject2', flex: 1 ,
            width : 150,
            editor : {
              maxLength : 15,
              id : "textID"
            }},
            { text: 'Subject 3', dataIndex: 'subject3' ,width : 150}
        ],
        height: 200,
        width: 400,
        renderTo: Ext.getBody()
    });
    
    
    });


    You can find demo of above example on link https://fiddle.sencha.com/#fiddle/s1c

  2. #2
    Sencha User joel.watson's Avatar
    Join Date
    Nov 2014
    Posts
    3,120

    Default

    Hi--

    Can you describe a bit more about the error you're experiencing?

    Thanks
    Joel

Similar Threads

  1. Grid to Grid drag and drop with retaining first grid data
    By chetan.nellekeri in forum Ext: Q&A
    Replies: 2
    Last Post: 22 Aug 2013, 1:44 AM
  2. Grid retaining state
    By da_sweetp in forum Ext 3.x: Help & Discussion
    Replies: 1
    Last Post: 5 Nov 2010, 4:56 PM
  3. In EditorGrid, how to keep the field editable after input invalid value??
    By dragonfly in forum Ext 1.x: Help & Discussion
    Replies: 1
    Last Post: 19 Sep 2007, 11:34 PM

Posting Permissions

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