3

jquery get() メソッドを使用して、Web ページのフォーム データを送信しようとしています。しかし、フォームを送信すると、サーバーに送信されたフィールドデータはごくわずかです。

形：

  <form class="form-horizontal" id="addpost" method="GET" action="">
        <div class="control-group">
            <label class="control-label" for="form-field">Post Title</label>
            <div class="controls">
                <input type="text" id="form-field" placeholder="Post Title" name="Post-title" value="" />
             </div>
         </div>
         <div class="control-group">
         <label class="control-label" for="form-field-11">Content Here</label>
            <div class="controls">
            <textarea name="post-content"  value="" class="autosize-transition span12" id="form-field-11" style="overflow: hidden; word-wrap: break-word; resize: horizontal; height: 67px;"></textarea>
            </div>
           </div><!-- Insert Image Code -->
           <div class="control-group">
            <div class="widget-main">
                <div class="controls">
                    <div class="ace-file-input">
                        <input id="id-input-file-2" type="file">
                        <a class="remove" href="#"></a>
                    </div>
                 </div>
                 <div class="controls">
                    <div class="ace-file-input ace-file-multiple">
                        <input id="id-input-file-3" type="file" multiple="">
                        <a class="remove" href="#">
                        <i class="icon-remove"></i>
                        </a>
                    </div>
                    <label>
                    <input id="id-file-format" type="checkbox" name="file-format">
                        <span class="lbl"> Allow only images</span>
                    </label>
                </div>
              </div>
             </div><!-- Insert Image Code -->
            <div class="space-4"></div>
            <div class="control-group">
                <label class="control-label" for="form-field-tags">Tag input</label>
                <div class="controls">
                    <input id="form-field-tags" type="hidden" placeholder="Enter tags ..." value="Tag Input Control" name="tags">
                </div>
            </div>

            <div class="space-4"></div>
            <div class="control-group">
                <label class="control-label" for="form-field-select-3">Select Category</label>
                <div class="controls">
                <label for="form-field-select-3">Chosen</label>
                <select class="chzn-select" id="form-field-select-3" data-placeholder="Choose a Category...">
                <option value="">
                </option><option value="Blog">Blog
                </option><option value="News Letter">News Letter
                </option></select>
             </div>
           </div>

     <div class="control-group" style="float:left; margin-right:25px">
        <div class="controls"><button type="submit" class="btn btn-info">
        <i class="icon-ok bigger-110"></i>
        <input type="submit" value="" id="posubmit" style="opacity:0"/>Submit</button>
        <button type="reset" class="btn"><i class="icon-undo bigger-110"></i>Reset</button>
        </div>
     </div> 
     <div id="resp" style="float:left; margin-top:5px">
        <img id="loading" style="visibility:hidden;" src="assets/img/ajax-load.gif" width="16" height="16" alt="loading" />
      </div>
     </form>

Javaスクリプト:

 $('#addpost').submit(function(e){ 
 if(use_ajax)
        {
            $('#loading').css('visibility','visible');
            $.get('test.php',$(this).serialize(),

                function(data){
                    if(parseInt(data)==-1)
                        $.validationEngine.buildPrompt("#resp","* Please ensure all fields are filled.","error");

                    else
                    {
                        $("#resp").show('slow').after('<p id="resp-mes" style=" color:#000000; text-decoration: bold;">Success....</p>');
                    }

                    $('#loading').css('visibility','hidden');
                     setTimeout( "jQuery('#resp').hide('slow');",3000 );
                     setTimeout( "jQuery('#resp-mes').hide('slow');",5000 );
                    });
        }
        e.preventDefault();
}
 )};

この 3 つのフィールド値のみがサーバーに送信されます。それがポストタイトル、ポストコンテンツ、タグです。なぜこれが起こるのかわかりません。どんな助けでも大歓迎です。

4

4 に答える 4

4

あなたには2つの問題があります。

  1. Ajax とシリアライズのアップロードは、ファイルのアップロードでは機能しません。(非同期アップロードについては、この質問と回答をお読みください)

  2. jquery フォームのシリアル化には name 属性が必要です。選択ボックス ( form-field-select-3) に name 属性がありません。

以下はjqueryシリアライズのドキュメントページのメモです -

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

于 2013-10-15T09:27:40.030 に答える
4

select要素で「name」属性を見逃しているためです

<select class="chzn-select" id="form-field-select-3" name="form-field-select-3" data-placeholder="Choose a Category...">

私はローカルでチェックインしましたが、これは正常に機能しています。

確認して、問題があればお知らせください。

ありがとう

于 2013-10-15T09:32:15.637 に答える
1

このフォーム全体のうち、4 つすべてが 0 よりも高いインデックスから入力/選択されている場合、4 つの要素のみが送信されます。
これらの名前を持つもの。
「tags」
「file-format」
「post-content」
「Post-title」

これは、name 属性が定義されているタグはこれらだけであるためです。
サーバーに投稿したいすべての要素に、それらにアクセスするために使用したい投稿インデックスを持つ name 属性を与えてください。

于 2013-10-15T09:31:31.693 に答える