使用PHP循环文件上载表单

时间:2016-12-04 22:23:29

标签: javascript php jquery html

我目前正在使用jquery小册子Moleskine Notebook with jQuery Booklet来制作日志,其中包含要为每个页面上传的一些图像。 我正在做的是我循环PHP中每个页面的div作为我从数据库调用数据,但当我尝试使用文件上传表格如下,它只适用于第一页上。上传按钮出现在每个其他页面上,但它什么也没做,甚至没有调用上传窗口。

每个页面都有自己的log_id $row['log_id']

因此非常感谢任何解决方案。

if (mysqli_multi_query($conn, $sql)) {
 do {
  if ($result = mysqli_store_result($conn)) {
    while ($row = mysqli_fetch_array($result)){

echo '<div>';
echo '    <form method="post" name="upload_form" id="upload_form" enctype="multipart/form-data" action="php/multiple_upload.php">';
echo '      <input type="hidden" name="form_submit" value="1"/>';
echo '      <input type="file" class="hidden" name="images[]" id="upload-images" multiple >';
echo '      <input name="log_id" type="hidden" value="'.$row['log_id'].'">' ;
echo '    </form>'; 
echo '</div>' ; 
            }
        mysqli_free_result($result);
        }   
    } while (mysqli_next_result($conn));
}

这里是调用表单的脚本

$(document).ready(function(){
$('#upload-images').on('change',function(){
    $('#upload_form').ajaxForm({
        beforeSubmit:function(e){
            $('.progress').show();
        },
        success:function(e){
            $('.progress').hide();

                location.reload(true);              
        },
        error:function(e){

            }
        }).submit();
    });
});

1 个答案:

答案 0 :(得分:2)

如果您使用的是身份$('#upload_form').ajaxForm({***});。这只会查找并定位第一个#upload_form

如果您正在使用$('.upload_form').ajaxForm({***});之类的课程。这将找到并定位all表单类.upload_form

您需要定义您正在寻找的form。在这种情况下,您只需找到.upload-images表单的最近/父亲。如下所示。

这样做。

$(document).ready(function(){
$('.upload-images').on('change',function(){
    $(this).closest('form').ajaxForm({ // target the parent form
        beforeSubmit:function(e){
            $('.progress').show();
        },
        success:function(e){
            $('.progress').hide();

                location.reload(true);              
        },
        error:function(e){

            }
        }).submit();
    });
});