如何在yii2

时间:2019-04-18 20:23:19

标签: php ajax yii2-advanced-app

我正在尝试使用Kartik Editable作为内联编辑来更新detailView行中的数据,并且正在使用Kartik detailView。由于数据不是手动发送的,因此我使用方法 post 通过 ajax 发送数据, 这是我的view.php:

<?php
echo DetailView::widget([
    'model' => $model,
    'mode' => DetailView::MODE_VIEW,
    'attributes' => [
        [
            'attribute' => 'busFleetStatus',
            'format' => 'raw',
            'value' => Editable::widget([
                'model' => $model,
                'attribute' => 'busFleetStatus',
                'beforeInput' => function($form, $widget) {
                    echo $form->field($widget->model, 'busFleetStatus')->widget(\kartik\select2\Select2::classname(), [
                        'data' => ArrayHelper::map(SystemStatus::find()->where(['statusCode' => 'busFleetStatus'])->all(), 'systemStatusId', 'statusDetail'),
                    ])->label(false);
                },
                'afterInput' => function($form, $widget) {
                    echo $form->field($widget->model, 'busFleetStatus')->widget(\kartik\select2\Select2::classname(), [
                        'data' => ArrayHelper::map(SystemStatus::find()->where(['statusDetail' => 'busFleetStatus'])->all(), 'systemStatusId', 'statusDetail'),
                    ])->label(false);
                },
                'size' => 'lg',
                'header' => 'Bus Fleet Status',
                'displayValueConfig' => [
                    1 => 'Operating',
                    2 => 'Maintenance',
                    3 => 'Available',
                    4 => 'Booked',
                ],
                'placement' => 'right',                            
                'format' => Editable::FORMAT_LINK,
                'inputType' => Editable::INPUT_SELECT2,
                'showAjaxErrors' => false,
                'pluginOptions' => [
                ],
            ]),
        ],
    ],
])
?>   

这是我的ajax:

<?php
$url = Url::toRoute(['bus-fleet/view?id=' . $model->busFleetId]);
$key = $model->busFleetId;
$this->registerJs(<<< JS
$(document).ready(function () {
$('.kv-editable-submit').click(function() {               

    var key = '$key';
    var parAtt = $(".popover-title").clone()
        .children()
        .remove()
        .end()
        .text();               

    var preRep = parAtt.replace(/^\s+Edit /,"");

    var postRepF = preRep.replace(/\s+$/, "");

    var postRepS = postRepF.replace(/\s+/, "");        

    var upAtt = postRepS.replace(/\s+/, "");        

    var value = $("#select2-busfleet-busfleetstatus-container").text();

    var att = upAtt[0].toLowerCase() + upAtt.substring(1)

    $.ajax({     
        url: '$url',
        dataType: 'json',
        data:{hasEditable: 1, editableIndex: 0, editableKey: key, BusFleet: [{name: value, editableAttribute: att}]},
        type: 'post',
    });     
});
});
JS
);
?>

ajax使用方法 POST 成功更新了数据,但同时显示 json解析错误,因为手动方法 GET 也将执行。 所以当我单击按钮时,我同时有两个请求 enter image description here

如何删除GET方法请求?我只需要POST请求。

预先感谢

1 个答案:

答案 0 :(得分:0)

我猜您想防止.kv-editable-submit的默认行为

$('.kv-editable-submit').click(function(event){
    event.stopPropagation();

    // your custom code goes here

    return false;        
}

有关事件传播的更多信息,请参见this answer