1

次のコードがあります。ユーザーがドロップダウンから[その他]を選択すると、フォームにフィールドが追加されます。ただし、このコードを使用すると、ドロップダウンの値が上書きされるため、フォームが投稿されたときに$_POST['enquiry_source']空になります。

「その他」が選択されている場合だけでなく、ドロップダウンの変更時にフィールドを追加する際に問題が発生する原因となっているこの行に絞り込みました-

$(field_to_append).insertAfter('#form-field-enquiry_source');

私も試しまし$('#form-field-enquiry_source').after(field_to_append);たが、結果は同じでした。

$(function(){

    /** Looks for changes to the enquiry source dropdown */ 
    $('#form-field-select-enquiry_source').live('change', function(){

        /** Check the enquiry source */
        var enquiry_source = $('select[name="enquiry_source"]').val();      

        /**
         * Adds another field to the enquires form when the user selects 'Other' form the enquiry source dropdown
         */
        if(enquiry_source === 'other'){ // The user has selected other as the enquiry source, so lock the form

            var field_to_append = '<div id="form-field-enquiry_source_other" class="form-field float-left">'+
                '<label>Other<span class="required"></span></label>'+
                '<input name="enquiry_source" id="form-field-input-enquiry_source_other" />'+
                '</div>';

            $(field_to_append).insertAfter('#form-field-enquiry_source');

        } else {

            $('#form-field-enquiry_source_other').remove();

        }

    });

});

この問題の原因は何ですか?

4

3 に答える 3

1

中に挿入していますか?次のようなHTMLコードを生成しているように聞こえます

<form>something</form><input name=enquiry_source>

たぶんあなたが欲しいのは$('#form-field-enquiry_source')。append($(field_to_append));です。

「#form-field-enquiry_source」とは何かわかりません。フォームですか?

于 2012-03-28T14:55:05.297 に答える
1

select withがname = enquiry_sourceあり、同じ名前の入力を広告する場合、サーバーに投稿される要素は1つだけです。この場合、入力フィールド(後者の要素のみが投稿される)なので、フィールドに別の名前を付ける必要があります。

        var field_to_append = '<div id="form-field-enquiry_source_other" class="form-field float-left">'+
            '<label>Other<span class="required"></span></label>'+
            '<input name="enquiry_source_other" id="form-field-input-enquiry_source_other" />'+
            '</div>';
于 2012-03-28T14:55:44.210 に答える
1

私はこれが少し話題から外れているように見えるかもしれないことを知っています(しかし、ある種はそうではありません)。それらのコンテンツがすでに含まれている非表示のdivを使用することでアプローチを変更できます。問題は、フィールドに応じてドロップダウンを表示/非表示にすることです。

これの良いところは、長い文字列を縮小できないというjavascriptの縮小です。このようにすることで、より多くのスペースを節約できます。

if(enquiry_source === 'other'){ // The user has selected other as the enquiry source, so lock the form
        $("#enquiry_source_other").show();
    } else {
        $("#enquiry_source_other").hide();
    }

このアプローチは少し単純なように感じます

于 2012-03-28T14:56:19.260 に答える