代码之家 › 专栏 › 技术社区 › Toma Tomov

在ajax请求后找不到操作

yii2-advanced-app yii2

Toma Tomov · 技术社区 · 7 年前

在提交之前,我想将请求发送到操作。但作为回报 404 not found . 行动显然是在那里。在控制器的过滤器里也有。 JS:

$('#home-contact').on('beforeSubmit', function(){
                    $.ajax({
                        method: 'post',
                        url: '/site/send-contact',
                        data: new FormData($(this))[0],
                        success: function(data){
                            console.log(data)                          
                        }
                    })
                    return false
                })

控制器筛选器:

'access' => [
                'class' => AccessControl::className(),
                'only' => ['logout', 'signup', 'send-contact'],
                'rules' => [
                    [
                        'actions' => ['signup', 'send-contact'],
                        'allow' => true,
                        'roles' => ['?'],
                    ],
                    [
                        'actions' => ['logout'],
                        'allow' => true,
                        'roles' => ['@'],
                    ],
                ],
            ],

而且行动还:

public function actionSendContact()
    {
        Yii::$app->response->format = Response::FORMAT_JSON;
        $model = new Contact();
        if($model->load(Yii::$app->request->post()) && $model->save()){
            return $data['success'] = Yii::t('app', 'Successfully sent message.');
        }
        return $data['error'] = Yii::t('app', 'Something went wrong. Please try again.');
    }

如果这有什么关系的话,场景就发生在前端。谢谢您!

3 回复 | 直到 7 年前

Muhammad Omer Aslam 7 年前

不确定 404 由于请求中的url是正确的,因此将为ajax请求生成的url如下 http://example.com/site/send-contact 但只有当你使用 'enablePrettyUrl' => true, 对于 urlManager 组件,否则应该是 index.php?r=site/index 这可能只是 四百零四 ,更好的方法是从表单获取url action 属性。

除了上面,

你正在使用 new FormData() 发送带有如下请求的数据

data: new FormData($(this))[0]

不正确,不会发送任何 FormData 随请求返回 undefined ,您可以查看 console 或者使用 print_r($_POST) 在行动中 sendContact 一旦你完成了 四百零四 ,应该是

data: new FormData($(this)[0]),

你需要通过 $(this)[0] 然后传给 新窗体数据() .

但是这还不够你得把 contentType 和 processData 成为 false 正确提交 格式数据 否则您将在控制台中获得异常

未捕获类型错误:非法调用

所以你的代码应该是

$('#contact-form').on('beforeSubmit', function(){
    let url=$(this).attr('action');
    let form=$(this)[0];
    let data=new FormData(form);

    $.ajax({
        method: 'post',
        url: url,
        data:data,
        contentType: false, // NEEDED, DON'T OMIT THIS (requires jQuery 1.6+)
        processData: false,
        success: function(data){
            console.log(data)                          
        }
    });
    return false;
})

编辑

注意:首先你应该使用 data:$(form).serialize() 只是不使用 新窗体数据() 除非您计划使用ajax将文件与表单一起上载。

Gynteniuxas hrboy 7 年前

javascript中的url似乎没有完全指定。

有效的方法是:

url: 'index.php?r=site/send-contact',

但只有当你 index.php 在根文件夹中。

为了使它在任何情况下都能工作(例如index.php不在根目录中),您可以使用不同的解决方案。我个人喜欢用这个:

申报 action 和 id 以你的形式:

例子:

$form = ActiveForm::begin([
    'action' => ['site/send-contact'],
    'id' => 'my-form',
]);

在js代码中使用链接(由yii2本身生成):

例子:

$('#home-contact').on('beforeSubmit', function() {
    $.ajax({
        method: 'post',
        url: $('#my-form').attr('action'),
        data: new FormData($(this))[0],
        success: function(data) {
            console.log(data)                          
        }
    });

    return false;
});

在任何情况下,只要你的文件是。

希望能有帮助!

-1

Mehran 7 年前

你添加了吗? 'enableAjaxValidation' => true 或者在活动窗体中添加动作名称?

$form = ActiveForm::begin([
    'action' => ['controller/action'],
    'enableAjaxValidation' => true
]);