Question

我正在使用ajax上传图片。由于我有table列出记录，因此有多行，除了第一行的ID之外我无法添加图像。我可能必须给我的函数一个参数，但我无法弄清楚如何将它实现到ajax部分。

我想要做的是在上传图片时将thing_id值发布到我的php表单。

我更新了这个问题，请参阅详细信息。

以下是我激活模态的方法。

<a class="btn btn-warning btn-sm" data-toggle="modal" 
data-target="#image-edit<?php echo $row['thing_id']; ?>"><span
class="glyphicon glyphicon-camera" aria-hidden="true"></span></a>

我的模态（你想要更多细节，所以我发布了整个模态。

<div class="modal fade" id="image-edit<?php echo $row['thing_id']; ?>" tabindex="-1" role="dialog"
     aria-labelledby="myModalLabel<?php echo $row['thing_id']; ?>" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                      aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel<?php echo $row['thing_id']; ?>">Add Photos</h4>
            </div>
            <div class="modal-body">
                <!-- image upload area start-->
                <div class="addabook">
                    <div class="new-entry-main">
                        <form enctype="multipart/form-data" class="myform">
                            <div class="bookcoverdiv">
                                <p>Book Cover</p>
                                <input type="file" name="images[]" id="<?php echo $row['thing_id']; ?>" multiple>
                                <input type="hidden" id="secret<?php echo $row['thing_id']; ?>" name="thing_id" value="<?php echo $row['thing_id']; ?>">
                                <button type="button" onclick="imageupload(<?php echo $row['thing_id']; ?>)" value="<?php echo $row['thing_id']; ?>" class="uploadimages btn btn-primary">Save changes
                                </button>
                            </div>
                        </form>
                        <hr>
                        <div class="content_here_please"></div>
                    </div>
                </div>
                <?php // I list previously uploaded images here. They appear, so my modal works. ?>
            </div>
            <br/>
        </div>
    </div>
</div>

的jQuery

        function imageupload(thing_id) {
        var form = new FormData($('.myform')[0]);
        form.append('thing_id', thing_id);
        // Make the ajax call
        $.ajax({
            url: 'uploadimages.php',
            type: 'POST',
            xhr: function () {
                var myXhr = $.ajaxSettings.xhr();
                if (myXhr.upload) {
                    myXhr.upload.addEventListener('progress', progress, false);
                }
                return myXhr;
            },
            //add beforesend handler to validate or something
            //beforeSend: functionname,
            success: function (res) {
                $('.content_here_please').html(res);
            },
            //add error handler for when a error occurs if you want!
            //error: errorfunction,
            data: form,
            cache: false,
            contentType: false,
            processData: false
        });
    }

PHP

$get_id = $_POST['thing_id'];
echo $get_id; // it echoes the id number of the record when I click the anchor, but there is something weird. I list 10 records each page. If I try to make a change on the 2nd or 3rd record, all modals show $get_id value.

证明：

Answer 1

您可以将传递给imageupload的数据附加到FormData对象，如下所示。（使用原始按钮点击代码）

function imageupload(thing_id) {
    var form = new FormData($('.myform')[0]);
    form.append('thing_id', thing_id);
    ...

Answer 2

一种方法是在表单上插入包含所需ID的隐藏字段。

例如，

<form id="myForm">
...other fields
   <input type="hidden" name="thing_id" value="<?php echo $row['thing_id']; ?>">
</form>

然后在服务器端，您可以使用ID“thing_id”访问变量，因为您在AJAX调用时将表单发送到服务器。

Answer 3

使用ajax中的data属性将数据传递给php页面，在php页面中你可以传递数据$ _GET ['name']，查看下面的例子

$.ajax({
method: "POST",
url: "some.php",
data: { name: "John", location: "Boston" }
})
.done(function( msg ) {
 alert( "Data Saved: " + msg );
});

Answer 4

在你的函数中添加额外的变量

function imageupload() {

var form = new FormData($('.myform')[0]);
var thing_id = "<?php echo $row['thing_id']; ?>";

// Make the ajax call
$.ajax({

然后在ajax中使用

 // Make the ajax call
$.ajax({
    url: 'uploadimages.php',
    type: 'POST',
    data : {thing_id:thing_id }, //first thing_id will go to php as $_POST['thing_id']; the second one is thing_id from the code above
    xhr: function () {
        var myXhr = $.ajaxSettings.xhr();

使用AJAX将html输入值传递给PHP

4 个答案: