Fine-Uploader - отображение заполнителя "ожидающее изображение" при инициализации
Я пытаюсь показать заполнитель до того, как пользователь нажмет кнопку загрузки изображения.
Я не использую функции перетаскивания, поскольку это не подходит для динамической формы, которую мне нужно заполнить конечным пользователям, поэтому все, что у меня есть, - это кнопка загрузки (в данном случае значок камеры), размещенная в строке в Форма рядом с описанием того, что мне нужно, чтобы пользователь сфотографировал. Когда фотография сделана, миниатюра отображается как обычно, снова в строке.
Мне нужно, чтобы при первом открытии формы там был заполнитель "в ожидании изображения". Обратите внимание, что я могу показать соответствующие заполнители ПОСЛЕ действий пользователя, но не раньше - что мне не хватает??
код шаблона
<script type="text/template" id="qq-parts-template">
<div class="qq-uploader-selector" >
<div class="partsupload">
<div class="partsicons">
<div class="qq-upload-button-selector"><i class="fa fa-camera fa-fw" aria-hidden="true"></i></div>
</div>
<ul class="qq-upload-list-selector qq-upload-list" style="display:inline-block;" aria-live="polite" aria-relevant="additions removals">
<li>
<div class="partsthumb">
<span class="qq-upload-spinner-selector qq-upload-spinner"></span>
<img class="qq-thumbnail-selector" qq-max-size="50" qq-server-scale>
<span role="status" class="qq-upload-status-text-selector qq-upload-status-text"></span>
</div>
<div class="partsicons">
<div class="qq-upload-cancel-selector"><i class="fa fa-ban fa-fw"></i></div>
<div class="qq-upload-retry-selector"><i class="fa fa-repeat fa-fw"></i></div>
</div>
</li>
</ul>
</div>
<--snip dialogs for brevity-->
</div>
и загрузчик JS
var manualUploader292 = new qq.FineUploader({
element: document.getElementById('fine-uploader-manual-trigger292'),
template: 'qq-parts-template',
multiple: false,
request: {
inputName: "imagegroup[]",
endpoint: '/SaveFileAJAX.aspx'
},
validation: {
itemLimit: 1
},
thumbnails: {
placeholders: {
waitingPath: '/fine-uploader/waiting-generic.png',
notAvailablePath: '/fine-uploader/not_available-generic.png'
}
},
<-- snip callbacks etc for brevity -->
failedUploadTextDisplay: { mode: 'default',responseProperty: 'error',}});