wyzwalacz jqGrid "Ładowanie ..." nakładka

Question

Czy ktoś wie, jak wyzwalać nakładkę jqGrid "Ładowanie ...", która jest wyświetlana podczas ładowania siatki? Wiem, że mogę używać wtyczki jquery bez większego wysiłku, ale chciałbym móc zachować wygląd aplikacji zgodny z tym, co jest już używane w jqGrid.

zamyka rzecz jaką znalazłem jest to:

jqGrid display default "loading" message when updating a table/on custom update

• N8

Answer 1

Jeśli szukasz czegoś podobnego DisplayLoadingMessage() funkcji. Nie istnieje w jqGrid. Możesz ustawić opcję loadui z jqGrid na włączyć (domyślnie), wyłączyć lub blok. Osobiście wolę blok blok. (patrz http://www.trirand.com/jqgridwiki/doku.php?id=wiki:options). Ale myślę, że nie tego chciałeś.

Jedyne, co możesz zrobić, jeśli podoba Ci się komunikat "Ładowanie ..." z jqGrid, to zrobić to samo. Wyjaśnię tutaj, co robi jqGrid, aby wyświetlić tę wiadomość: Zostaną utworzone dwa ukryte elementy div. Jeśli masz siatkę z id = listy, to DIV będzie wyglądał następujące:

<div style="display: none" id="lui_list" 
    class="ui-widget-overlay jqgrid-overlay"></div> 
<div style="display: none" id="load_list" 
    class="loading ui-state-default ui-state-active">Loading...</div> 

gdzie tekst „Ładowanie ...” lub „lädt ...” (w języku niemieckim) pochodzi z $.jgrid.defaults.loadtext. Identyfikator elementów div zostanie utworzony z przedrostka "lui_" lub "load_" oraz identyfikatora siatki ("lista"). Przed wysłaniem zapytania ajax jqGrid sprawia, że ​​jeden lub dwa z tych div są widoczne. Wywołuje funkcję jQuery.show() dla drugiego div (id = "load_list"), jeśli opcja loadui to enable. Jeśli jednak opcja loadui to blok, wówczas oba elementy div (id = "lui_list" i id = "load_list") będą wyświetlane w odniesieniu do funkcji .show(). Po zakończeniu żądania ajax .hide() funkcja jQuery zostanie wywołana dla jednego lub dwóch elementów div. To wszystko.

Znajdziesz definicję wszystkich klas css w ui.jqgrid.css lub jquery-ui-1.8.custom.css.

Teraz masz dość informacji, aby odtworzyć wiadomość "Ładowanie ..." jqGrid, ale gdybym był tobą, pomyślałbym jeszcze raz, czy naprawdę chcesz to zrobić, czy też jQuery blockUI plugin jest lepsze dla twoich celów.

Answer 2

Styl nadpisania to [.ui-jqgrid .loading].

Answer 3

Możesz wywołać $ ("# load _"). Show() i .hide() gdzie jest id twojej siatki.

Answer 4

używam

 $('.loading').show(); 
     $('.loading').hide(); 

działa dobrze bez tworzenia nowych div

Answer 5

Właśnie umieszczone poniżej linii w onSelectRow wydarzeniem siatki JQ to działało.

$ (".ładowanie").pokazać();

Answer 6

to jest pełne problemów z $ ("div.loading"). Show(); Jest również przydatny nawet inne składniki

$('#editDiv').dialog({ 
      modal : true, 
      width : 'auto', 
      height : 'auto', 
      buttons : { 
       Ok : function() { 
        //Call Action to read wo and 
        **$('div.loading').show();** 

        var status = call(...) 
        if(status){ 
         $.ajax({ 
          type : "POST", 
          url : "./test", 
          data : { 
           ... 
          }, 
          async : false, 
          success : function(data) { 

           retVal = true; 
          }, 
          error : function(xhr, status) { 


           retVal = false; 
          } 
         }); 
        } 
        if (retVal == true) { 
         retVal = true; 
         $(this).dialog('close'); 
        } 
        **$('div.loading').hide();** 
       }, 
       Cancel : function() { 
        retVal = false; 
        $(this).dialog('close'); 
       } 

      } 
     }); 

Answer 7

Jak wspomniano przez @Oleg mają wiele dobrych cech podczas rozwijania aplikacji AJAX bazowych. Dzięki niemu można zablokować cały UI lub konkretnego elementu o nazwie element Block

Dla jqGrid Możesz umieścić siatkę w div (sampleGrid), a następnie zablokować siatkę jako:

$.extend($.jgrid.defaults, { 
    ajaxGridOptions : { 
     beforeSend: function(xhr) { 
      $("#sampleGrid").block(); 
     }, 
     complete: function(xhr) { 
      $("#sampleGrid").unblock(); 
     }, 
     error: function(jqXHR, textStatus, errorThrown) { 
      $("#sampleGrid").unblock(); 
     } 
    } 
}); 

Answer 8

Prosty, aby pokazać :

$("#myGrid").closest(".ui-jqgrid").find('.loading').show(); 

Następnie ukryć go ponownie

$("#myGrid").closest(".ui-jqgrid").find('.loading').hide();