jeditable 동적 선택 옵션

Question

jEditable을 사용하는 페이지가 있고 선택 목록의 옵션을 동적으로로드하려고합니다 (현재 요소에 따라 다름).

나는 바이올린에 다음과 같은 예를 가지고 : http://jsfiddle.net/mbv401920150/2rdco6qL/1/

$(document).ready(function() { 
    $('.edit').editable(function(value, settings) { 
     console.log(this); 
     console.log(value); 
     console.log(settings); 
     return(value); 
    }, { 
     data : " {'E':'E','F':'F','G':'G', 'selected':'F'}", // <---- I WANT TO CHANGE THIS CODE 
     // ****************************************** 
     // DYNAMIC LOAD - DEPENDING OF THE ELEMENT ID 
     // ****************************************** 
     // data : function(currentElement) { 
     //   if(currentElement.id == "A") return " { '1':'1', '2':'2', '3':'3' }"; 
     //  else return " { 'A':'A', 'B':'B', 'C':'C' }"; 
     // } 
     type : 'select', 
     onblur: 'submit' 
    });         
}); 

내가 요소의 따라 특정 옵션의 목록을 검색 할 수 있습니다. 이것이 가능할 수 있습니까?

Answer 1

이 작업을 수행하는 방법을 알아 냈으므로 각 요소 당 추가 클래스가 포함됩니다. 여기

전체 솔루션입니다 : http://jsfiddle.net/mbv401920150/2rdco6qL/3/

$(document).ready(function() { 
    $('.letter, .number').each(function(i, e) { 
    $(e).editable(function(value, settings) { 
     console.log(this); 
     console.log(value); 
     console.log(settings); 
     return (value); 
    }, { 
     data: ($(e).hasClass('letter') ? 
     " { 'A':'A', 'B':'B', 'C':'C' }" : 
     " { '1':'1', '2':'2', '3':'3' }"), 
     type: 'select', 
     onblur: 'submit' 
    }); 
    }); 
}); 

동적 세대 (마우스가 클릭에, 이상) 인 경우; jEditable 초기화 후 보조 클래스를 제거합니다.