函数结束后循环打印检索多个数据

Question

我创建了一个网络应用程序来存储客户要求的报价。

一个引文可以是多个，所以当我打印一个引文时，我可能必须打印连接的引文。

为了做到这一点，我尝试在函数完成后进行打印以从 json 检索数据并构建页面。

可能有多个数据，所以当我单击打印按钮时，该函数必须读取 json 数据以获得所有连接的报价，构建页面并打印它，并对任何数据执行此操作引用

该函数从服务器读取行情数据

                        function prev_edit(id){
                            return $.ajax({
                                type        : 'POST',
                                url         : 'json/get.php?t=2&p='+id,
                                dataType    : 'json',
                                encode      : true
                            })
                            .then(function(data) {
                                var prom;
                                if ((data)["success"]===false) {
                                    ...do something...
                                    prom=$("#edit").show("slow").promise();
                                }
                                return prom;
                            });
                        };

当我点击打印按钮时，此功能有效

                        $('#prev_print').on("click",(function( event ) {
                            $.ajax({
                                type        : 'POST',
                                url         : 'json/get.php?multi='+$("#id").val(),
                                dataType    : 'json',
                                encode      : true
                            }).then(function(data) {
                                if ((data)["success"]===true) {
                                    $.each((data)["multi"], function( i, n ) {
                                        prev_edit(n).then(function(){
                                            window.print();
                                        });
                                    });
                                }
                            });
                        }));

我也尝试了延迟对象，但似乎 prev_edit(n)。然后 函数结束时不会等待。

Answer 1

你可以试试：

而不是使用简单的 .each()，序列化 data.multi 的迭代。
正在等待 $("#edit").show('slow').promise() 归还。

您还应该：

捕获并吞下由 prev_edit() 过程引起的错误
用终端捕获任何意外错误.catch()

你应该得到这样的结果：

function prev_edit(id) {
    return $.ajax({
        'type': 'POST',
        'url': 'json/get.php?t=2&p=' + id,
        'dataType': 'json',
        'encode': true
    })
    .then(function(data) {
        if (!data.success) {
            ...do something...
            return $("#edit").show('slow').promise();
         // ^^^^^^
        }
        throw new Error('prev_edit failed');
     // ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    });
};

$('#prev_print').on('click', function(event) {
    $.ajax({
        'type': 'POST',
        'url': 'json/get.php?multi=' + $('#id').val(),
        'dataType': 'json',
        'encode': true
    })
    .then(function(data) {
        if (data.success) {
            // serialize the preview/print process with data.multi.reduce(...)
            data.multi.reduce(function(promise, n) {
                return promise.then(function() {
                    return prev_edit(n)
                    .then(function() {
                        window.print();
                    })
                    // catch possible error arising from prev_edit().
                    .catch(function(error) {
                        console.log(error);
                        // swallow (don't rethrow) the error.
                    });
                });
            }, Promise.resolve());
        }
    })
    .catch(function(error) {
        console.log(error);
        // no need to rethrow the error as this is top-level code.
    });
});

您可能需要在序列化 preview/print 过程中添加一些延迟，以便给自己时间查看预览。或者，您可以提供一个按钮，需要单击该按钮才能移动到下一个 preview/print。两者都非常简单。

函数结束后循环打印检索多个数据

Loop print after function ends retrieve multiple data

ajax

jquery

promise

jquery-deferred