对ajax发布的错误请求yii2

时间:2017-04-18 14:58:58

标签: javascript ajax yii

我正在尝试向yii2上的某个动作发送一个ajax帖子,但我在控制台上收到了这个问题:

主线程上的同步XMLHttpRequest因其对最终用户体验的不利影响而被弃用。如需更多帮助,请查看https://xhr.spec.whatwg.org/。 XMLHttpRequest.open @ 40:817 closeModal @ 40:124 onclick @ 40:92 40:134 POST http://localhost/shekh/web/images/test 400(错误请求) closeModal @ 40:134 onclick @ 40:92 40:838未捕获的ReferenceError:未定义blueimp     在HTMLDivElement.document.getElementById.onclick(40:838) document.getElementById.onclick @ 40:838

状态代码:400错误请求

我的简单行动是:

 public function actionTest() {
        die("HERE");
        if (Yii::$app->request->isAjax) {
            die("in AJAX");

            $data = Yii::$app->request->post();
            die($data);
//        die($param);
        }
    }

我的视图在yii的更新视图中呈现,它是:

<?php

use app\assets\DosamigosAsset;
use yii\helpers\Url;
use yii\web\View;

DosamigosAsset::register($this);

$js = <<<x
document.getElementById('links').onclick = function (event) {

    event = event || window.event;
    var target = event.target || event.srcElement,
        link = target.src ? target.parentNode : target,
        options = {index: link, event: event},
        links = this.getElementsByTagName('a');
    blueimp.Gallery(links, options);
};
x;
//the end of the js script
$this->registerJs($js, View::POS_END);
?>
<style>
    .myTestImage {
        float: right;
        direction: rtl;
        border: #aaa;
        border-width: 1px;
    }
    #links {
        border-width: 1px;
    }
</style>

<div class="container">
    <div id="links" style="border-width:5px; border-color: red !important">
        <?php
        foreach ($images as $image) {
            echo "<div class='myTestImage' >"
            . "<span class='close cursor' onclick='closeModal(" . $image->id . " , this.parentElement)' style='color: red;
            '>&times;</span>"
//            . "<a href='" . Yii::getAlias('@web') . "/themes/shekh/images/images/" . $image->c_path . "' title='" . $image->c_originalName . "'>"
            . "<img style ='width:150px;
            height: 150px' src='" . Yii::getAlias('@web') . "/themes/shekh/images/images/" . $image->c_path . "' alt='" . $image->c_originalName . "'>"
//            . "</a>"
            . "</div>";
        }
//        foreach ($images as $image) {
//            echo "<div class='myTestImage' >"
//            . "<a href='" . Yii::getAlias('@web') . "/themes/shekh/images/images/" . $image->c_path . "' title='" . $image->c_originalName . "'>"
//            . "<img style ='width:150px;
//            height: 150px' src='" . Yii::getAlias('@web') . "/themes/shekh/images/images/" . $image->c_path . "' alt='" . $image->c_originalName . "'>"
//            . "</a>"
//            . "</div>";
//        }
        ?>
    </div>

</div>

<script>

    function closeModal(imageId, element) {
//        document.getElementById('myModal').style.display = "none";
        alert("هل أنت متأكد من كونك تريد إزالة هذه الصورة؟");
        var http = new XMLHttpRequest();
//        var url = "http://localhost/shekh/web/images/test";
        var url = "<?= Url::toRoute(['images/test']) ?>";

//        var params = "id = imageId";
        var params = "id=40";
        http.open("POST", url, false);

//Send the proper header information along with the request
        http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

        http.onreadystatechange = function () {//Call a function when the state changes.
            if (http.readyState == 4 && http.status == 200) {
                alert("http.responseText");
            }
        }
        http.send(params);

        element.style.display = 'none';
    }
    document.onreadystatechange = function () {
        if (document.readyState == "complete") {
            $(".myTestImage").hover(function () {
                $(this).css({'border-style': 'solid', 'display': 'inline-block'});
//                $(this).css("border-style", "solid");
            }, function () {
                $(this).css("border-style", "none");
            });


        }
    }
</script>

0 个答案:

没有答案