【问题标题】:yii xupload mysql for CActiveFormyii xupload mysql for CActiveForm
【发布时间】:2012-12-15 18:33:34
【问题描述】:

我正在尝试在 CActiveForm 中包含 yii 的 xupload 扩展我尝试遵循此http://www.yiiframework.com/wiki/395/additional-form-data-with-xupload/ 但是我做不到。我有一个表单,其中包含用户名和文件名字段(允许用户上传并从视图中查看。) 这是我的看法

<?php
$form = $this->beginWidget('CActiveForm', array(
      'id' => 'form-form',
      'enableAjaxValidation' => false,
        //This is very important when uploading files
      'htmlOptions' => array('enctype' => 'multipart/form-data'),
    ));
  ?>    
    <div class="row">
        <?php echo $form->labelEx($model,'username'); ?>
        <?php echo $form->textField($model,'username'); ?>
        <?php echo $form->error($model,'username'); ?>
    </div>
    <!-- Other Fields... -->
    <div class="row">
        <?php echo $form->labelEx($model,'attachment_photo'); ?>
        <?php
    $this->widget('xupload.XUpload', array(
        'url' => Yii::app()->createUrl("form/uploadAdditional", array("parent_id" => 1)),
        'model' => $model,//An instance of our model
        'attribute' => 'file',
        'multiple' => true,
        //Our custom upload template
        'uploadView' => 'application.views.site.upload',
        //our custom download template
        'downloadView' => 'application.views.site.download',
        'options' => array(//Additional javascript options
            //This is the submit callback that will gather
            //the additional data  corresponding to the current file
            'submit' => "js:function (e, data) {
                var inputs = data.context.find(':input');
                data.formData = inputs.serializeArray();
                return true;
            }"
        ),
    ));
    ?>

【问题讨论】:

    标签: yii upload blueimp yii-xupload


    【解决方案1】:

    重要的是你的 $_POST 数组是什么样子的。 (使用 Firebug 或 Fiddler 进行检查)。

    您的 $_POST 应该如下所示:

    array (
      'form-form' => array ( /* stuff for additional form data */)),
      'XupLoad' => array ( /* stuff pertaining to XuLoad */)),
    )
    

    这样,附加的表单数据与 XupLoad 数据是分开的。 Xupload 扩展中包含的操作处理数组的$_POST['XupLoad'] 部分。您必须编写代码来处理数组的 $_POST['form-form'] 部分。

    顺便说一下,Blueimp 的 jQuery File Upload 有一个新版本,其中包含重要的改进和错误修复。 XupLoad 扩展似乎不包含这个最新版本。

    我建议使用 Blueimp 的最新版本。它有一个 UploadHandler 类,负责处理服务器端的所有事情。最新版写的真好。您仍然需要添加代码来处理额外的表单数据...

    事后考虑:看起来您正在嵌套小部件。我不确定这是否可行。检查浏览器中的页面源。确保生成的 HTML 是正确的。可能是您正在生成嵌套表单,我对这些表单的工作方式表示怀疑。

    【讨论】:

    • 非常感谢.. 我会试试 blueimp 的最新版本,看看它是如何工作的 =)
    • 我无法做到,所以我坚持使用基本上传。你知道我可以将 yii booster 进度条集成到 yii 基本文件上传吗?
    • 不,我不熟悉 Yii 助推器进度条。但是,我认为在基本文件上传中添加进度条是不可能的,因为根本没有可用的进度信息。您是否有想要将 File Uploader 集成到的实时站点?并且:您在寻找什么功能:分块上传、进度条、图像预览? (我上周集成了 jQuery FileUploader,我花了整整(12 小时)的时间......)
    【解决方案2】:

    这是我的现场测试网站。 http://vincentlkl.allalla.com/ 我已经将表格编码为多部分

    <?php $form=$this->beginWidget('CActiveForm', array(
    'id'=>'form-form',
    'enableAjaxValidation'=>false,
    'stateful'=>true, 
    'htmlOptions'=>array('enctype' => 'multipart/form-data')
    

    )); ?>

    /文件上传小部件/

    <?php $this->widget('bootstrap.widgets.TbFileUpload', array(
    'url' => Yii::app()->createUrl("form/upload"),
            'model' => $model,
            'attribute' => 'file',
            'multiple' => true,
            'options' => array(
                'maxFileSize' => 3000000,
                'acceptFileTypes' => "js:/(\.|\/)(jpe?g|png)$/i",
            )
    
    ));
     ?>
    

    表格中的文件无法上传。

    【讨论】:

    • 好的。如果您查看页面源代码,则有两个嵌套表单。我认为这是一个问题。这可能是当您点击开始上传时您的 XHR 请求崩溃的原因(Firebug 报告返回 0 个请求)。我将在下一个答案中展示一个有效的 HTML 表单:
    • 对不起,我不太确定你的意思。是把两种形式合二为一吗?我已经删除了form.php(fileupload temp)中的那个我尝试在firebug中查看源代码它只显示一个表单。你是这个意思吗?非常感谢 =)
    • 好的,我知道你现在有一个表格。那很好。但是,您选择了 form-form。选择另一个表单,属于 jQuery File Upload 的表单。现在,.fileuploader() 缺少要初始化的
      。您需要生成一个带有如下标签的表单:
      jQuery File Uploader 需要这是开始。
    • 如果你不能让它工作,只需从 jQuery File Upload 演示开始。省去额外的表单数据。首先让它与您的服务器一起使用,这样您就可以实际上传文件了。只有这样,添加一个“”字段。看看你的 $_POST 是什么样子的。如果看起来没问题,那么在服务器端编写该字段的处理...
    【解决方案3】:

    暂时忘记您正在调用的小部件。下面是一个应该生成的 HTML 示例,以便将 jQuery FileUpload 与其他表单字段结合起来:

    <!-- The file upload form used as target for the file upload widget -->
    <form id="fileupload" action="" method="POST" enctype="multipart/form-data">
            <input name="Input_upload[titleInArchive]" id="Input_upload_titleInArchive" type="text" />   
    
        <div class="row fileupload-buttonbar">
            <div class="span7">
                <!-- The fileinput-button span is used to style the file input field as button -->
                <span class="btn btn-success fileinput-button">
                    <i class="icon-plus icon-white"></i>
                    <span>Add files...</span>
                    <input type="file" name="files[]" multiple>
                </span>
                <button type="submit" class="btn btn-primary start">
                    <i class="icon-upload icon-white"></i>
                    <span>Start upload</span>
                </button>
        <!-- the rest of the demo jQuery File upload page ... -->
    </form>
    

    此表单有一个输入字段 titleInArchive,它与 jQuery 文件上传表单共存。 &lt;input&gt; 位于 jQuery File Upload 标签内。所以在你的情况下,你会把额外的&lt;input&gt;'s放在$this-&gt;widget('xupload.XUpload', ...)

    完成此操作后,点击开始上传按钮。在 Firebug 中,检查 XHR 请求。 $_POST 数组是什么样的?在您的情况下,它应该类似于

    $_POST['Form']['username'] ...
    $_POST['Form']['identity_card'] ...    
    

    我希望我说得通……

    【讨论】:

    • 非常感谢,我想我得到了 XHR 0request 部分,其中 jquery 文件上传表单与表单崩溃。这是否意味着我需要添加 FormView ?
    • 不确定。什么是 FormView?
    猜你喜欢
    • 2023-03-30
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多