Kendo UI Tabstrip MVC — .data (kendoTabStrip) изначально не определено

Код:

var orderDetailsTabStrip = $('#OrderDetailsTabs').data("kendoTabStrip");
orderDetailsTabStrip.select(tabIndexToSelect);

Возникла проблема при попытке сослаться на вкладку пользовательского интерфейса кендо во время готовности документа или если я просто поместил вызов в блок сценария внизу страницы. Я получаю сообщение об ошибке:

Cannot call method 'select' of undefined

Если я оберну вызов функции этим кодом в setTimeout на любое время >= 500 мс, это сработает. Итак, похоже, проблема в том, что некоторые функции кендо должны сначала завершиться во время загрузки страницы, прежде чем я смогу сослаться на вкладку?

Это работает:

setTimeout(function () { selectOrderDetailTab() }, 500);

Мне это не нравится, так как я не уверен, что на самом деле нужно ждать, и всегда ли будет работать 500 мс. Очевидно, я могу увеличить эту задержку, чтобы она всегда работала, но за счет снижения производительности для пользователя. Есть ли какое-то событие кендо, которое указывает, когда оно закончило свою работу, которое я могу использовать в качестве триггера для вызова моей функции?


javascript kendo-ui kendo-asp.net-mvc
person crichavin    schedule 31.10.2013    source источник

Ответы (1)


arrow_upward
1
arrow_downward

если вы используете помощники mvc, вам нужно убедиться, что ваш код выше, получающий экземпляр виджета, происходит ПОСЛЕ вставленного тега скрипта из помощника.

помощник вставляет тег script на страницу, которая запускает код в готовом документе. Поскольку каждый обработчик готовности документа срабатывает в том порядке, в котором он был связан, вам необходимо убедиться, что ваш код:

  1. внутри собственной функции $(document).ready()
  2. ваша функция $(document).ready() связана после того, как кендо сгенерировал ее

практически это обычно означает, что вам нужно запустить свой код после тега body, если только вы не используете вспомогательную опцию .Deferred(), и в этом случае это должно произойти после команды WriteScripts

<body>
    //kendo inserts your widget
    <div id="#OrderDetailsTabs"></div>
    <script> 
        //this is the equivillent to $(document).ready()
        jQuery(function() { 
            $('#OrderDetailsTabs').kendoTabStrip({ options: "goHere" }); 
        } );
    </script>
</body>
<script>
      $(document).ready(function(){
          var orderDetailsTabStrip = $('#OrderDetailsTabs').data("kendoTabStrip");

          orderDetailsTabStrip.select(tabIndexToSelect);
      });
</script>
person monastic-panic    schedule 31.10.2013