Backbone.js: вызвать событие в представлении после рендера - PullRequest
Новая
       25

Backbone.js: вызвать событие в представлении после рендера

1 голос
/ 29 февраля 2012

Есть ли способ привязать событие к событию после завершения рендеринга в виде магистрали?

Я пытаюсь присоединить средство выбора диапазона дат jQuery к входу, который добавляется в DOM послепо ссылке щелкают, но если я делаю это во время рендеринга, средство выбора диапазона появляется не в том месте (потому что вход еще не получил позицию DOM).Итак, мне нужно подождать, пока после того, как вход был обработан, прежде чем я присоединяю средство выбора даты.Ниже приведен Coffeescript.

@makeDateRangePicker - это функция, которая запускает средство выбора даты 

class window.ClientDestinationPricingFieldsView extends ModelSaverView
  template: (json) ->
    _.template(jQuery("#special-pricing-timeframe-template").html()) json

  render: ->
    jQuery(@el).html @template(@model.toJSON())
    @makeDateRangePicker jQuery(@el).find("input[name=date_range]")
    this

Ответы [ 4 ]

2 голосов
/ 29 февраля 2012

Я бы попробовал это: 

class window.ClientDestinationPricingFieldsView extends ModelSaverView
  events:
    'click input[name=date_range]': 'makeDateRangePicker'

  template: (json) ->
    _.template(jQuery("#special-pricing-timeframe-template").html()) json

  render: ->
    jQuery(@el).html @template(@model.toJSON())
    this

Вы должны изменить @makeDateRangePicker, чтобы вместо него взять элемент события.

1 голос
/ 29 февраля 2012

Вы можете обычно использовать setTimeout с таймаутом, равным нулю, для такого рода вещей. setTimeout(..., 0) по существу ставит в очередь функцию, которая будет вызвана, как только браузер снова получит контроль. Как то так: 

render: ->
  jQuery(@el).html @template(@model.toJSON())
  setTimeout
    => @makeDateRangePicker jQuery(@el).find("input[name=date_range]")
    0
  @

Я часто использую этот трюк с Картами Google, чтобы правильно позиционировать его и определить его размер.

1 голос
/ 29 февраля 2012

Редактировать: Итак, мой последний удар по решению не был.

Что вы говорите, что после вашего звонка на jQuery(@el).html ожидаемого html нет?Это звучит очень странно.Я думаю, что это может быть так просто, как вам нужно заключить в кавычки значение вашего атрибута: 

jQuery(@el).find("input[name='date_range']")

Обратите внимание на ' одиночную кавычку вокруг date_range.

Редактировать: Извините, после проверки того, что оно действительно работает без кавычек.Я был укушен чем-то похожим раньше.В любом случае, если вопрос правильный, как сейчас (после того, как он был обновлен информацией о добавлении ввода в событие щелчка), то вам следует вызвать makeDateRangePicker сразу после добавления элемента, верно?

0 голосов
/ 26 мая 2012

Один из способов сделать это - вызвать пользовательское событие из родительского представления после завершения рендеринга. $('body').trigger('my-rendering-is-done') (лучшим способом было бы вызвать его на представлении, которое визуализируется из вызывающего кода). И у вас есть слушатель, который использует makeDateRangePicker.

...