일반적인 용례는 콘텐츠 레이아웃 안의 링크를 누를 때 동적 검색 질의를 사용하여 검색 페이지로 이동하는 것입니다.
예를 들어, 콘텐츠 레이아웃에서 "이 작성자의 다른 기사" 링크를 누르고 검색 페이로드를 전달할 때 "작성자"라는 검색 페이지로 이동한다고 가정해 보겠습니다. 다음 코드가 이 작업을 수행합니다. 전역 객체 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));
동일한 콘텐츠 레이아웃을 동일한 페이지에서 여러 번 사용하려는 경우 $('.more-from-author').click(…)
과 같은 클래스 선택기가 아닌 CSS 선택기에서 고유 ID를 사용하는 것이 좋습니다.
예를 들어, 다음과 같습니다.
template.html <div id="{{navigateId}}">….</div> render.js content.navigateId = this.scsData.id + 'detailTrigger'; $('#' + navigateId).click(…)