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>

而这个文件。准备好了:

<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 规范密切相关。只有成功的控件才能提交。

但我不明白为什么我的文件控制无效。我在我的网站的不同位置有另一个提交表单,几乎相同并且运行良好......

编辑:这是另一种有效的表单(它有一些额外的东西,但表单标签只有一个 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-05-04T05:34:41.280 回答
0

我认为您的 javascript 绑定有问题,无法识别您的文件。

尝试将您的提交触发事件与另一个 live() 函数绑定

即改变

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

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

这可能不是这种情况,但确定服务器端没有拼写错误?就像你会使用 $_FILE 而不是 $_FILES?你能发布相关的php吗?

此外,绝对不是问题,但建议关闭您的输入标签,现在像这样:

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

尝试将输入的类型imageurl从更改urltext

从:

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

至:

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

我不确定,但是 jquery 插件可能由于image_url.

于 2012-05-01T09:09:11.620 回答
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 回答
0

将 enctype="multipart/form-data" 属性添加到您的表单中。

于 2012-04-26T19:36:43.013 回答
-1

确保您正在测试的文件不超出最大文件大小,值得在您的 HTML 中进行设置。

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

此外,在表单正常工作之前,不使用 display:none 进行测试可能是值得的;您在哪个浏览器中测试?

于 2012-05-07T04:28:50.263 回答