Добавление загрузки файла в ячейку SlickGrid?

Question

В окне slickgrid я должен добавить кнопку для загрузки файла. Я добавил эту кнопку, используя пользовательский форматир. Но я не мог добавить обработчик события onchange для захвата файла. Может ли кто-нибудь понять, как мы можем добавить слушателя onchange в ячейку.?

Answer 1

В форматировании отображается только имя файла или что-то в этом роде. Чтобы достичь своей цели, вам нужно написать собственный редактор, который реализует метод isValueChanged. Вы можете изменить это или любой другой редактор взят из:

https://github.com/mleibman/SlickGrid/blob/master/slick.editors.js

 function myCustomEditor(args) { 
     var $input; 
     var defaultValue; 
     var scope = this; 

     this.init = function() { 
      $input = $("<INPUT type=text class='editor-text' />") 
       .appendTo(args.container) 
       .bind("keydown.nav", function (e) { 
       if (e.keyCode === $.ui.keyCode.LEFT || e.keyCode === $.ui.keyCode.RIGHT) { 
        e.stopImmediatePropagation(); 
       } 
       }) 
       .focus() 
       .select(); 
     }; 

     this.destroy = function() { 
      $input.remove(); 
     }; 

     this.focus = function() { 
      $input.focus(); 
     }; 

     this.getValue = function() { 
      return $input.val(); 
     }; 

     this.setValue = function (val) { 
      $input.val(val); 
     }; 

     this.loadValue = function (item) { 
      defaultValue = item[args.column.field] || ""; 
      $input.val(defaultValue); 
      $input[0].defaultValue = defaultValue; 
      $input.select(); 
     }; 

     this.serializeValue = function() { 
      return $input.val(); 
     }; 

     this.applyValue = function (item, state) { 
      item[args.column.field] = state; 
     }; 

     this.isValueChanged = function() { 
      return (!($input.val() == "" && defaultValue == null)) && ($input.val() != defaultValue); 
     }; 

     this.validate = function() { 
      if (args.column.validator) { 
      var validationResults = args.column.validator($input.val()); 
      if (!validationResults.valid) { 
       return validationResults; 
      } 
      } 

      return { 
      valid: true, 
      msg: null 
      }; 
     }; 

     this.init(); 
     } 

редактор может быть затем назначен в столбцах объекта:

var columns = [ 

     {id: "title", name: "Title", field: "title", width: 70, minWidth: 50, cssClass: "cell-title", sortable: true, editor: myCustomEditor}, 

    ];