ajax - jquery ajax表单提交插件不发布文件输入

标签 ajax jquery jquery-forms-plugin

我有这个表格:

<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>

最佳答案

情况可能并非如此,但确定服务器端没有拼写错误吗?就像您会使用 $_FILE 而不是 $_FILES 吗?您也可以发布相关的 php 吗?

另外,绝对不是问题,但建议关闭您的输入标签,现在如下所示:

<input ... />

关于ajax - jquery ajax表单提交插件不发布文件输入,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10340148/

相关文章:

php - 为什么 jQuery 表单插件混合了 NULL 和 0

javascript - jQuery 禁用键盘上的按下提交

jquery - 如何使用 jQuery 表单插件更新 beforeSubmit 函数中的选项对象

jquery触发器: how can I trigger the browse file in the input when I click on a text link?

javascript - 为什么这个表单不能使用 AJAX 提交?

Jquery:从cookie中检索数组

javascript - 引用错误: extend is not defined

php - Ajax 从 JSON 返回未定义 - 登录系统和最佳实践

jquery - 使用 JSONP 的 ajax 调用返回错误 Uncaught ReferenceError : jquery19102754115150310099_1392753827782 is not defined

javascript - 加载 JS 文件 - 直接加载到 Document 与 DocumentFragment