jQuery 블록 UI 예외

Question

모든 Ajax 요청에 대해 UI를 차단하기 위해 JQuery UI 플러그인 blockUI을 사용하고 있습니다. 그것은 매력처럼 작동하지만 Ajax를 호출하여 자동 완성 제안 항목을 가져올 때 UI를 차단하고 싶지 않습니다 (또는 적어도 "기다려주십시오"메시지 표시 안 함). 어떻게해야합니까? jquery autocomplete 플러그인을 사용하여 자동 완성 기능을 사용하고 있습니다.

자동 완성을 위해 블록 UI 플러그인을 차단 UI 플러그인에게 알릴 수있는 방법이 있습니까?

Answer 1

$('#myWidget').autocomplete({ 
    source: function(data, callback) { 
     $.ajax({ 
      global: false, // <-- this is the key! 
      url: 'http:...', 
      dataType: 'json', 
      data: data, 
      success: callback 
     }); 
    } 
}); 

Answer 2

모달 블록 (UI 블록)을 사용한다는 것은 사용자로부터의 모든 입력을 차단한다는 것을 의미합니다. '기다려주십시오 ..'를 표시하고 (readonly = "readonly"속성 설정) ur 입력 컨트롤을 차단하려면 평범한 오래된 throbber를 제안합니다. ajax 요청이 완료되었습니다.

위의 UI는 자체적으로 충돌하는 것 같습니다.

Answer 3

는 장식

$.blockUI = function() { 
    if (condition_you_dont_want_to_block) { 
     return; 
    } 
    return $.blockUI.apply(this, arguments); 
} 

를 사용하여 시도하거나 당신은 당신의 자신의 차단 기능을 쓸 수있는 스마트

function my_blockUI() { 
    if (condition_you_dont_want_to_block) { 
     return; 
    } 
    $.blockUI(); 
} 
$(document).ajaxStart(my_blockUI).ajaxStop($.unblockUI); 

Answer 4

당신은 blockUI 추가하여 페이지의 모든 기능에 대한 작업을 설정할 수 있습니다 글로벌 jQuery 이벤트 핸들러에 전달합니다. autocomplete ajax 호출에 호출되지 않도록하려면 호출이 자동 완성 호출인지 아닌지를 결정해야합니다. 문제는 이러한 전역 기능에 많은 정보가 없다는 것입니다. 그러나 ajaxSend는 약간의 정보를 얻습니다. 그것은 ajax 호출을하는 데 사용되는 설정 객체를 가져옵니다. 설정 객체에는 전송중인 데이터 문자열이 있습니다.

$.ajax({data:"bar=1&foo=2&notautocomplete=notautocomplete"}) 

그런 다음 우리가 전에 문서 준비 섹션에이 코드를 넣을 수 있습니다 : 예를 들어

&notautocomplete=notautocomplete 

: 따라서 당신이 할 수있는 일은 같은 페이지 무언가에 모든 아약스 요청에 모든 데이터 문자열에 추가입니다 무엇 : 물론

$(document).ajaxSend(
    function (event, xhr, ajaxOptions){ 
    if(ajaxOptions.data.indexOf("notautocomplete") !== -1){ 
     $.blockUI; 
    } 
}); 
$(document).ajaxStop($.unblockUI); 

다른 좋은 아이디어는 URL과 같은 자동 완성 요청에 독특한 무언가를 찾아하는 것입니다,하지만 그건에 의존하는 자동 완성 플러그인 당신은 그것을 사용하고 어떻게 사용하고 있습니까?

Answer 5

흠, 당신은 그것이 자동 완성 호출이있는 경우 표시하고 일반 autcompletefunction

var isAutoComplete = false; 
    function autoComplete(autocomplete){ 
    isAutoComplete = true; 
    if($(autocomplete).isfunction()) 
     autocomplete(); 
    } 

     $(document).ajaxStart(function(){if(!isAutoComplete)$.blockUI();}).ajaxStop(function(){isAutoComplete = false;$.unblockUI();}); 

그것은 좋은 해결책이 아니다 그것을 포장 글로벌 플래그를 사용할 수 : JQuery와에 누락 된 기능으로 본다 그러나 그것은 작동해야합니다 ...