выберите изменить окно CSS класс

Question

К сожалению, я не могу работать его с й-редактируемым ...

я пытаюсь изменить (hprimary) класс CSS на выбор с й-редактируемым. Вот мой jsfiddel: jsfiddel (только с x-редактируемым). Кроме того, я попробовал это с обычной кнопкой выбора, и он работает там. (jsfiddel2) Итак, что мне нужно изменить в x-редактируемом скрипте, чтобы заставить его работать?

HTML:

<div class="hpanel hprimary" id="overview"> 
</div> 
    <div><label class="control-label">TEST</label> 
    <a href="#" id="select" data-type="select" data-pk="1"data-value="" 
     data-title="" class="editable editable-click" style="color: gray;">not selected</a> 
    </div> 

JavaScript:

$(function() { 
$.fn.editable.defaults.mode = 'popup'; 
$('#select').editable({ 
    prepend: "not selected", 
    placement: 'right', 
    source: [{ 
     value: 1, 
     text: 'NTP(red)' 
    }, { 
     value: 2, 
     text: 'SUCCESS(green)' 
    }, { 
     value: 3, 
     text: 'OPTION(blue)' 
    }], 

}); 
}); 

CSS:

.hpanel { 
background-color: none; 
border: none; 
box-shadow: none; 
margin-bottom: 25px 
} 
.hpanel.hprimary .panel-body { 
border-top: 2px solid #34495e 
} 
.hpanel.hgreen .panel-body { 
border-top: 2px solid #62cb31 
} 
.hpanel.hblue .panel-body { 
border-top: 2px solid #3498db 
} 
.hpanel.hred .panel-body { 
border-top: 2px solid #e74c3c 
} 

Answer 1

Вы можете использовать опцию validate() обратного вызова, как описано here, чтобы получить извещение, когда пользователь выбрал стоимость.

На основе вашего примера вы использовали бы регулярное выражение для извлечения цвета из текстового значения и добавления соответствующего класса в элемент hpanel.