Yii 2 kartik dialog.prompt с типом ввода textarea - PullRequest
Новая
       77

Yii 2 kartik dialog.prompt с типом ввода textarea

0 голосов
/ 09 ноября 2018

У меня есть кнопка, которая запускает kartik dialog.prompt, в который вставляется текст. Мне нужно, чтобы ввод в диалоговом окне имел несколько строк и возможность разрыва строки (например, textarea)

Как изменить его с простого ввода текста на textarea?

Вот мой JavaScript: 

$("#bulk-email-button-invitations").on("click", function() {
    var grid = $("#invitations");
    var keys = grid.yiiGridView('getSelectedRows');

    if (keys.length >= 1){
    krajeeDialog.prompt({label:'Text emailu:', placeholder:'Zadejte text emailu'}, function (result) {
        if (result) {
            $(location).attr('href', '/educational-event-invitation/bulk-email?' + $.param({invitations: keys, text: result}));
        } else {
            krajeeDialog.alert('Text emailu nesmí být prázdný!');
        }
    });
    }else{
        krajeeDialog.alert("Nejprve vyberte studenty, kterým chcete poslat email!")
   }
});

Я обнаружил, что если тип не определен (в отличие от метки и заполнителя в моем случае), по умолчанию используется значение "текст". Но я не смог заставить диалог визуализировать любой тип, кроме простого однострочного ввода текста.

Ответы [ 2 ]

0 голосов
/ 13 ноября 2018

В конце концов, можно добавить собственный html в krajeeDialog.prompt. В документации kartik-v говорится:

content: string | object: Если задано как строка, оно обрабатывается как необработанный HTML-контент, который будет отображаться напрямую.

Поэтому, если я заменю исходный объект в моем коде строкой, содержащей желаемый HTML, он будет отображать мою текстовую область или любой другой элемент формы.

Например, замените его HTML-текстом: 

$("#bulk-email-button-invitations").on("click", function() {
    var grid = $("#invitations");
    var keys = grid.yiiGridView('getSelectedRows');

    if (keys.length >= 1){
    krajeeDialog.prompt('<textarea>Sample text...</textarea>', function (result) {
        if (result) {
            $(location).attr('href', '/educational-event-invitation/bulk-email?' + $.param({invitations: keys, text: result}));
        } else {
            krajeeDialog.alert('Text emailu nesmí být prázdný!');
        }
    });
    }else{
        krajeeDialog.alert("Nejprve vyberte studenty, kterým chcete poslat email!")
   }
});
0 голосов
/ 09 ноября 2018

По-видимому, это не поддерживается в расширении.

Причина:

Причина в том, что в dialog.js, где определен KrajeeDialog.prototype, функция bdPrompt - это та, которая заботится о диалоге приглашения, который должен быть создан, и создает тип поля по умолчанию как input вместо того, чтобы выбирать какой-либо из параметров или параметров, переданных KrajeeDialog.prompt(), хотя вы можете передать параметр с именем type, например 

krajeeDialog.prompt({
  label:'Text emailu:', 
  placeholder:'Zadejte text emailu',
  type:'password'
},function(){})

но это не решает, будет ли элемент типа input или textarea, этот параметр type передается как attribute элемента ввода. См. Приведенный ниже блок кода, чтобы понять причину, по которой я объяснил, что третья строка всегда создает поле типа ввода.

Файл yii2-dialog/assets/js/dialog.js Строка 110 

if (typeof input === "object") {
    $inputDiv = $(document.createElement('div'));
    $input = $(document.createElement('input'));
    if (input['name'] === undefined) {
        $input.attr('name', 'krajee-dialog-prompt');
    }
    if (input['type'] === undefined) {
        $input.attr('type', 'text');
    }
    if (input['class'] === undefined) {
        $input.addClass('form-control');
    }
    $.each(input, function(key, val) {
        if (key !== 'label') {
            $input.attr(key, val);
        }
    });
    if (input.label !== undefined) {
        msg = '<label for="' + $input.attr('name') + '" class="control-label">' + input.label + '</label>';
    }
    $inputDiv.append($input);
    msg += $inputDiv.html();
    $input.remove();
    $inputDiv.remove();
} else {
    msg = input;
}

Так что вам может потребоваться переопределить функцию javascript в соответствии с вашими потребностями, если вы хотите работать таким образом.

...