2016-08-26 4 views
0

ExtJS 5.1.0 사용.Ext.util.TaskRunner를 사용하여로드 마스크에 시계 표시

다른 방법을 생각할 수는 없지만 Ajax 응답을 기다리는 동안로드 마스크에 표시 할 타이머가 필요합니다. success에 나는 마스크를 설정 해제하고 타이머를 삭제합니다. 내 수정 다음을 수행하는 것이 었습니다 있도록

코드는 Ext.util.TaskRunner없이 잘 작동 : success이됩니다에

task = runner.start({ 
     run: function() { 
      // show loadMask during request 
      Ext.getBody().mask("Computing..." + Ext.Date.format(new Date(), 'g:i:s A')); 
     }, 
     interval: 10 
    }); 

    // payload for POST 
    obj = { 
     query: { 
      payload: atom 
     } 
    }; 

    Ext.Ajax.request({ 
     cors: true, 
     timeout: 600000, //default is 30 seconds 
     useDefaultXhrHeader: false, 
     url: url, 
     jsonData: obj, 
     headers: { 
      'Accept': 'application/json' 
     }, 
     disableCaching: false, 

     success: function(response) { 
      // do stuff 

      // stop loadMask 
      Ext.getBody().unmask(); 
      Ext.util.TaskRunner.destroy(task); 
     } 
    }); 

"물건을"하지만 지금 타이머를 파괴하지 않고 지금은 아니다 마스크를 제거했습니다. (오류가 발생했기 때문에 확인되었습니다 : TypeError: Ext.util.TaskRunner.destroy is not a function. (In 'Ext.util.TaskRunner.destroy(task)', 'Ext.util.TaskRunner.destroy' is undefined) ...

TaskRunner은 파괴되거나 중지 될 때까지 계속 실행되지만 이것이 작동하지 않는 것으로 알고 있습니다. 원하는.

Ajax 호출의 수명주기 동안 작업을 실행하려면 궁극적으로 필요하며, 내가 필요한 것을 얻기 위해 LoadMask을 여러 번 호출하고 있음을 알고 있습니다.

---- 편집 ----

부분적으로, 알았어요 : 나는 (내가 interval 매개 변수를 사용하지 않고 repeat 매개 변수 전에 시도했던 repeat config 매개 변수 누락되었고, 그것을하지 않았다 doh!이 단순한 유즈 케이스를 문서화의 예제로 사용했을 것입니다.하지만 슬프게도 ...) :

task = runner.start({ 
     run: function() { 
      // show loadMask during request 
      Ext.getBody().mask("Computing..." + Ext.Date.format(new Date(), 'g:i:s A')); 
     }, 
     interval: 10, 
     repeat: 1 
    }); 

그리고 그걸로 stop 또는 destroy을 개체에 발행 할 필요가 없었습니다. .

그러나 시계는 원하는대로 업데이트되지 않습니다. 이는 작업이 한 번만 실행되기 때문에 의미가 있습니다. 그래서 나는 아직도 붙어있는 것처럼 보입니다.

+0

타이머를 손상시키지 않는다는 것은 무엇을 의미합니까? 그걸 어떻게 결정하니? 마스크를 한 번에 여러 번 호출하지만 한 번만 마스크를 해제하면됩니다. 문제를 나타내는 바이올린을 만들어보십시오. 아약스 콜은별로 관련이 없습니다. –

+0

죄송합니다.'destroy' 메소드를 사용하여 얻은 오류에 관한 중요한 정보를 생략했습니다. –

답변

0

마침내!

var task, runner = new Ext.util.TaskRunner(); 

    task = runner.newTask({ 
     run: function() { 
      // show loadMask during request 
      Ext.getBody().mask("Computing..." + Ext.Date.format(new Date(), 'g:i:s A')); 
     }, 
     interval: 10000 
    }); 

    task.start(); 

을 그리고 성공 콜백이 발생하면 다음 간단한 task.stop();가 작업을 중지 : 여기

는 일 구성입니다. 누락 된 키가 정의되어있는 것처럼 보입니다 NewTask. 흥미 롭습니다. Sencha 문서의 예제를 더 자세히 읽는 것이 도움이된다고 생각하십시오.