2

背景: jQuery mobile phonegap build multipage-ajaxload sisyphus 対応フォームと GUI データベースへの ajax POST ループ。171 のセクション投稿と、別のテーブルへの 1 つの要約投稿があります。(このデータはおそらく、バックエンドがロジックを処理する 1 つの投稿である必要があります。残念ながら、バックエンドでこれを修正するためのアクセス権や時間がありません)。約 80% の確率で、この関数は 171 の意図したセクション (および 1 つの要約投稿) を投稿します。ただし、20% の確率で 6 件の重複投稿があり、合計 177 件の投稿があります。async:false を試してみましたが、パフォーマンスが大幅に低下しました。

およそ 20% の確率で 6 つのランダムな重複投稿があるのはなぜですか? スキップされた投稿や重複した投稿がないように、この ajax 投稿ループを修正する最良の方法は何ですか?

HTML 送信セクション:

<form id="submit_section" encoding="multipart/form-data" encType="multipart/form-data">
    <br>
    <input type=hidden name=fform value=1>
    <input type="hidden" name="_fid_40" id="_fid_40" value="" />
    <input type="hidden" name="_fid_48" id="_fid_48" value="" />
    <input type="hidden" name="_fid_6" id="uniquetoktok" value="" />
    <input type="hidden" name="sentstatus" id="sentstatus" value="" />
    <input type="text" placeholder="ID" required name="_fid_8" id="thisId" />
    <input type="hidden" required name="_fid_7" required />
    <input type="text" placeholder="Your First & Last Name" required name="_fid_7" disabled="disabled"/>
    <ul id="suggestions" data-role="listview" data-inset="true"></ul>
    <input name="_fid_41" id="_fid_41" type="hidden" required>
    <div class="custom-select">
        <select name="_fid_41" type="text" required disabled="disabled">
        <option value=""></option>
        <option value="locationOne">locationOne</option>
        <option value="locationTwo">locationTwo</option>
        <option value="locationThree">locationThree</option>
        <option value="locationFour">locationFour</option>
        <option value="locationFive">locationFive</option>
        </select>
    </div>
    <div id="notyetsent">
        <a href="" class="senderbutton" data-theme="c" data-role="button">Submit Site Walk</a>
    </div>
    <div id="alreadysent">
        <span style="color:red;"><center>* This form has already been sent.</center></span><br>
        <a data-icon="plus" data-role="button" data-theme="b" href="#" class="photobutton" id="morephotos" rel="external">Add Photos</a>
    </div>
</form>

HTML フォーム形式:

<form id="check-2" encoding="multipart/form-data" encType="multipart/form-data">
    <div class="sendsendsend">
        <h4 style="display:none;">C1:</h4>
        <input type="hidden" name="_fid_14_C1" />
        <textarea style="display:none;" name="_fid_15_C1" /></textarea>
    </div>
    <div class="sendsendsend">
        <h4 style="display:none;">C2:</h4>
        <input type="hidden" name="_fid_14_C2" />
        <textarea style="display:none;" name="_fid_15_C2" /></textarea>
    </div>
    <div class="sendsendsend">
        <h4 style="display:none;">C3:</h4>
    <input type="hidden" name="_fid_14_C3" />
    <textarea style="display:none;" name="_fid_15_C3" /></textarea>
    </div>
</form>   ...  168 more '.sendsendsends'  ...

jQuery Ajax 171ポストループ:

var totalRequests = 0;
var totalSuccess = 0;
var totalError = 0;

// Serialize #submit_section data and set to var formData to inject in sendsendsend loop
var formData = $('#submit_section').find("input, select").serialize();

// Posts each .sendsendsend divs (171 in total)
$('.sendsendsend').each(function() {
    var taskOrderData = $(this).find("input, textarea").serialize();
    var h4String = $(this).children('h4').html();
    var colonPosition = h4String.indexOf(':');
    var taskOrderId = h4String.substr(0, colonPosition);
    var postData = taskOrderData + '&' + formData + '&_fid_25=' + taskOrderId;
        $.ajax({
            type: 'POST',
            url: 'url',
            data: postData
        }).done(function(data, textStatus, jqXHR) {
            totalSuccess++;
        }).fail(function(jqXHR, textStatus, errorThrown) {
            totalError++;
        }).always(function(a, textStatus, b) {
            totalRequests++;
            if (totalRequests >= 171) {
                if (totalError >= 1) {
                    $("#sentstatus").val("failed");
                    $.mobile.changePage('#failpop', {
                        transition: 'pop',
                        role: 'dialog'
                    })
                }
                if (totalSuccess >= 171) {
                    summaryPost();
                }
            }
        });
        function summaryPost() {
            $.ajax({
            type: 'POST',
            url: 'url',
            data: formData
        }).done(function(data, textStatus, jqXHR) {
            totalSuccess++;
        }).fail(function(jqXHR, textStatus, errorThrown) {
            totalError++;
        }).always(function(a, textStatus, b) {
            totalRequests++;
            if (totalRequests >= 172) {
                if (totalError >= 1) {
                    $('.senderbutton').show();
                    $("#sentstatus").val("failed");
                    $.mobile.changePage('#failpop', {
                        transition: 'pop',
                        role: 'dialog'
                    })
                };
                    if (totalSuccess >= 172) {
                    $("#sentstatus").val("yes");
                    $.mobile.changePage('#successpop', {
                    transition: 'pop',
                    role: 'dialog'
                    });
                };
            };
        });
    };
})

この問題をモバイル デバイスで再現しようとするだけでも困難です。どんなアドバイスや提案も素晴らしいでしょう！

編集：「Submit_Section」を含めるのを忘れました

4

1 に答える 1

0

HTML フォームをラップする明らかに無関係なコードが、この動作を刺激している可能性があります。

特に、SRC または URL の値が空の場合、複数のページ リクエストが発生する可能性があります。これが事実であるかどうかを確認する簡単な方法の 1 つは、これらの誤った値のいずれかを持つ要素をコードに意図的に追加し、複数の投稿の発生率が増加するかどうかを確認することです。

これは、CSS 定義でこれらの値が不適切に設定されていることによっても発生する可能性があります。

これは一部のブラウザの仕様です。明示的に要求する 1 つの要求と、それらの空の値を解決しようとするプロセスの一部としてブラウザー自体が開始する別の要求があります。

私は、従来の ASP アプリケーション スタックでしばらく前にこれに悩まされ、結果を要求/ページングするときに奇妙に混沌とした動作が発生しました。

于 2014-04-14T00:23:35.103 に答える