Hello,
I’ve run into a little problem with using the extension when it is being rendered into the page with ajax.
The error I’m getting is that it fails to load in the fileupload.js file
Uncaught TypeError: Object [object Object] has no method 'fileupload'
Javascript that is loading it in:
$("#shift-history").on("click", ".add-documents-link, .upload-expense-document-link", function(e){
e.preventDefault();
var eventId, shiftId, expenseId, uploadType;
if($(this).hasClass("add-documents-link")){
uploadType = 'document';
eventId = $(this).closest(".documents").data("eventId");
shiftId = $(this).closest(".documents").data("shiftId");
} else {
uploadType = 'expense';
expenseId = $(this).data("expenseId");
shiftId = $(this).data("shiftId");
}
$.ajax({
url: baseURL + "userShift/getDocumentUploadWidget",
type: "GET",
data: {"upload_type": uploadType},
dataType: "html",
success: function(data){
var $data = $(data);
$("body").append($data.filter(':not(script[src*="jquery"])').filter(':not(script[src*="min/serve"])'));
$("#upload-document-dialog").find("input[name='expense_id']").val(expenseId);
$("#upload-document-dialog").find("input[name='shift_id']").val(shiftId);
$("#upload-document-dialog").find("input[name='event_id']").val(eventId);
$("#upload-document-dialog").dialog("open");
},
error: Parim.errorHandler
});
});
The javascript part is working perfectly. In the response I can see that everything is grapped properly.
The PHP controller action:
public function actionGetDocumentUploadWidget()
{
$uploadType = $_REQUEST['upload_type'];
Yii::import("xupload.models.XUploadForm");
$XUploadForm = new XUploadForm;
echo $this->renderPartial('/userShift/_documentUpload', array('uploadType'=>$uploadType, 'XUploadForm'=>$XUploadForm), false, true);
}
The view file:
<?php
if($uploadType == 'expense'){
$url = Yii::app()->createUrl("document/expenseDocumentUpload");
} else {
$url = Yii::app()->createUrl("document/userVenueDocumentUpload");
}
?>
<?php
$this->beginWidget('zii.widgets.jui.CJuiDialog', array(
'id'=>'upload-document-dialog',
'options'=>array(
'title'=>'<div class="fl" style="margin:0 10px">Add Documents [ .pdf, .doc, .docx, .txt, .csv, .xls, .odt, .jpg, .jpeg, .png, .gif ]</div>',
'autoOpen'=>false,
'modal'=>true,
'width'=>'auto',
'height'=>'auto',
'resizable'=>false,
'open'=>'js: function(){
$(".ui-datepicker").hide();
}',
'close' => 'js: function(){
$.fn.getDocuments();
var shiftId = $("#upload-document-dialog").find("input[name=\'shift_id\']").val();
$.fn.getExpensesList(shiftId);
}',
),
'htmlOptions'=>array('style' => 'display:none; padding:0;')
));
?>
<div id="document-dialog-content" style="min-height:120px; margin:10px;">
<?php
$this->widget('xupload.XUpload', array(
'url' => $url,
'model' => $XUploadForm,
'attribute' => 'file',
'multiple' => false,
'formView' => 'documentFormUserVenue',
'uploadView' => 'documentUpload',
'downloadView' => 'docDownloadSmall',
'options' => array(
'acceptFileTypes' => "js:/(\.|\/)(doc|docx|pdf|xls|txt|odt|csv|jpg|jpeg|gif|png)$/i",
// 'success' => 'js:function () { }',
),
));
?>
</div>
<div class="action-bar cf">
<div class="row buttons">
<?php echo CHtml::link(_('Upload'),'#',array('class'=>'btn btn-success fr','id'=>'start-upload', 'style'=>'margin:10px 20px; color:white;') ); ?>
</div>
</div>
<?php $this->endWidget('zii.widgets.jui.CJuiDialog'); ?>
The reason why I’ve gone with this approach was due to problems loading two xupload instances into one page.
The problem I see here is that it probably is trying to init fileupload before fileupload.js actually gets included.
Thanks to all in advance.