html - ファイルを次々と送信するAjaxフォーム

Question

ajaxで送信するフォームがあります。このフォームには x 個の入力ファイルがあり、それぞれに 2 つの入力テキストがあります。

フォームを送信すると、すべてのファイルが同時に送信されます。

だから私がやりたいのは、彼の2つの入力テキストで一度に1つのファイルを送信することです。

私のコードがあります：

HTML

<div id="img_upload">
<form action="#" id="form" method="POST" enctype="multipart/form-data">
    <div id="img_upload_head">
        <?php
            require MODULE.DS."galerie".DS."traitement".DS."galerie".DS."recup.php";
        ?>
        <label for="nbImg">Selectionner le nombre d'image que vous voulez inserrer : </label>
        <select name="nbImg">
            <?php  $nb = 10;
                  for ($i= 0; $i<=$nb; $i++){
                    ?>
                        <option name="<?php echo $i;?>"><?php echo $i;?></option>
                    <?php
                  }             
            ?>
        </select>
    </div>
    <div id="img_upload_content">
        <div id="content_head">
            <div class="title_name">Selection fichier</div>
            <div class="title_desc">Description</div>
            <div class="title_price">Prix</div>
            <div class="title_error">status</div>
        </div>      
        <div id="content_list">

        </div>
    </div>
    <div id="img_upload_foot">

        <input type="submit" name="send" value="send" id="send" />


    </div>
</form>

js

$(document).ready(function(){
    $("select[name=nbImg]").hide();
    $("#send").hide();
    $("select[name=gal]").change(function(){

        var galSelect = $(this).val();
        if (galSelect != "none"){
            $("select[name=nbImg]").fadeIn("fast");
            $("select[name=nbImg]").change(function(){

                var selfElem = $(this);

                var nbImg = selfElem.val();

                $("#content_list").empty();



                for (var i = 1; i <= nbImg ; i++){
                    $("#content_list").append("<p id=\"file#"+i+"\"><span class=\"name\"><input type=\"file\" name=\"img[]\"id=\"img\" /></span><span class=\"desc\"><input type=\"text\" id=\"desc\" name=\"desc\" /></span><span class=\"price\"><input type=\"text\" id=\"price\" name=\"price\" /></span><span class=\"error\"></span></p>");
                }

                $("#send").fadeIn("fast");

                $("#send").click(function(e){
                    e.preventDefault();
                    var form    =   $(this).parents("form");
                    var p       =   form.find("p");


                    var action = "/module/galerie/traitement/traitimg.php";
                    var desc = form.find("input[name=desc]").val();
                    var gal = $("select[name=gal]").val();
                    var price = form.find("input[name=price]").val();

                    var formData = new FormData();

                    jQuery.each($(p).find('input[name^="img"]')[0].files, function(i, file) {
                        formData.append('img-'+i, file);
                        formData.append('desc', desc);
                        formData.append('price', price);
                        formData.append('gal', gal);
                        jQuery.ajax({
                            url :action,
                            type : "POST",
                            processData: false,
                            contentType: false,
                            data: formData,
                            success: function(formData){

                            }
                        });

                    });


                    return false;

                });



            });
        }else{$("select[name=nbImg]").fadeOut("fast");}
    });

それが可能かどうかはよくわかりません。

とにかく、あなたが私に提供できる助けをありがとう

編集

だから私はこれを試しました

for (var i = 1; i <= nbImg; i++){
                        jQuery.each($(p).find('input[name^="img"]')[0].files, function(i, file) {
                            var formData = new FormData();
                            formData.append('img-'+i, file);
                            formData.append('desc', desc);
                            formData.append('price', price);
                            formData.append('gal', gal);
                            jQuery.ajax({
                                beforeSend : function(){
                                    $(".error").empty().append("<img src=\"/media/design/img/loader.gif\"/>");
                                },
                                url :action,
                                type : "POST",
                                processData: false,
                                contentType: false,
                                data: formData,
                                success: function(formData){
                                    $(".error").empty().append("<img src=\"/media/design/img/v.png\"/>");
                                }
                            });

                        });
                    }

すべてのファイルを同時に送信しています。「for」ループを削除すると、最初のファイルだけが送信されます

jQuery.each($(p).find('input[name^="img"]')[0].files, function(i, file) {
                            var formData = new FormData();
                            formData.append('img-'+i, file);
                            formData.append('desc', desc);
                            formData.append('price', price);
                            formData.append('gal', gal);
                            jQuery.ajax({
                                beforeSend : function(){
                                    $(".error").empty().append("<img src=\"/media/design/img/loader.gif\"/>");
                                },
                                url :action,
                                type : "POST",
                                processData: false,
                                contentType: false,
                                data: formData,
                                success: function(formData){
                                    $(".error").empty().append("<img src=\"/media/design/img/v.png\"/>");
                                }
                            });

                        });