更新后日期选择器更改格式

问题描述

我在视图中使用引导日期选择器，每次调用 更新方法 时，日期设置正常，但日期选择器突然从 dd/mm/yyyy 格式恢复为 mm/dd/ yyyy 格式。

控制器

public function actionDias(){
    Yii::$app->response->format = \yii\web\Response::FORMAT_JSON;

    if (isset($_POST['anio']) and isset($_POST['cuatrimestre'])) {
        $cuatrimestre = $_POST['cuatrimestre'];
        $anio = $_POST['anio'];

        $fechaMin = CampusActividadDia::find()->where(['cuatrimestre' => $cuatrimestre])->andWhere(['anio' => $anio])->min('fecha');
        $fecha_desde = date("d/m/Y",strtotime($fechaMin));

        $fechaMax = CampusActividadDia::find()->where(['cuatrimestre' => $cuatrimestre])->andWhere(['anio' => $anio])->max('fecha');
        $fecha_hasta = date("d/m/Y",strtotime($fechaMax));

        return ([
            'fecha_desde' => $fecha_desde,'fecha_hasta' => $fecha_hasta
        ]);
    } else return null;
}

查看

<div id="dias" class="form-group hidden">     
    <label class="control-label">Rango de Fechas:</label>
    <?PHP  
    echo DatePicker::widget([
        'model' => $model,'attribute' => 'fecha_desde','attribute2' => 'fecha_hasta','options' => ['id'=>'fecha_desde','disabled' => ($model->fecha_desde == "")],'options2' => ['id'=>'fecha_hasta','type' => DatePicker::TYPE_RANGE,'separator' => 'hasta','pluginoptions' => [
            'autoclose' => true,'format' => 'dd/mm/yyyy'
        ]
    ]); ?>
</div>

Js

$.ajax({
    url: URL_BASE + "/campus/dias",type: "post",dataType: "json",data: { 
        cuatrimestre: this.value,anio: $('#anio').val()
    },success: function (res) {
        const fecha_desde = res.fecha_desde;
        const fecha_hasta = res.fecha_hasta
        
        $(fechaDesdeRef).kvDatepicker('update',new Date(fecha_desde));
        $(fechaHastaRef).kvDatepicker('update',new Date(fecha_hasta));

        $(fechaDesdeRef).prop('disabled',false);
        $(fechaHastaRef).prop('disabled',false);
    },error: function (xhr,ajaxOptions,thrownError) {
    alert("ERROR " + xhr.status);
    },});

我还尝试通过设置全局默认格式和本地设置两种方式更改日期格式，但没有成功，如下所示：

$.fn.kvDatepicker.defaults.format = 'dd/mm/yyyy'
$(datePickerRef).kvDatepicker({
    formatDate: 'd/m/Y',date:'d/m/Y'
})

我也读过这个问题，但没有关于它的结论：

https://github.com/uxsolutions/bootstrap-datepicker/issues/1775

解决方法

听起来你的 DatePicker 在模型加载时覆盖了 pluginOptions。可能需要配置 DatePicker 或覆盖它以防止丢失格式

,

config/main.php

'modules' => [
       'datecontrol' => [
        'class' => 'kartik\datecontrol\Module','displaySettings' => [
            'date' => 'php:d-M-Y','time' => 'php:H:i:s A','datetime' => 'php:d-m-Y H:i:s A',],'saveSettings' => [
            'date' => 'php:Y-m-d','time' => 'php:H:i:s','datetime' => 'php:Y-m-d H:i:s',// automatically use kartikwidgets for each of the above formats
        'autoWidget' => true,'components' => [
//http://webtips.krajee.com/override-bootstrap-css-js-yii-2-0-widgets/
        'assetManager' => [
            'bundles' => [
                'yii\bootstrap4\BootstrapAsset' => [
                    'sourcePath' => '@npm/bootstrap/dist'
                ],'yii\bootstrap4\BootstrapPluginAsset' => [
                    'sourcePath' => '@npm/bootstrap/dist'
                ],'@frontend\modules\invoice\assets\CoreCustomCssJsAsset'=>[
                    'sourcePath' => '@frontend/modules/invoice/assets'
                ],

composer.json

 "require": {
        "php": ">=7.4.9","guzzlehttp/guzzle":"*","yiisoft/yii2": "~2.0.41.1","yiisoft/yii2-bootstrap": "~2.0.9","yiisoft/yii2-bootstrap4": "^2.0.8","bower-asset/bootstrap": "~3.4.1","bower-asset/ladda": "*","bower-asset/font-awesome": "~4.7.0.0","npm-asset/jquery": "^2.2","vlucas/phpdotenv": "*","insolita/yii2-migration-generator": "~3.1","ifsnop/mysqldump-php": "*","warrence/yii2-kartikgii": "dev-master","kartik-v/yii2-bootstrap4-dropdown": "@dev","kartik-v/bootstrap-fileinput": "dev-master","kartik-v/yii2-editable": "@dev","kartik-v/yii2-grid":"@dev","kartik-v/yii2-widget-timepicker": "@dev","kartik-v/yii2-date-range": "*","kartik-v/yii2-social": "@dev","kartik-v/yii2-dynagrid": "dev-master","kartik-v/yii2-tree-manager": "@dev","kartik-v/yii2-mpdf":"dev-master","kartik-v/bootstrap-star-rating": "@dev","kartik-v/yii2-slider": "dev-master","kartik-v/yii2-number" : "@dev","kartik-v/yii2-editors": "@dev","kartik-v/yii2-validators": "dev-master",},"require-dev": {
        "yiisoft/yii2-debug": "~2.1.0","yiisoft/yii2-gii": "~2.1.0","yiisoft/yii2-faker": "~2.0.0","codeception/codeception": "^4.0","codeception/verify": "~0.5.0 || ~1.1.0"
    },"config": {
        "process-timeout": 1800
    },"fxp-asset": {
            "installer-paths": {
                "npm-asset-library": "vendor/npm-asset","bower-asset-library": "vendor/bower-asset"
            }
    },

这些设置对我有用。您可能会考虑如下修改您的 AppAsset.php 以包含引导程序 4。

<?php

namespace frontend\assets;

use yii\web\AssetBundle;
use yii\bootstrap4\BootstrapAsset;
use yii\web\YiiAsset;
use yii\web\JqueryAsset;
/**
 * Main frontend application asset bundle.
 */
class AppAsset extends AssetBundle
{
    
    public $sourcePath = '@app/assets/app';
    public $baseUrl = '@app';
    
    public $css = [        
        'css/site.css','//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css','//use.fontawesome.com/releases/v5.3.1/css/all.css','//cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css'
    ];
    
    public $js = [ 
                   '//kit.fontawesome.com/85ba10e8d4.js',];
    
    public $depends = [
        BootstrapAsset::class,YiiAsset::class,JqueryAsset::class,];
}