Question

我正在用php编写带有表单的网站。从第二种形式发送数据时出现了问题，由于使用jQuery隐藏了先前的形式，该行为发生了变化。

从第二种形式（已被动态替换）发送后，不发送数据，而仅更新页面并触发action_index，后者基于cookie构建页面。

为什么页面会刷新并且第一次不发送数据？

ajax.js

$('.form-signin').submit(function(e){
    console.log($(this).attr("id"));
    e.preventDefault();
    $.post(
        'main/ajax', // адрес обработчика
         $(".form-signin").serialize(), // отправляемые данные          

        function(msg) { // получен ответ сервера  
            $('.form-signin').slideUp('slow').remove();
            $('#result_form').html(msg);
        }
    );
    return false;
});

controller.php

...
function action_index()
    {   
            switch($_COOKIE['step']){
                case $this->FIRST_FORM:
                    $this->view->generate('main_view.php', 'template_view.php', $data);
                    break;
                case $this->SECOND_FORM:
                    $this->view->generate('next_view.php', 'template_view.php');
                    break;
                case $this->FINAL_PAGE:
                    $this->view->generate('finish_view.php', 'template_view.php');
                    break;  
    }
...
function action_ajax(){
        switch($_COOKIE['step']){

            case $this->FIRST_FORM:
                $result = array(
                    "firstname" => $_POST['firstName'],
                    "lastname" => $_POST['lastName']
                );
                $this->model->insert_user($result);
                setcookie("step", $this->SECOND_FORM, time()+30*24*60*60, '/');
                setcookie("id", $id, time()+30*24*60*60, '/');
                $newform = $this->model->get_form('next_view');
                echo $newform;
                break;

            case $this->SECOND_FORM:
                // Here should code run but it doesn't though cookie has already changed few strings above
                $id = $_COOKIE['id']
                $result = array(
                    "company" => $_POST['company'],
                    "photo" => NULL,
                    "id" => $_id
                );

                if(!empty($_FILES['photo']['name'])) {
                    $image = $_FILES['photo']["name"]; 
                    $imgContent = addslashes(file_get_contents($image)); 
                    $result['photo'] = $imgContent;
                }


                $this->model->update_user($result);
                $newform = $this->model->get_form('finish_view');
                setcookie("step", $this->FINAL_PAGE, time()+30*24*60*60, '/');
                break;
        }

main_view.php

<form id="mainform" class="form-signin" method="POST">
    <h1 class="h3 mb-3 font-weight-normal">Registration</h1>
    <input type="text" name="firstName" id="inputFirstName" class="form-control" placeholder="First Name" required autofocus>
    <input type="text" name="lastName" id="inputLastName" class="form-control" placeholder="Last Name" required>
    <button class="btn btn-lg btn-primary btn-block" type="submit">Next</button>
    <p class="mt-5 mb-3 text-muted">&copy; 2020</p>
</form>
<div id="result_form"></div>

next_view.php

<form id="mainform" class="form-signin" method="POST">
<h1 class="h3 mb-3 font-weight-normal">Few steps to continue</h1>
    <h3 class="h5 mb-3 font-weight-normal">Please, fill in the form below to finish the registration</h1>
    <input type="text" name= "company" id="inputCompany" class="form-control" placeholder="Company" required autofocus>
    <input type="file" name="photo" id="inputFile" accept="image/jpg,image/x-png,image/gif,image/jpeg" class="form-control" placeholder="Photo">
    <button class="btn btn-lg btn-primary btn-block" type="submit">Register</button>
    <p class="mt-5 mb-3 text-muted">&copy; 2020</p>
</form>
<div id="result_form"></div>

UPD 用此代码$(document).on("submit", ".form-signin", function() ..替换 ajax.js ，现在可以正常使用

使用ajax提交时刷新页面

0 个答案: