小叮当的肚兜 2019-04-30 16:20:27 4937次浏览 3条评论 5 1 0

https://packagist.org/packages/yii2mod/yii2-editable

无刷新更新 GridView 表格内容。例:
1、GridView 使用
use yii2mod\editable\EditableColumn;

然后添加列:

[
    'class' => EditableColumn::class,
    'attribute' => 'username', //修改的字段
    'url' => ['change-username'], //提交的修改的url
 ],

2、对应控制器添加 actions

public function actions()
{
    return [
        'change-username' => [
            'class' => EditableAction::class,
            'modelClass' => UserModel::class, //对应修改的model
        ],
    ];
}

还有下拉选择修改。具体的功能可下载测试。

深度截图_选择区域_20190430161959.png

觉得很赞
  • 评论于 2020-08-30 22:14 举报

    控制器配置
    public function actions()

    {
        return [
            'change-input' => [
                'class' => EditableAction::className(),
                'modelClass' => TTest::className(), //对应修改的model
            ],
        ];
    }
    
  • 评论于 2020-08-30 22:12 举报

    yii2-editable 的文档缺失,具体使用方法还得看源码,以下是从源码中得到的常用方法:

    1、GridView 中使用

           [
                 'class' => EditableColumn::className(),
                  'attribute' => 'input', //修改的字段
                  'url' => ['change-input'], //提交的修改的url
                   'type' => 'date',
                   'clientOptions' => [
                       'format' => 'yyyy-mm',
                   ]
           ];
    

    2、配置
    支持五种类型,设置参数为type,配置参数clientOptions,下面的例子都是默认配置,根据实际场景修改配置

    1)address

    [
    
     'url' => '/post',
     'title' =>  'Enter city, street and building #',
     'value' =>  [
         'city' => "Moscow", 
         'treet' =>  "Lenina", 
         'building'=> "15"
     ]
    ];
    

    2)text
    文本 默认类型

    3)combodate
    日期选择

    [
         "format" => 'YYYY-MM-DD',    
         "viewformat" =>  'DD.MM.YYYY',    
         "template" =>  'D / MMMM / YYYY',    
         "combodate" =>  [
                    "minYear" => 2000,
                    "maxYear" =>  2015,
                    "minuteStep" =>  1
               ] 
    ];
    

    4)date 跟combodate功能相同,UI不同
    日期选择

    [
         "format" => 'yyyy-mm-dd',    
         "viewformat" =>  'dd/mm/yyyy',    
         "combodate" =>  [
                   "weekStart" => 1
               ] 
    ];
    

    5)datetime
    时间选择

    [
         "format" => 'yyyy-mm-dd hh:ii',    
         "viewformat" =>  'dd/mm/yyyy hh:ii',    
         "combodate" =>  [
                   "weekStart" => 1
               ] 
    ];
    
  • 评论于 2019-11-17 20:42 举报

    这个可以有

您需要登录后才可以评论。登录 | 立即注册