在模式/对话框中使用fileupload脚本

时间:2017-01-03 16:03:21

标签: jquery file-upload jquery-file-upload alertifyjs

我想在文档加载后创建的模式/对话框中使用我的文件上传脚本。

我还使用alertify库来获得更好的对话框。

这是我的代码:

1 - 我的alertify脚本(profile.js)创建表单:

 $("#profil").click(function () {
    alertify.minimalDialog || alertify.dialog('minimalDialog', function () {
        return {
            main: function (content) {
                this.setContent(content);
                this.set('resizable',true).resizeTo('80%','50%');
                this.set('title',"Changer votre photo de profil");
            }
        };
    });
    alertify.minimalDialog('<form id="formupload" method="POST"><p><img id="imagepreview" class="id_img" width="auto" height="60px" src="../../images/profils/min/3266.jpg"></p> <p class="label-w100"><input id="fileupload" type="file" name="files[]" accept="image/gif, image/jpg, image/jpeg, image/png"/><div id="progress"><div class="bar" style="width: 0%;"></div></div></p><p id="chargementimage"></p><div class="grand-trait"></div><p class="center"><input id="submit" type="submit" value="Envoyer" class="envoyer"/></p></form>');
})

2 - 我的脚本允许将图像加载到临时文件夹

$(document).on("change", "#fileupload",  function(){
    var url = window.location.hostname + "/json/ec-informations/upload_img2.php";
    alert(url);
    $('#fileupload').fileupload({
        dataType: 'json',
        url: url,
        maxChunkSize: 1000000,
        maxFileSize: 5000000,
        formData: {'csrf': 'csrf'},

        done: function (e, data) {
            fichier = "";
            $.each(data.result.files, function (index, file) {
                $('#progress').after(file.name).appendTo(document.body);
                fichier = file.name;
                $("input[name=img_tmp]").val(fichier);
                $('#progress').appendTo('#chargementimage');
                $('#chargementimage').after('Image correctement chargée, finalisez votre proposition en appuyant sur Envoyer.');
                $('#imagepreview').attr('src', '' + fichier);
                if (file.error) {
                    alert(file.error);
                    location.reload();
                }
            });
            if (data.erreur == 'Filetype not allowed') {
                alert('Le format de fichier est mauvais');
            }
        },
        progressall: function (e, data) {
            var progress = parseInt(data.loaded / data.total * 100, 10);
            $('#progress .bar').css(
                'width',
                progress + '%'
            );
        }
    });

});

我的问题是,当我选择图像时,我没有成功在upload_img2.php中添加信息。

通常,我对uploadfile没有任何问题,因为我的表单是之前创建的,但不是在这里。

我希望我已经清楚了,谢谢你的帮助!

0 个答案:

没有答案