4

HTML仕様では、フォーム内のボタンをクリックすると値が渡され、「クリックされていない」ボタンは渡されないと記載されていると思いました。チェックボックスのように...私は常にボタンの値をチェックし、送信に使用されたボタンに応じて異なる処理を行うことがあります..

AJAX (具体的には jquery) を使用してフォーム データを送信し始めましたが、ボタン データは決して渡されません。不足しているものはありますか? そのデータを渡すためにできることはありますか？

簡単なコードは次のようになります

<form id="frmPost" method="post" action="page.php" class="bbForm" >
<input type="text" name="heading" id="heading" />   
<input type="submit" name="btnA" value="Process It!" />
<input type="submit" name="btnB" value="Re-rout it somewhere Else!" />
</form>
<script>
$( function() { //once the doc has loaded   
//handle the forms
$( '.bbForm' ).live( 'submit', function() { // catch the form's submit event
    $.ajax({ // create an AJAX call...
        data: $( this ).serialize(), // get the form data
        type: $( this ).attr( 'method' ), // GET or POST
        url:  $( this ).attr( 'action' ), // the file to call
        success: function( response ) { // on success..
            $('#ui-tabs-1').html( response );   
        }           
    });
    return false; // cancel original event to prevent form submitting
});
});
</script>

処理中のページ - 「見出し」フィールドのみが表示され、どちらをクリックしても btnA または btnB は表示されません...

「修正」できない場合、Ajax呼び出しが「標準」フォームの動作に従わない理由を誰かが説明できますか?

どうも

4

2 に答える 2

3

これは興味深い問題であることがわかったので、jquery のソース コードと API のドキュメントを少し掘り下げてみようと思いました。

私の調査結果:

あなたの問題はajax呼び出しとは何の関係もなく、$.serialize()関数とはすべて関係があります。返すようにコーディングされていない<input type="submit">か、<button type="submit">両方を試しました。シリアル化されるフォーム内の要素のセットに対して実行される正規表現があり、残念ながら送信ボタンを任意に除外します。

jQuery ソース コード (デバッグ目的で変更しましたが、意味的にはすべてそのままです):

serialize: function() {
    var data = jQuery.param( this.serializeArray() );
            return data;
},

serializeArray: function() {
   var elementMap = this.map(function(){
        return this.elements ? jQuery.makeArray( this.elements ) : this;
    });

   var filtered = elementMap.filter(function(){
                    var regexTest1= rselectTextarea.test( this.nodeName );
                    var regexTest2 = rinput.test( this.type ); //input submit will fail here thus never serialized as part of the form
        var output = this.name && !this.disabled &&
            ( this.checked || regexTest2|| regexTest2);
                    return output;
    });

    var output = filtered.map(function( i, elem ){
        var val = jQuery( this ).val();

        return val == null ?
            null :
            jQuery.isArray( val ) ?
                jQuery.map( val, function( val, i ){
                    return { name: elem.name, value: val.replace( rCRLF, "\r\n" ) };
                }) :
                { name: elem.name, value: val.replace( rCRLF, "\r\n" ) };
    }).get();
    return output;
}

jQuery のドキュメントを調べると、期待どおりに動作するためのすべての要件を満たしています (http://api.jquery.com/serialize/)。

注: 「成功したコントロール」のみが文字列にシリアル化されます。フォームはボタンを使用して送信されていないため、送信ボタンの値はシリアル化されません。シリアル化された文字列にフォーム要素の値を含めるには、要素に name 属性が必要です。チェックボックスとラジオ ボタン (「ラジオ」または「チェックボックス」タイプの入力) からの値は、それらがチェックされている場合にのみ含まれます。ファイル選択要素からのデータはシリアル化されません。

「成功したコントロール リンクは W3 仕様に分岐し、仕様で期待される動作を確実に釘付けにしました。

短い不自由な答え: 壊れていると思います! バグ修正の報告!!!

于 2012-07-31T06:54:45.423 に答える
0

私はこれでかなり珍しい問題に遭遇しました。私はプロジェクトに取り組んでおり、2 つの個別の php ページがあり、1 つは php コードとは別のページに html があり、もう 1 つは php コード内から html をエコーし​​ています。別のhtmlコードを持つもので.serializeを使用すると、正しく機能します。別のphpページへのajax呼び出しで送信ボタンの値を送信します。しかし、phpスクリプトからhtmlがエコーされたものでは、同じことを試みて、まったく異なる結果を得ようとしました。フォーム内の他のすべての情報を送信しますが、送信ボタンの値は送信しません。「削除」または「更新」を押したかどうかに関係なく、送信するだけです。私' 私は助けを求めていません (別の人の投稿で助けを求める規則に違反しています) が、この情報は故障が発生している場所を把握するのに役立つと思いました. 解決策を探しており、何かわかったらここに投稿します。

于 2013-06-19T20:12:39.107 に答える