JQuery Вкладки UI - “Загружающийся …” сообщение

Question

JQuery Вкладки UI - “Загружающийся …” сообщение

Какие конкретные ошибки вы видите?

Что-то вроде этого может работать лучше:

<script type="text/javascript">

//now add markers
 @foreach (var item in Model) {
    <text>
      var markerlatLng = new google.maps.LatLng(@Model.Latitude, @Model.Longitude);
      var title = '@(Model.Title)';
      var description = '@(Model.Description)';
      var contentString = '<h3>' + title + '</h3>' + '<p>' + description + '</p>'
    </text>
}
</script>

Обратите внимание, что вам нужен магический тег <text> после foreach до что Razor должен переключиться в режим разметки.

26

jquery-ui-tabs jquery-ui jquery

задан Ikke 13 November 2009 в 16:05

4 ответа

Другие вопросы по тегам:

jquery-ui-tabs jquery-ui jquery

Похожие вопросы:

score 40 · Answer 1

Если вы используете кеширование для своих вкладок, то это решение, вероятно, лучше подходит, оно показывает загрузку AJAX, только если содержимое еще не на странице.

$(".tabs").tabs({
   cache:true,
   load: function (e, ui) {
     $(ui.panel).find(".tab-loading").remove();
   },
   select: function (e, ui) {
     var $panel = $(ui.panel);

     if ($panel.is(":empty")) {
         $panel.append("<div class='tab-loading'>Loading...</div>")
     }
    }
 })

score 5 · Answer 2

Балу, мне недавно нужно было нечто подобное. В моем проекте я хотел, чтобы вкладки сохраняли заголовок вкладки, но добавляли анимацию типа загрузки ajax. Вот что я использовал:

$(".tabs").tabs({ spinner: '',
                select: function(event, ui) { 
                    $(".tabs li a .loader").remove();
                    $(".tabs li a").eq(ui.index).append("<span class='loader'><img src='images/ajax-loader.gif'/></span>"); 
                    },
                load: function(event, ui) { $(".tabs li a").eq(ui.index).find(".loader").remove(); }
                });

Опция «spinner» удаляет эффект «Loading ...» при нажатии на вкладку. Событие «select» позволяет нам получить выбранную вкладку и добавить новый диапазон, содержащий анимацию. Как только контент загружен, мы используем событие «load» для удаления анимации. Чтобы предотвратить разрушение вкладок несколькими щелчками пользователей, мы удаляем () все анимации на выбранных вкладках.

Вы уже решили эту проблему? Если это так, пожалуйста, поделитесь решением.

score 3 · Answer 3

В jQuery UI v1.12 вы можете использовать обработчик beforeLoad:

$('#tabs').tabs({                
beforeLoad: function(event, ui) {
    ui.panel.html('Loading')
}
});

score 8 · Answer 4

Я сам использовал другой метод. Я хотел, чтобы заголовки вкладок оставались такими, какими они были, и имели информацию о «загрузке» в самой вкладке.

Я сделал это следующим образом:

    $("#matchTabs").tabs({
      spinner: "",
      select: function(event, ui) {
        var tabID = "#ui-tabs-" + (ui.index + 1);
        $(tabID).html("<b>Fetching Data.... Please wait....</b>");
      }
    });

Как и на предыдущем плакате, я использовал метод спиннера, чтобы предотвратить изменение заголовков вкладок. Событие select возникает при выборе новой вкладки, поэтому я получил идентификатор выбранной в данный момент вкладки и добавил его для создания переменной, которая будет ссылаться на DIV, в которые по умолчанию загружается содержимое ajax.

После того, как у вас есть идентификатор, все, что вам нужно сделать, это заменить HTML внутри DIV сообщением о загрузке. Когда Ajax завершится, он заменит его снова для вас фактическим содержимым.