当前页面上的自定义搜索

Question

简单的问题，我想在页面上查询结果。就像我使用Express + NodeJS + MongoDB + Mongoose所做的那样，它就是这样的：

// GET /api/question/:id
router.get('/question/:id' , (req , res)=>{
    var id = req.params.id;

    if(!ObjectID.isValid(id))
    {
        return res.status(400).send();
    }

    Question.findById(id).then((question) => {
        if(!question){
            return res.status(400).send();
        }
        res.send(question);
    }).catch((err) => {
        res.status(400).send(err);
    });
});

这些代码返回的参数为:id，以搜索相关的_id (GET方法)

然后，我使用浏览器端使用ajax获取查询：

function getQueryLink(q){
    return $.ajax({
            method: "GET",
            url: '/api/question/?q=' + encodeURIComponent(q),
            contentType: 'application/json',
            success: function (response) {
                var getListBlock = $("#questionsBlock");
                $("#questionsBlock").empty();    
                response.question.docs.forEach(function (questions) {
                    var id = questions._id;
                    getListBlock.append("<form id='" + id + "' class='questionBox'><input type='number' name='time' id='timeLittleBox' value='" + questions.time + "' onfocus='this.value=\"\"'><p style='font-size: 17px;color: #535353; display: inline-block; float:right; padding:3px;'>seconds</p><textarea class='list'>" + questions.questionString + "</textarea><input type='number' class='answer-box-edit' style='background-color: #eaad3a' id='trueAnswerBox' value='" + questions.answers[0] + "'><input type='number' class='answer-box-edit' id='falseAnswerBox1' value='" + questions.answers[1] + "'><input type='number' class='answer-box-edit' id='falseAnswerBox2' value='" + questions.answers[2] + "'><input type='number' class='answer-box-edit' id='falseAnswerBox3' value='" + questions.answers[3] + "'><div class='form-group'><label for='level' id='timeBoxLabelEdit'>Level of Question = <output class='rangeValue' id='rangevalue'>" + questions.level + "</output></div></label><input type='range' id='level' min='1' max='10' value='" + questions.level + "' oninput='rangevalue.value=value' onchange='rangevalue.value=value' /><br><button form='" + id + "' class='delete'>Delete</button><button form='" + id + "' class='update'>Update</button></form><hr>");
                });
                if (response.question.total >= 6) {
                    getListBlock.last().append("<div id='pagination' class='pagination'><a class='left-arrow' href='/'>❮ Previous</a><a class='right-arrow' href='/'>Next ❯</a></div>");
                }
                if (response.question.page == 1) {
                    $(".left-arrow").addClass("disabled");
                } else if (response.question.page == response.question.pages) {
                    $(".right-arrow").addClass("disabled");
                }
                $("a.left-arrow").on("click", function (e) {
                    e.preventDefault();
                    paginationLeft(response.question.pages, response.question.page);
                });
                $("a.right-arrow").on("click", function (e) {
                    e.preventDefault();
                    paginationRight(response.question.pages, response.question.page);
                });
                $('.questionBox').on('click', '.update', function (e) {
                    e.preventDefault();
                    var id = $(this).attr('form');
                    var questionString = $("form#" + id).find("textarea").val();
                    var answer1 = $("form#" + id).find("#trueAnswerBox").val();
                    var answer2 = $("form#" + id).find("#falseAnswerBox1").val();
                    var answer3 = $("form#" + id).find("#falseAnswerBox2").val();
                    var answer4 = $("form#" + id).find("#falseAnswerBox3").val();
                    var level = $("form#" + id).find("#level").val();
                    var time = $("form#" + id).find("#timeLittleBox").val();                    
                    var allAnswers = [answer1, answer2, answer3, answer4];
                    update(id, questionString, allAnswers, level ,time , q);
                });
                $('.questionBox').on('click', '.delete', function (e) {
                    e.preventDefault();
                    var id = $(this).attr('form');
                    var questionString = $("form#" + id).find("textarea").val();
                    deleteData(id, questionString , q);
                });
            }
        });
}

现在，在Apostrophe-CMS，我不知道从哪里开始。甚至要获取参数并将结果发送回API，并且能够使用nunjucks显示相同的req.data或req.piecesFilters。让我举一个简单的例子，说明我目前正在为我自己的投资组合做些什么。以下是我对portfolio-pages : {} 已完成的Github开发的设计：

​

​

如你所见，我在设计中有我的“搜索”表格。但是我只想在投资组合中搜索(只查询投资组合)。请帮帮我。我在self.indexPage上研究了你的代码。但仍然不知道如何只将查询返回到该页面。然后我找到了addFilter方法，它对每个不同页面上的自定义搜索都有一定的帮助。帮助我：“(

同时，我想用强大的正则表达式进行搜索。如果我输入“蓝色”并返回“蓝鸟”。这将产生强大的搜索查询！

Answer 1

找到答案

结果，我必须在app.js中启用撇号搜索。并在投资组合页面(如)中创建一个表单动作。并将我的输入名输入到search，这样整个URL就会是localhost:3000/portfolio?search=some+search。现在，它返回所有的价值片段，这是伟大的！这是我在indexAjax.html中的表单：

<form method="GET" id="portfolio-list" action="/portfolio">
<input type="text" name="search" placeholder="Search" data-search="on" /><input type="submit" value="Search" style="display:none" />
</form>

我的浏览器序列化数据(以防万一)：

$("#portfolio-list").submit(function(){
    $.get('/portfolio', $("#portfolio-list").serialize(), function (result) {
        if(result.status === 'ok'){
            console.log("Form sent");
        }
    });
});