Question

我需要通过Ajax获取我的代码的Modal表单数据：

SET ORACLE_BASE=<Dir>\path
SET ORACLE_HOME=<Dir>\path\product\12.2.0\dbhome_1

代码模式：

    $(document).on('click', '#save-photo', function () {
    $.ajax({
        url: '/sistem/view/agend/photovisit.php',
        type: 'POST',
        data: $('#photo').serialize(),
        beforeSend: function () {
            $('#save-photo').val("Saving");
        },
        success: function (data) {
            $('#photo')[0].reset();
            $('#registerPhoto').modal('hide');
            //$('#call sucess message').html(data); 
        }
    });
});

我的目标是输入所有字段并将其发送到PHP页面editacli.php，该页面已经具有接收$ _POST ['']的方法；的每个表单元素并保存到数据库中，然后我要关闭模式并在模式屏幕上显示一条消息“数据已成功保存”。

但是此Ajax代码不起作用，当我单击“提交”按钮时，什么都没有发生。

注意：我已经在没有模式的情况下测试了我的PHP插入页面，并且可以正常保存，只是不知道如何使用模式来解决。

Answer 1

1：如下更改表单提交方法
2：如果您的php文件photovisit.php已从主文件夹链接，请使用
url: "../sistem/view/agend/photovisit.php",行事url: "sistem/view/agend/photovisit.php",。

$('#photo').submit(function(e){
    e.preventDefault();
var savePhoto = $(this).serialize();
$.ajax({
url: "../sistem/view/agend/photovisit.php",
type: "post",
data: savePhoto ,
dataType: 'JSON',
success: function(response) {
}

检查一下，让我知道问题是否仍然存在。

Answer 2

尝试将type: 'POST',更改为method: 'POST',，并添加contentType: 'application/json

'

Answer 3

请阅读我的代码，它与您的代码相去甚远，但我认为它将对您有所帮助。

<script>
    $(document).ready(function(){

         $('#insert_open').on('submit',function(e)
{
    e.preventDefault();
    processing_show();  
        var form_data = new FormData(this);                  
        $.ajax
        ({
            url: "./scripts.php?action=insert_open",
            type: "POST",             
            data: form_data,
            contentType: false,       
            cache: false,             
            processData:false,
            success: function(data) {
                processing_hide();
                $("#message-success").slideDown("slow");
                setTimeout(function(){close_message_success();},3000);

            },
            error: function(data)
            {

                $("#message-warning").slideDown("slow");
                setTimeout(function(){close_message_success();},3000);
            }
        });
    });
});
</script>

对于表单，这是我的html

<form class="form-horizontal row-fluid" id="insert_open" name="insert_open" method="post" enctype="multipart/form-data" >

                                <div class="form-horizontal row-fluid">
                                    <div class="control-group">
                                        <label class="control-label" for="basicinput"></label>
                                        <div class="controls">
                                            <button class="btn btn-primary" type="submit">Insert all Open has the same id_list</button>
                                        </div>
                                    </div>

                                </div>
                                </form>

Answer 4

您的代码中有多个错字。此行，例如：

data: $('#photo').serialize(),

引用表单中的此元素（且仅此元素）：

<input 
    type="file" 
    class="form-control-file form-control-sm form-group small" 
    name='photo' 
    id="photo" 
    multiple="multiple" />

因为这是ID为photo的元素。因此，您的AJAX调用仅序列化该字段的信息。表单的ID为foto，因此，如果要发送整个表单，则必须将该代码行更改为：

data: $('#foto').serialize(),

此外，这一行：

$('#savephoto').modal('hide');

不会执行任何操作，因为表单中的任何地方都没有具有savephoto ID的元素。模态的ID实际上是registerphoto，这是您需要使用的ID才能关闭模态：

$('#registerphoto').modal('hide');

进行这些更改，然后重试。

Answer 5

您需要将id属性放置到要发布到PHP文件的元素中，并获取其值。假设您需要获取photoDescription textarea的值。首先，您将提供一个id属性而不是name属性。所以会像这样：

<textarea id="photoDescription"></textarea>

然后将textarea的值存储到JS变量中。

var photoDescription = $('#photoDescription').val();

之后，将所有需要的值放入photovisit.php

data: photoDescription,

此外，在photovisit.php中（它将接收来自ajax的值），您需要使用$ _POST方法进行调用。

$photoDescription = $_POST['photoDescription']; //

POST变量的索引应与您的AJAX调用“ data：”中的索引相同。希望对您有所帮助。祝好运！编码愉快。

如何获取引导模态的数据并发送PHP

5 个答案: