Image Upload

[latinum_1982]

Hallo,

Ich möchte das man durch ein Button mehrere (kein Multi) auswählen kann.
Nach der Auswahl wird das Gewählte Foto Angezeigt.
Was auch einwandfrei Funktioniert!
Hier der Code dazu:

    $('.dashboard_select_image').click( function(event){
        var nox = $.now();
        var inputfeld = '<input type="file" name="images" class="file_'+nox+'" id="dashboard_upload_files"  style="display:none;"/>';
        $(inputfeld).appendTo('#selectedfilies').click().change( function(event){
        
            var file = this.files[0];
            var imagefile = file.type;
            var match= ["image/jpeg","image/png","image/jpg"];
            if(!((imagefile==match[0]) || (imagefile==match[1]) || (imagefile==match[2]))){
                $('.file_'+nox).hide();
                // VIELLEICHT SPÄTER BESSER ERROR MELDUNG
                alert('DAS IST KEINE ERLAUBTE DATEI');
            }else{
            
            
                if (!!file.type.match(/image.*/)) {
                        if ( window.FileReader ) {
                            reader = new FileReader();
                            reader.onloadend = function (e) {
                                var vorgabe = '<div style="width: 170px; float: left;"><img src="'+domain+'images/loader/loader.gif" class="uploadimages" id="image_'+nox+'" style="float: left; width: 155px;"></div>';
                                $(vorgabe).appendTo('#selectedfilies').find('#image_'+nox).attr('src', e.target.result);

                                //showUploadedItem(e.target.result, file.fileName);
                                //alert(e.target.result);
                            };
                            reader.readAsDataURL(file);
                        }
                }
            }
        });
    
    
    });

Hier meine Frage:

Wenn ich das Formular an Php sende bekomm ich die Ganten File daten nicht :/

    $('#startUpload').click( function(){

        var formdata = $("#imageForm").serialize();
        var title = $('.input-topic-title').val();
        var topic = $('.public option:selected').attr('value');
    
        if(!topic){
            $('.public').css({'background-color': 'red'});
            return false;
        }else{
            $('.public').css({'background-color': '#ffffff'});
        }
        if(title == ''){
            alert('Du musst ein Einen Betrags Titel Eingeben!');
            return false;
        }
    
        var msg = $('.message-form').val();
        if(msg == ''){
            alert('Du kannst nicht Leeres Posten!');
            return false;
        }
        $('#postingloader').show();
        var publicsetting = $('.publigsetting').find('.public').val();
        //var data = 'public='+publicsetting+'&'+formdata;
            
                var data = new FormData();
                data.append('title', title);
                data.append('public', publicsetting);
                data.append('msg', msg);
                data.append('files',  $('#selectedfilies').find('input:file').val());         

            
            $.ajax({
                url: domain+'request/dashboard.php',
                data: data,
                type: 'POST',
                processData: false,
                contentType: false,
                success: function(request) {
                    alert(request);
                }
        
    });
    return false;

    
    
    });

 

[Parantatatam]

Es wäre wohl sinnvoll, wenn Du uns zeigen würdest, wie Du die Daten auf der Serverseite entgegen nimmst, damit wir Dir sagen können, wo Dein Fehler liegt.

 

[latinum_1982]

Server seitig verarbeite ich die Daten noch nicht

echo '<pre>';
print_R($_POST);
echo '<br>';
print_R($_FILES);
echo '</pre>';

mein fehler liegt hier

data.append('files', $('#selectedfilies').find('input:file').val());

und ich hab keine Ahnung wie ich das anstellen soll :/

 

[Parantatatam]

Dir ist schon bewusst, dass Du die Daten vorher kodieren musst, damit Du sie e.g. mit AJAX verschicken kannst?

 

[latinum_1982]

Ja das weis ich schon

hier wird das Inputfelf erzeugt

var inputfeld = '<input type="file" name="images" class="file_'+nox+'" id="dashboard_upload_files"  style="display:none;"/>';
        $(inputfeld).appendTo('#selectedfilies').click().change( function(event){

hier wird das ausgewählte Foto angezeigt

 var vorgabe = '<div style="width: 170px; float: left;"><img src="'+domain+'images/loader/loader.gif" class="uploadimages" id="image_'+nox+'" style="float: left; width: 155px;"></div>';
                               $(vorgabe).appendTo('#selectedfilies').find('#image_'+nox).attr('src', e.target.result);

hier hier sollten die ganzen daten zum senden an PHP vorbereitet werden

var data = new FormData();
                data.append('title', title);
                data.append('public', publicsetting);
                data.append('msg', msg);
                data.append('files', $('#selectedfilies').find('input:file').val());

und da bei die data.append('files' ... geht das nicht so wie ich will

und ich weil auch das Javascript nicht wirklich meine stärke ist