Question

使用EditableColumn小部件以及文本框弹出窗口，然后单击field并打开弹出窗口。当我在页面任何区域之外单击时，弹出窗口都不会关闭

  return kartik\editable\Editable::widget ( [
            'name' => 'name' ,
            'size' => 'sm' ,
            'placement' => 'right' ,
            'containerOptions' => [] ,
            'contentOptions' => [] ,
            'inputType' => kartik\editable\Editable::INPUT_TEXT ,
            'value' => 1 ,
            'editableValueOptions' => [] ,
            'pluginEvents' => [
                "editableSuccess" => "function(event, val, form, data) {
    $.pjax.reload({container: '#name'});
    }" ,
            ] ,
            'formOptions' => [
                'method' => 'post' ,
                'id' => 'form_name' ,
                'action' => [ url ]
            ] ,
            'options' => [
                'id' => 'form_name' ,
                'pluginOptions' => [
                    'autoclose' => true
                ] ,
                'maxlength' => '10' ,
            ] ,
            'submitButton' => [
                'class' => 'btn btn-sm btn-primary' ,
                'icon' => '' ,
            ] ,
        ] );

Answer 1

您需要为可编辑内容使用选项'closeOnBlur'=>true,，因为它的默认值为false，并且在任何地方单击时都保持粘性。

此外，您正在pluginOptions内指定options，这会将它们作为属性添加到输入中。并且您指定了[url]之类的URL，请在使用代码时将其更新为实际URL，将可编辑代码更改为以下内容。

echo kartik\editable\Editable::widget ( [
    'name' => 'name' ,
    'size' => 'sm' ,
    'placement' => 'right' ,
    'containerOptions' => [] ,
    'contentOptions' => [] ,
    'inputType' => kartik\editable\Editable::INPUT_TEXT ,
    'value' => 1 ,
    'editableValueOptions' => [] ,
    'pluginEvents' => [
        "editableSuccess" => "function(event, val, form, data) {
    $.pjax.reload({container: '#name'});
    }" ,
    ] ,
    'formOptions' => [
        'method' => 'post' ,
        'id' => 'form_name' ,
        'action' => ''
    ] ,
    'closeOnBlur'=>true,
    'options' => [
        'id' => 'form_name' ,
        'maxlength' => '10' ,
    ] ,
    'submitButton' => [
        'class' => 'btn btn-sm btn-primary' ,
        'icon' => '' ,
    ] ,
] );

Yii2：Kartik \ editable \ Editable关闭弹出框，如果模糊或在外部单击

1 个答案: