นาวิเกตไปยังเพจค้นหาที่มีการสืบค้นเพื่อค้นหา

กรณีการใช้งานทั่วไปคือ นาวิเกตไปยังเพจค้นหาที่มีการสืบค้นเพื่อค้นหาแบบไดนามิค เมื่อคลิกที่ลิงค์ภายในเลย์เอาต์ของเนื้อหา

ตัวอย่างเช่น สมมติว่าคุณต้องการนาวิเกตไปยังเพจค้นหาชื่อ "ผู้เขียน" เมื่อคลิกที่ลิงค์ "บทความอื่นๆ จากผู้เขียนนี้" ในเลย์เอาต์ของเนื้อหา จะเป็นการส่งเพย์โหลดของการค้นหา คุณสามารถใช้รหัสต่อไปนี้เพื่อดำเนินการดังกล่าว โปรดทราบว่าออบเจกต์ร่วม SCS และ SCSRenderAPI สามารถใช้ได้ในเลย์เอาต์ของเนื้อหา เมื่อทำงานภายในเพจของไซต์

$('.more-from-author').click($.proxy(function () {
    var childrenPages = SCS.structureMap[SCS.navigationRoot].children;

    if (!childrenPages) return; // No pages

    // Find the Authors page
    for (var i = 0; i < childrenPages.length; i++) {
        var page = SCS.structureMap[childrenPages[i]];
        if (page.name === 'Authors') {
            var linkData = SCSRenderAPI.getPageLinkData(page.id);
            if (linkData && linkData.href) {
                var href = linkData.href,
                    searchPayload = content.author_id + '*',
                    contentType = "Starter-Blog-Post";
                // if both the page URL and the search query exists, navigate to the page passing in the query
                if (href && searchPayload) {
                    var queryStart = href.indexOf('?') === -1 ? '?' : '&';

                    // add in the contentType and search parameters
                    // contentType isn't a required URL parameter
                    // Payload contains search string only. No parameter name.
                    href += queryStart + (contentType ? 'contentType=' + contentType + '&' : '') + 'q=' + searchPayload;

                    // navigate to the search results page
                    window.location = href;
                 }
            }
        }
    }
}, this));

ถ้าคุณคาดหมายว่าจะมีการใช้เลย์เอาต์ของเนื้อหาเดียวกันซ้ำหลายครั้งในเพจเดียวกัน ขอแนะนำให้ใช้ ID ที่ไม่ซ้ำกันในซีเลคเตอร์ CSS แทนซีเลคเตอร์ของคลาส เช่น $('.more-from-author').click(…)

ตัวอย่างเช่น:

template.html
        <div id="{{navigateId}}">….</div>

render.js
        content.navigateId = this.scsData.id + 'detailTrigger';
        $('#' + navigateId).click(…)