Freitag, Juni 5, 2020

jquery ajax post-Datei , mehrere Dateien und text-input

Hallo Jungs mein html-code :

<form action="post.php" enctype="multipart/form-data" method="post">
   <input type="text" name="name" id=""><br>
   <input type="file" name="poster" id="poster"><br>
   <input type="file" name="scene[]" id="scene" multiple><br>
   <input type="submit" value="POST">
</form>

als Sie eine einzelne Datei, mehrere Dateien, und ich habe einen text Wert. Dieser Wert ‚ajax‘ mit wollen zu einem Zeitpunkt zu senden. ‚JQuery‘, die ich verwende.

Ich kann nicht in irgendeiner Weise

$(function(){
        $('input[type="submit"]').click(function(e){
            e.preventDefault();
            var file_data = $('#poster').prop('files')[0];
            var form = $('form').serialize();
            var form_data = new FormData();
            $.each($('input[name="scene[]"]'),function(i, obj) {
                $.each(obj.files,function(j,file){
                    form_data.append('photo['+i+']', file);
                    })
                });
            form_data.append(form);
            form_data.append('file',file_data);
            alert(form_data);
            $.ajax({
                url:'post.php',
                cache:false,
                contentType:false,
                processData:false,
                async:false,
                data:form_data,
                type:'post',
                success:function(answ){
                    $('#result').html(answ);
                }
            })
        })
    })

Sah ich auf andere, ähnliche Lösungen, aber es hat mein problem nicht beheben
und vität mein schlechtes Englisch .

InformationsquelleAutor vulkan | 2016-07-14

1 Kommentar

  1. 5

    Die Sie nicht brauchen, um dies manuell zu tun; wenn Sie nur den form als DOMElement um die FormData Konstruktor dann alle Formular-Werte werden automatisch für Sie.

    Beachten Sie auch, dass Sie sollten die Haken in die submit – Ereignis des Formulars, nicht die click – Ereignis der Schaltfläche Einreichen. Sollten Sie auch entfernen, die Verwendung von async: false als es ist unglaublich schlecht, die Praxis zu verwenden.

    Mit all das gesagt ist, versuchen Sie dies:

    $('form').submit(function(e){
        e.preventDefault();
        var form_data = new FormData(this); 
    
        $.ajax({
            type: 'post',
            url: 'post.php',
            data: form_data,
            cache: false,
            contentType: false,
            processData: false,
            success: function(answ){
                $('#result').html(answ);
            }
        })
    })
    • ty sehr viel . new FormData(this); habe ich nicht daran zu denken. omg
    • Kein problem, gerne helfen. Für Ihre Referenz, hier ist die FormData-Eintrag bei MDN
    • dies schafft form von name-Wert-paar, das die Verwendung der Elemente‘ name-Attribut. Ich bin mit ASP.NET die messes up-Elemente “ Namen für server side controls. Daher verwende ich Elemente‘ IDs zu konstruieren, die name-Wert-Paaren mit einer serialize-Funktion (Schleife durch alle Formular-Steuerelemente, die von id). Gibt es eine Möglichkeit, die ich serialisieren können für text-Steuerelemente und fügen Sie der Datei Daten zu den formdata? Ich bin OK, es manuell zu tun, wie der OP versucht hatte, Sie zu tun. Vielen Dank im Voraus!

Kostenlose Online-Tests