Question

我的网站有一个自定义选择菜单，该菜单使用jQuery将所选值传递到字段中。 PHP然后获取隐藏输入字段的值，并且应该将值插入数据库。但是，这并没有发生，我不知道为什么。任何人都可以解释为什么会这样吗？

FORM

<form id="scenario_builder" method="post">
    <fieldset for="center">
        <label>Center:</label>
        <div class="select" name="center_menu" id="center_menu">
            <div class="arrow"></div>
            <div class="option-menu">
                <?php
                    $query = "SELECT * FROM $centers";
                    $result = mysqli_query($connect, $query);
                    while($row = mysqli_fetch_assoc($result)){
                        $center_name = "{$row['center']}";
                        echo "<div class='option'>" .$center_name ."</div>";
                    }
                ?>
            </div>
        </div>
    </fieldset>
    <input type="submit" name="save" id="save" class="button" value="Save" />
</form>

表格处理

ob_start();
if($_SERVER["REQUEST_METHOD"] == "POST"){
    $center = $_POST["center"];
    $query = "INSERT INTO `$scenarios`(`id`) VALUES('" .$center ."')";
    mysqli_query($connect, $query);
}
ob_clean();
echo json_encode(array("success" => 1));

JQUERY SELECT MENU

function select_menu(){
    var select = $(".select");
    var option_menu = $(".option-menu");
    var option = $(".option");
    select.on("click", function(){
        $(this).find(option_menu).toggle();
        select = $(this);
        $(this).find(option_menu).each(function(){
            $(".current").hide();
            if($(this).hasClass("current")){
                $(this).removeClass("current");
            }
            else{
                $(this).show().addClass("current");
            }
        })
    })

    option.on("click", function(){
        select.children("p").remove();
        var value = $(this).text();
        select.prepend("<p><input type='hidden' name='center' id='center' value='" +value +"' />" +value +"</p>");
        console.log(value);
    })

    $(document).on("click", function(ev){
        if($(ev.target).closest(".select").length === 0){
            $(".current").hide().removeClass("current");
        }
    })
}
select_menu();

JQUERY EVAND HANDLER

$("input[id='save']").on("click", function(){
        $.post("..php/processing.php", {}, function(response){
            if(response.success == "1"){
                console.log("Data entered.");
            }
            else{
                console.log("Data not entered.");
            }
        }, "json");
    })

Answer 1

您的主要问题是您需要使用$.post

的数据参数提供要发送的数据

您可以使用serialize()获取表单的所有数据。您还需要在使用ajax时重新启动浏览器默认提交过程，否则表单也会正常提交

通常最好将everyhting绑定到表单的submit事件。

$('#scenario_builder').submit(function(event){
    /* prevent default submit*/
     event.preventDefault();
     /* do ajax "this" is the form element*/
     $.post("..php/processing.php", $(this).serialize(), function(response){
            if(response.success == "1"){
                console.log("Data entered.");
            }
            else{
                console.log("Data not entered.");
            }
        }, "json");           
});

PHP没有将隐藏输入字段的值输入数据库

1 个答案: