SlickGrid 사용자 정의 편집기에 TextExt 통합

Question

TextExt를 사용하여 SlickGrid에서 사용자 정의 편집기를 구현하려고하는데 문제가 있습니다.

두 개의 서로 다른 목록 args.column.names과`args.column.values ​​'가 있습니다. 태그에 선택한 이름을 표시하고 해당 ID 목록을 게시하고 싶습니다.

여기 초안이 있습니다. 어떻게 관리해야 할 지 모르겠습니다.

누군가 내가이 일을하기 위해 무엇을 쓰려고하는지 알아낼 수 있습니까? 당신은 my repo을 시도 할 수 있습니다

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

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

     $('.textarea').textext({ 
      plugins: 'tags autocomplete arrow' 
     }).bind('getSuggestions', function (e, data) { 
      var list = args.column.names, 
       textext = $(e.target).textext()[0], 
       query = (data ? data.query : '') || ''; 
      $(this).trigger('setSuggestions', { result: textext.itemManager().filter(list, query) }); 
     }); 

    }; 

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

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

    this.getValue = function() { 
     return $input.textext()[0].hiddenInput().val(); 
    }; 

    this.setValue = function (val) { 
     $input.textext()[0].hiddenInput().val(val) 
    }; 

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

    this.serializeValue = function() { 
     return $input[0].defaultValue; 
    }; 

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

    this.isValueChanged = function() { 
     return (!($input.textext()[0].hiddenInput().val() == "" && defaultValue == null)) && ($input.textext()[0].hiddenInput().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(); 
} 

Answer 1

, 그것은 최신 jQuery를 업데이트 및 수정 사항 및 개선 사항을 많이 가지고 있어요.

향상된 기능 중 하나는 Select2 편집기입니다.이 편집기는 수행하려는 작업과 매우 유사합니다. 나는 당신이 그것을 체크하면 그것이 무엇이 필요한지 명확 할 것이라고 생각한다.
example here이 있습니다.

보너스로, 편집자가 캡처하지 않고 특정 키 코드를 그리드에 버블시킬 수있는 메커니즘도 있습니다. 이것은 위쪽 화살표 등에 유용 할 수 있습니다. MLeibman 지점에는 없습니다.