使用触发器评估 xQuery 并在 eXistDB 的 HTML 页面内使用 return

Use a trigger to evaluate xQuery and use return inside HTML page in eXistDB

我想使用 Button/link/whatever 从我的 eXist Webapp 调用 xQuery 函数并使用 returned 值显示 Bootstrap 警报。所以包括一个

<button type="button" class="btn btn-danger btn-circle">execute xQuery</button>

在我的 html 中,如果它被点击评估

let $name := "Peter"
return <div class="alert alert-success" role="alert">Hi {$name}</div>

(实际上我想要比这更复杂的东西,但你明白了..)

和return

<div class="alert alert-success" role="alert">Hi Peter</div>

在我的页面内。这可能吗?如果可能,怎么办?

使用模板系统在这里对我没有帮助,只是链接到我的数据库中的 xQuery 执行查询但重定向到显示结果的另一个页面。我可以使用 AJAX 评估 xQuery 并修改当前 DOM 吗?

谢谢!

出于完整性和未来参考的原因,我将 post 此处的 MWE:

  1. 将按钮和结果面板添加到 eXist 中的页面:
<a class="btn btn-danger run" id="path/to/the/xquery/in_your_app.xq" href="#">
   <i class="glyphicon glyphicon-play" /> Run xQuery
</a>
<img class="load-indicator" src="resources/img/ajax-loader.gif" />
<div style="margin-top: 12pt;" class="output" />
  1. 在您的应用的资源文件夹中有一个 runxquery.js 并在您的 page.html 中引用它:
$(document).ready(function() {
    $(".run").click(function(ev) {
        ev.preventDefault();
        file = this.id;
        var output = $(this).parent().parent().find(".output");
        var indicator = $(this).parent().parent().find(".load-indicator");
        function run() {
            indicator.show();
            output.hide();
            $.ajax({
                url: "/exist/rest/db/apps/yourapp/" + file,
                type: "GET",
                success: function(result) {
                    indicator.hide();
                    output.html(result);
                    output.slideDown(600);
                }
            });
        }

        if (output.is(":empty")) {
            run();
        } else {
            output.slideUp(800, function() {
                output.empty();
                run();
            });
        }
    });
});
  1. 单击按钮将触发应用文件夹内按钮 ID 中定义的 xquery。

  2. 如果运行xQuery应该returnHTML代码,需要在xQuery中指定:

declare namespace output = "http://www.w3.org/2010/xslt-xquery-serialization";
declare option output:method "html";
declare option output:media-type "application/html";

let $text := "This is the alert text"

return 
<div class="alert alert-success alert-dismissible" data-dismiss="alert" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close"/>
   {$text}
</div>