Загрузка файла EmberJS через jquery-file-upload

У меня есть контроллер Ember.js, и я пытаюсь отправить файл на мой контроллер rails с загрузкой файла jquery.

Я начал с этого:

myControllerAction: ->
  $('#fileupload').fileupload(
    url: "/api/v1/comics"
    dataType: 'json'
    formData:
      comic: {
        title: self.get('comicTitle')
        prompt_one_id: self.get('prompts')[0].get('id')
        prompt_two_id: self.get('prompts')[1].get('id')
      }
    )

Что действительно сработало, но оно отправило форму, как только файл был выбран. Я хочу сделать все это, когда пользователь отправляет форму. Итак, я попробовал это:

  didInsertElement: ->
    $('#fileupload').fileupload(
      url: "/api/v1/comics"
      dataType: 'json'
      formData:
        comic: {
          title: self.get('comicTitle')
          prompt_one_id: self.get('prompts')[0].get('id')
          prompt_two_id: self.get('prompts')[1].get('id')
        }
      add: (e, data) ->
        data.submit()
      progressall: (e, data) ->
        progress = parseInt(data.loaded / data.total * 100, 10)
        $('#progress .bar').css('width', progress + '%')
    )

   myControllerAction: ->
    self = @
    $('#fileupload').fileupload('add')

Однако это не работает. Выдает ошибку javascript:

Uncaught Error: cannot call methods on fileupload prior to initialization; attempted to call method 'add' 

Я думал, что настройка всего при вставке элемента будет инициализировать объект. Так что я не уверен, где я ошибаюсь. У кого-нибудь есть предложения?

РЕДАКТИРОВАТЬ: добавить шаблон

    <form enctype="multipart/form-data">
      <div class="control-group">
        <label class="control-label" for="inputTitle">Title</label>
        <div class="controls">
          {{input type="text" valueBinding="comicTitle"}}
          {{input type="file" id="fileupload" valueBinding="comicFile"}}
        </div>
      </div>
      <button {{action myControllerAction}} id="upload_comic" class="btn btn-inverse">Upload Comic</button>
      <div id="progress">
        <div class="bar" style="width: 0%;"></div>
      </div>
    </form>

person DVG    schedule 17.07.2013    source источник
comment
Можете ли вы добавить код для шаблона?   -  person Panagiotis Panagi    schedule 17.07.2013
comment
то, что кажется проблемой для вас, - это то, что я на самом деле пытаюсь достичь. вот моя проблема: stackoverflow.com/questions/17699686/ Можете ли вы помочь исправить загрузку jquery с помощью ember? Я просто не могу загрузить файл jquery для работы с ember.   -  person monk    schedule 27.10.2013


Ответы (1)


Не знаю, в чем причина ошибки, но попробуйте сделать это с помощью afterRender. перезвонить. Также используйте this.$('#fileupload') вместо $('#fileupload'). Код:

  didInsertElement: ->
    Ember.run.scheduleOnce('afterRender', this, 'setupFileUpload')

  setupFileUpload: ->
    $('#fileupload').fileupload(
      url: "/api/v1/comics"
      dataType: 'json'
      formData:
        comic: {
          title: self.get('comicTitle')
          prompt_one_id: self.get('prompts')[0].get('id')
          prompt_two_id: self.get('prompts')[1].get('id')
        }
      add: (e, data) ->
        data.submit()
      progressall: (e, data) ->
        progress = parseInt(data.loaded / data.total * 100, 10)
        $('#progress .bar').css('width', progress + '%')
    )
person Panagiotis Panagi    schedule 17.07.2013
comment
Любая идея, как можно было бы чисто отправить его с контекстом? например URL: /api/v1/users/:ID. Полезно для обновления файла пользователя или ресурса - person Edward; 01.08.2013