2

私はこのフォームを持っています:

<form id="imageinputpopup" class=suggestionsubmit style="display: none">
    <span>Add a thing!</span><br/>
    <label>url: </label><input name="imageurl" type="url"><br/>
    <label>file: </label><input name="imagefile" type="file"><br/>
    <input type='hidden' name='schoolid' class="schoolid">
    <input type="submit" value="Submit">
</form>

そしてこのdocument.ready:

<script type="text/javascript">
$(document).ready(function() {

    $('.schoolid').val(get_gmap_value('school_id'));

    $(".allow-submission").live('click', function(){
        if($(this).attr('inputtype')=="colorpicker"){
            .....
        } else if($(this).attr('inputtype')=="image"){
            remove_hidden("#imageinputpopup");
            add_fieldname($(this), $("#imageinputpopup"));
            $("#imageinputpopup").dialog();
        } else if($(this).attr('inputtype')=="text"){
            ....
        } else {
            //nothing
        }
    });

    $(".suggestionsubmit").submit(function(){
        event.preventDefault();
        alert($(this).html());
        $(this).ajaxSubmit({
            url: '/save-school-suggestion/',
            type: 'post',
            success: function(response){
                response = jQuery.parseJSON(response);
                // Check for login redirect.
//                if ( response.requireLogin ) {
//                    alert('Sign up or log in to save your answer');
//                } else {
                    $('.suggestionsubmit').dialog('close');
//                }
            }
        });
    });
});

    function add_fieldname(element, addto){
        var elementname = document.createElement('input');
        elementname.type = 'hidden';
        elementname.name = 'fieldname';
        elementname.value = element.attr('fieldname').replace(' ', '_');
        $(elementname).addClass('fieldname');
        addto.append(elementname);
    }

    function remove_hidden(element){
        $(element+' .fieldname').remove();
    }

しかし、ファイルフィールドはサーバー側に表示されていません。

なんで?

私はこれをドキュメントで見つけました:

すべての入力値が投稿されないのはなぜですか?jQueryフォームのシリアル化は、HTML仕様に厳密に準拠しています。成功したコントロールのみが提出に有効です。

しかし、ファイルコントロールが無効になる理由がわかりません。私のサイトの別の場所に、ほぼ同じで完全に機能する別の送信フォームがあります...

編集:これは機能するもう1つのフォームです(追加のものがいくつかありますが、フォームタグには問題のようなIDがあり、入力タグは同じです)。

<form id="photos-submission-form6">

    <input type="hidden" name="section" value="photos">
    <input type="hidden" name="school" id="photos-submit-school6">


    <div style="margin-bottom: .5em">
            <p style="position: relative; width:80%; font-size: 14px; display: inline" id="photos-anonymity-header6">Post as: null</p>
            <img id="helpicon6" src="/static/img/help-icon.png" style="float: right; cursor: pointer; padding-left:1em;">
            <div id="explanation6" style="display: none; padding:1em; background-color:white; border:2px solid gray; position: absolute;z-index:30; right:5px; top:5px">For more posting options, <a id="profilelink6" href="/profile/">fill out your profile</a></div>
        </div>
    <div id="photos-anonymity-select6" style="margin-bottom: .75em; width:412px" class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"><a class="ui-slider-handle ui-state-default ui-corner-all" href="#" style="left: 100%; "></a></div>
    <input type="hidden" id="photos-anonymity-level6" name="anonymity-level" value="username">
        <span style="line-height: 40px;">
        <label class="photouploadlabel">URL</label><input type="text" name="image-url" style="width: 335px"><br>
        <label class="photouploadlabel">File</label><input type="file" name="image-file" style="width: 335px"><br>
        <label class="photouploadlabel">Caption</label><input type="text" id="image-caption6" name="image-caption" style="width: 335px; color: rgb(128, 128, 128); ">
        </span>


    <div style="height: 30px; margin-top: 1em; width: 413px;">
            <label id="photos-tagsbutton6" style="margin-right: .5em; cursor: pointer; vertical-align: bottom; float:left; line-height: 1.8em;">Tags</label>
        <input id="photos-tagsinput6" style="display: none;" type="text" name="tags">
        <button id="send-photos-suggestion6" disabled="" style="float:right; position: relative; bottom: 7px; right: -4px;" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-disabled ui-state-disabled ui-button-text-only" role="button" aria-disabled="true"><span class="ui-button-text">Post</span></button>
    </div>
    </form>
4

7 に答える 7

0

フォームにenctype="multipart/form-data"属性を追加します。

于 2012-04-26T19:36:43.013 に答える
0

imageurl入力のタイプをからurlに変更してみてくださいtext

から:

<label>url: </label><input name="imageurl" type="url"><br/>

に:

<label>url: </label><input name="imageurl" type="text"><br/>

よくわかりませんが、のtype属性が無効なため、jqueryプラグインがフォームのシリアル化に失敗する可能性がありimage_urlます。

于 2012-05-01T09:09:11.620 に答える
0

フォームタグに--->enctype= "multipart/form-data"を追加するのを忘れただけです。これはあなたを助けるでしょう。

于 2012-05-04T05:34:41.280 に答える
0

これはおそらくそうではありませんが、サーバー側でスペルミスがないことは確かですか?$_FILESの代わりに$_FILEを使用するように?関連するphpも投稿していただけますか?

また、間違いなく問題ではありませんが、次のように入力タグを閉じることをお勧めします。

<input ... />
于 2012-05-04T08:07:07.520 に答える
0

javascriptのバインディングでファイルが認識されないという問題があると思います。

送信トリガーイベントを別のlive()関数にバインドしてみてください

すなわち変更

$(".suggestionsubmit").submit(mooFar(e));

$(".suggestionsubmit").live('submit', mooFar(e));
于 2012-05-08T10:48:39.980 に答える
0

...........ファイルのリクエストで間違った場所を探していました。

サーバー側は次のようになっているはずです。

if not s.url_field and 'imagefile' in request.FILES:
    s.image_field = request.FILES['imagefile']

それ以外の

s.image_field = request.POST.get('imagefile', None)

私の側では完全で完全に失敗します。

于 2012-05-09T00:40:13.657 に答える
-1

テストするファイルが最大ファイルサイズを超えていないことを確認してください。これをHTMLで設定する価値があります。

<input type="hidden" name="MAX_FILE_SIZE" value="500" />

また、display:noneを使用せずにテストすることは、フォームが機能するまでは価値がない可能性があります。どのブラウザでテストしていますか?

于 2012-05-07T04:28:50.263 に答える