Jtable Jquery에서 JColor Picker 구현

Question

필드 colourCode에 대한 Jtable에 Jquery-color-picker를 구현하려면 어떻게해야합니까? colourCode는 Json 문자열에 의해 제공되는 16 진 코드입니다. 나는 Jtable (입력)에 관한 약간의 연구를했다. 그러나 그것은 나를 막 다른 골목으로 이끌었다.

<script type="text/javascript"> 
     $(document).ready(function() { 
      $('#EventTypeTableContainer').jtable({ 
       title: 'Table of EventType', 
       columnResizable: false, 
       columnSelectable: false, 
       actions: { 
        listAction: 'Admin/GetEventTypeList', 
        createAction: 'Admin/CreateEventType', 
        updateAction: 'Admin/UpdateEventType', 
        deleteAction: 'Admin/DeleteEventType' 
       }, 
       fields: { 
        EventTypeId: { 
         key: true, 
         list: false 
        }, 
        EventTypeName: { 
         title: 'Event Type', 
         width: '40%' 
        }, 
        colourCode: { 
         title: 'Event Color', 
         width: '40%', 
         input: $(function() { $('input').ColorPicker(options);}), 
        }, 
        isSystemEventType: { 
         title: 'System Constraint', 
         width: '20%', 
         list: false, 
         create: false, 
         edit: false 
        } 
       } 
      }); 
      $('#EventTypeTableContainer').jtable('load'); 
     }); 
    </script> 

Answer 1

는이 작업을 달성하기 위해 'input' 특성의 조합과 'formCreated' 이벤트를 사용할 수 있습니다.

입력 기능에서 'id'를 일반 텍스트 입력에 추가하십시오.

input: function (data) { 
    if (data.record) { 
     return '<input id="color" type="text" value="data.record.color">'; 
    } else { 
     return '<input id="color" type="text">'; 
    } 
} 

다음으로 'formCreated'이벤트에서 색상 선택기를 초기화하십시오.

formCreated: function (event, data) { 
    $('#color').ColorPicker(options); 
}