用于状态消息的JQuery UI模式对话框不会更新到最后

时间:2012-04-25 20:59:56

标签: jquery internet-explorer user-interface modal-dialog status

原始问题似乎有两个问题: 1)睡眠功能没有正确模拟长时间运行的操作,例如HTML请求。 2)IE,至少v8和v9似乎没有像Firefox那样正确地更新它们的显示。有人知道强制IE处理UI更新的方法吗? 以下在Fi​​refox上工作正常但IE不会更新运行计数的显示直到结束,除非我插入强制暂停的警报。如果有50个项目且批量大小为10,我希望显示运行计数的HTML显示10,20,30,40,50。在IE中,它最终从10跳到50,而Firefox正确更新。

while (done == false) {
    var url = 'myLongRunningOperation.com/doSomething.html&LastID='+lastPriorIndex;
    $.ajax({
    type: 'GET',
    url: url,
    dataType: 'json',
    success: function(data) { 
        soFar += data.Succeeded + data.Failed;
        $('#numCompleted').val(soFar).show();
        LastPriorIndex= data.LastID;
        if (soFar >= totalNumberOFDocs) {
        done = true;
        }
    },
    data: {},
    async: false
    });
}

我正在尝试使用JQuery UI模式对话框作为状态对话框。首先它应该显示,然后在长时间运行的操作完成时处理更新消息并添加到HTML。但是,对话框直到最后才显示,然后显示所有消息。如果我在显示对话框后立即发出警报,它将显示但操作全部完成后消息更新全部立即显示。我希望我需要的是某种check-the-message-queue函数来让它更新,因为警报会导致对话框显示。或者可能是我模拟日志运行操作的方法,这是模拟睡眠的问题。

    $(function() {
        $("#dialog2").dialog({
            bgiframe: false
            ,height: 140
            ,modal: true
            ,autoOpen: false
        });

    });
    function TestModalUpdate2() {
        $('#dialog2').dialog("open");
        //alert('foo'); //if this alert is present the dialog shows before the doSomething calls execute but wont update till all of them are done
        $('#dialog2').show();
        var i
        for(i = 0; i < 5; i++) {
            doSomething($('#dialog2'));
            $('#dialog2').show();
        }
    }

    function doSomething(obj1) {
        wait(1000);
        obj1.html(obj1.html()+"<p>new line</p>")
                //alert('this will also cause the dialog to update in between doSomethings')
    }
    function wait(msecs) {
        var start = new Date().getTime();
        var cur = start
        while(cur - start < msecs) {
            cur = new Date().getTime();
        }
    } 
<input type="button" id="Test2" onclick="TestModalUpdate2();" value="Test2"/>

2 个答案:

答案 0 :(得分:0)

除此之外,我有同样的问题,但我也使用jqgrid,并使用jqgrid saveRow函数。我认为这可能会导致问题,但不是100%肯定。

它甚至会在我的对话框中阻止动画gif的渲染,所以至少可以说有趣:)

我正在做类似的事情

$("#WOTaskList").jqGrid('saveRow', rowArray[rowIndex], onSave, null, null, null, onSaveError)

和我的onSave

$(".waitUIText").html("<span>Saved " + nSavedRows + " of " + nEditeddRows + "</span>");

而且......现在我已经解决了... jqgrid同步BLOCKS默认保存调用:/

将ajaxRowOptions:{async:true}添加到jqgrid默认init,对话框正在按预期更新..

答案 1 :(得分:0)

经过进一步研究表明在同步模式下运行可能会很麻烦,我把它转换成了一个有效的递归版本。

function processBatch() {
    var url = 'DoSomethingLongRunning.html&StartingIndex='+startingIndex+'&BatchSize='+batchSize;
    $.getJSON(url 
        ,function(data) { 
            soFar1 += data.Succeeded + data.Failed;
            $('#numCompleted').val(soFar1).show();
            startingIndex = data.LastID;
            if (soFar1 < totalNumberOfDocs) {
                processBatch();
            }
        }
    );  
}