Размер NicEdit в Hidden Div уменьшен.

Question

Я пытаюсь использовать редактор NicEdit для текстовой области, скрытой в div.Когда пользователь нажимает кнопку, открывается родительский элемент div целевой текстовой области.Ширина текстовой области установлена ​​на 100% от родительского div.Проблема в том, что родительский div скрыт, поэтому текстовое поле не имеет ширины до того, как родительский div будет открыт.Если я попытаюсь прикрепить редактор NicEdit одновременно с раскрытием его родительского элемента div, редактор окажется крошечным.

<script type="text/javascript">

function add_task_editor() {
        new nicEditor({buttonList : ['fontSize','bold','italic','underline','strikeThrough','subscript','superscript','ul','link']}).panelInstance('task_description');
    };

$('#trigger_it').click(function (e) {
 $('#parent_div').show();
 add_task_editor();

});
</script>
<div id="parent_div" style="display: none;">
<textarea id="task_description"></textarea>
</div>

Есть ли способ исправить это, чтобы ширина редактора устанавливалась на 100% от родительского div после его загрузки?

Answer 1

Конечно, в основном после создания редактора проверьте его, чтобы найти его идентификатор или класс, который у него есть, и установите его ширину. $('#editorsID').width('100%'); например.

Или, может быть, найдите ширину родительского div в пикселях и установите ее на это значение.

Answer 2

В моем случае это работало с jQuery:

new nicEditor().panelInstance('myArea');

$('.nicEdit-panelContain').parent().width('100%');
$('.nicEdit-panelContain').parent().next().width('100%');

.

или до абсолютной ширины:

$('.nicEdit-panelContain').parent().width('400px');
$('.nicEdit-panelContain').parent().next().width('400px');

.

Answer 3

Ответ @Hans работал со мной ... но мне нужно было добавить это, чтобы изменить размер, содержащий редактируемый текст (только контейнер вокруг этого DIV был изменен, когда не использует строку ниже): .

$('.nicEdit-main').width('100%');

.

Answer 4

$('.nicEdit-panelContain').parent().width('100%');
$('.nicEdit-panelContain').parent().next()
    .width($('.nicEdit-panelContain').parent().width()-2);

.

Добавить «-2» на «ширину», если родитель Textarea имеет опоры «прокладки слева» или «PODD вправо».

Answer 5

Это сработало лучшее для меня:

new nicEditor().panelInstance('nic-me');
$('.nicEdit-panelContain').parent().width('100%');
$('.nicEdit-panelContain').parent().next().width('98%');
$('.nicEdit-main').width('100%');

.

Answer 6

Это решает мое дело! Спасибо

$(document).ready(function(){
        bkLib.onDomLoaded(function() {
        new nicEditor({fullPanel : true, maxHeight:100}).panelInstance('myArea');
        $('.nicEdit-panelContain').parent().width('100%');
        $('.nicEdit-panelContain').parent().next().width('98%');
        $('.nicEdit-main').width('100%');
        });
    });

.

Answer 7

Для тех, у кого такая же проблема, я оптимизировал это, и она выглядит совершенно нормально:

$(document).ready(function(){
    bkLib.onDomLoaded(function() {
        new nicEditor({fullPanel : true}).panelInstance('myArea');
        $('.nicEdit-panelContain').parent().css({width:'100%', padding:"0"});
        $('.nicEdit-panelContain').parent().next().css({width:'100%', padding:"5px"});
        $('.nicEdit-main').css({width:'100%', padding:"0", minHeight:"80px"});
    });
});

.