bootstrap中fileinput插件回调数据的问题

Question

各位大侠，我想使用thinkphp3.2.3和boostrap的fileinput插件实现一个上传文件的功能，如下图：

我的想法是点击确认提交的时候，上传的文件先到后台将文件地址保存到附件信息数据表中，返回一个记录id值，id值保存在前端hidden隐藏域，然后再把附件的其他信息和记录id值再更新一边数据表的值。但发现第一步隐藏域就接收不到id值。上网也查了好多资料，各种参数都反复测试过了，还是在前端隐藏域接收不到id值，各位看看怎么回事？？？？
前端代码如下：
<input type="text" name="ziyuan_name" value="" placeholder="附件的名称" id="ziyuan_name">
选择上传文件：<input type="file" name="uploadfile" id="uploadfile" multiple class="file-loading" />
<input type="hidden" value="" id="ziyuan_id" />
<button class="btn btn-primary" id="create_ziyuan_submit">确认提交</button>

$("#uploadfile").fileinput({

uploadUrl: "{:U('Dongzuo/uploading')}", //上传的地址
uploadAsync:false, //true同步上传，false异步上传，**我都试过了**
showUpload: false, //是否显示上传按钮
showPreview : false, //是否显示预览
maxFileCount: 1, //表示允许同时上传的最大文件个数
enctype: 'multipart/form-data',
validateInitialCount:true,

}).on("fileuploaded", function(event, data, previewId, index) {$("#ziyuan_id").val(data.response.id);});

//下一步接收隐藏域中的id值和其他文本域信息在通过post方法传到后台
$('#create_ziyuan_submit').on('click',function(){
$("#uploadfile").fileinput("upload");
var $ziyuan_id=$("#ziyuan_id").val();
var $ziyuan_name=$("#ziyuan_name").val();
$.post('{:U('Dongzuo/add_ziyuan')}',
{ziyuan_id:$ziyuan_id,ziyuan_name: $ziyuan_name},
function(data){。。。}});

//后台代码：
public function uploading()
{
    $upload = new \Think\Upload();// 实例化上传类
    $upload->rootPath  = './'; // 设置附件上传根目录
    $upload->savePath  = 'Public/upload_fujian/'; // 设置附件上传根目录
    $upload->autoSub  = false;
    $info = $upload->uploadOne($_FILES['uploadfile']);
    $data['dizhi'] = $info['savename'];
    $ziyuan = D('ZiyuanInfo');
    if ($id=$ziyuan->add($data)){$ajaxdata['id']=$id;}
    else{...}
    $this->ajaxReturn($ajaxdata);
}

public function add_ziyuan()
{
    $ziyuan = D('ZiyuanInfo');
    $ziyuan_id=I('ziyuan_id');
    if ($ziyuan_id){
        $ziyuan_name=I('ziyuan_name');
        $condition['ziyuan_id']=$ziyuan_id;
        $yn=$ziyuan->where($condition)->save($data);
        if($yn){$ajaxdata['status']=0;}
        else{$ajaxdata['status']=2;}
    }
    else{$ajaxdata['status']=1;}
    $this->ajaxReturn($ajaxdata);
}

Answer 1

以前用过这个插件，研究了一下，你是要上传的同时还要提交其他参数吧，其实可以全部同时上传的，给你一个参数设置，你的id可以放在uploadExtraData里

                control.fileinput({
                    language: 'zh', //设置语言
                    uploadUrl: uploadUrl, //上传的地址
                    allowedFileExtensions: ['jpg', 'gif', 'png'],//接收的文件后缀
                    showUpload: true, //是否显示上传按钮
                    showCaption: false,//是否显示标题
                    uploadAsync: false, //设置上传同步异步 此为同步 
                    browseClass: "btn btn-primary", //按钮样式     
                    //dropZoneEnabled: false,//是否显示拖拽区域
                    //minImageWidth: 50, //图片的最小宽度
                    //minImageHeight: 50,//图片的最小高度
                    //maxImageWidth: 1000,//图片的最大宽度
                    //maxImageHeight: 1000,//图片的最大高度
                    //maxFileSize: 0,//单位为kb，如果为0表示不限制文件大小
                    //minFileCount: 0,
                    maxFileCount: 15, //表示允许同时上传的最大文件个数
                    uploadExtraData:{
                        aaa:1111        //上传时要传输的其他参数
                    },
                    enctype: 'multipart/form-data',
                    validateInitialCount:true,
//                    slugCallback:function(filename){
//                    _uploadBatch
//                    },
                    previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",
                    msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}！",
                });
        };

php接收返回

<?php
 echo json_encode(array('file'=>$_FILES,'request'=>$_REQUEST));
?>

当然做上传功能的话我比较推荐自己写，用formdata上传，有兴趣的话可以参考参考我的博客链接

Answer 2

应该有个success回调函数，在里面可以接收上传成功回调的值的

Answer 3

谢谢大家，我查了相关资料，这个插件的返回结果只能用js方法来处理，不能用jquery来处理。

Answer 4

标准接收上传完成服务器回调的方式是:

$('#file').fileinput({

}).on('filebatchuploadsuccess', function(event,data){
    data.response
})