Paging: SimpleSearch & getPage

708 Posts

Eko Reply #1, 11 years, 8 months ago

Revo 2.3.2
SimpleSearch 1.9

For consistency I need to make the SS paging work and look the same as the getResources/getPage pagination used elsewhere on a site. I don't know if it's possible but I'm hoping it is.

For example, here's a getPage call I'm currently using to filter authors, the pagination of which I'm trying to replicate with SS (see below).

[[!getPage?
    &elementClass=`modSnippet`
    &element=`getResources`
    &parents=`0`
    &where=`{"createdby:=": [[!getUrlParam? &name=`author` &int=`1`]] }`
    &tplPath=`static/chunks/`
    &tpl=`@FILE results.html`
    &toPlaceholder=`results`
    &totalVar=`total`
    &limit=`6`
    &pageLimit=`5`
    &pageNavVar=`page.nav`
    &pageFirstTpl=`<li class="control"><a[[+classes]][[+title]] href="[[+href]]">&ofcir;</a></li>`
    &pagePrevTpl=`<li class="control"><a[[+classes]][[+title]] href="[[+href]]">••</a></li>`
    &pageNextTpl=`<li class="control"><a[[+classes]][[+title]] href="[[+href]]">••</a></li>`
    &pageLastTpl=`<li class="control"><a[[+classes]][[+title]] href="[[+href]]">&ofcir;</a></li>`
]]
                [[+results:notempty=`<p>[[+total]] articles.</p>`]]
                <ol>
                [[+results:ifempty=`<p>No results.</p>`]]
                </ol>
                [[!+page.nav:notempty=`<nav>
                    <ul class="pagination">
                        <span>Page [[+page]] of [[+pageCount]]</span><br>[[!+page.nav]]
                    </ul>
                </nav>`]]

Basic SimpleSearch call

[[!SimpleSearch?
    &parent=`0`
    &includeTVs=`1`
    &toPlaceholder=`resultInfo`
    &perPage=`6`
    &containerTpl=`SiseaContainer`
    &tpl=`SiseaResults`
    &sortBy=`publishedon`
    &sortDir=`DESC`
]]
<p class="sisea-results">[[+resultInfo]]</p>

This question has been answered by treigh. See the first response.

Todd

discuss.answer

833 Posts

treigh Reply #2, 11 years, 8 months ago

I'm not sure if I'm following you, but let's give it a try. First, I would create the following chunks:

pageTpl, pageNextTpl, pagePrevTpl, pageFirstTpl, pageLastTpl, currentPageTpl

Inside pageTpl, pageNextTpl, pagePrevTpl chunks, I would add this:

<li class="control"><a href="[[+link]]" title="[[+text]]">••</a></li>

Inside pageFirstTpl and pageLastTpl chunks, this:

<li class="control"><a href="[[+link]]" title="[[+text]]">⦿</a></li>

Finally, I would put the following in the currentPageTpl chunk:

<li class="control">[[+text]]</li>

I would then change my containerTpl chunk to this:

<p class="sisea-results">[[+resultInfo]]</p> 
<ul class="pagination">
  <li><span class="sisea-result-pages">[[%sisea.result_pages? &namespace=`sisea` &topic=`default`]]</span></li>
  [[+paging]]
</ul>
<div class="sisea-results-list">
    [[+results]]
</div>
<ul class="pagination">
  <li><span class="sisea-result-pages">[[%sisea.result_pages? &namespace=`sisea` &topic=`default`]]</span></li>
  [[+paging]]
</ul>

Your SimpleSearch call could look like this:

[[!SimpleSearch?
    &parent=`0`
    &includeTVs=`1`
    &toPlaceholder=`resultInfo`
    &perPage=`6`
    &containerTpl=`SiseaContainer`
    &tpl=`SiseaResults`
    &sortBy=`publishedon`
    &sortDir=`DESC`
    &pageTpl=`pageTpl`
    &pageNextTpl=`pageNextTpl`
    &pagePrevTpl=`pagePrevTpl`
    &pageFirstTpl=`pageFirstTpl`
    &pagingSeparator=``
]]

Better yet, I'd prefer to make these changes in a property set so as to keep things neat and organized. You'd just refer to the property set like this:

[[!SimpleSearch@Pagination?
    &parent=`0`
    &includeTVs=`1`
    &toPlaceholder=`resultInfo`
    &perPage=`6`
    &containerTpl=`SiseaContainer`
    &tpl=`SiseaResults`
    &sortBy=`publishedon`
    &sortDir=`DESC`
]]

Let's hope this helps. [ed. note: treigh last edited this post 11 years, 8 months ago.]

A MODx Fanatic

708 Posts

Eko Reply #3, 11 years, 8 months ago

Quote from: treigh at Jan 05, 2015, 11:10 PM

I'm not sure if I'm following you, but let's give it a try.

Hi treigh,

I'll give this a try, thanks.

To clarify:

By default SimpleSearch paging looks like this:
Result pages: 1 | 2 | 3.

Whereas getResources/getPage (by default) looks something like this:
Page 1 of 3
<< < 1 2 3 > >>

I prefer the latter (getResources) but I've been unable to strong-arm SimpleSearch paging to output a similar look.

Todd

833 Posts

treigh Reply #4, 11 years, 8 months ago

This property &pagingSeparator=`` will remove the pipe (|) from the it's pagination links.

To achieve the getPage pagination style you just mentioned, just change your chunks like this:

pagetTpl

<li class="control"><a href="[[+link]]" title="[[+text]]">[[+text]]</a></li>

pageFirstTpl

<li class="control"><a href="[[+link]]" title="[[+text]]"><<</a></li>

pagePrevTpl

<li class="control"><a href="[[+link]]" title="[[+text]]"><</a></li>

pageNextTpl

<li class="control"><a href="[[+link]]" title="[[+text]]">></a></li>

pageLastTpl

<li class="control"><a href="[[+link]]" title="[[+text]]">>></a></li>

A MODx Fanatic

2 Posts

antpopov Reply #5, 9 years, 11 months ago

Hello!
Some problems with SimpleSearch
Properties &pageNextTpl, &pagePrevTpl and &pageFirstTpl doesn't work, and it doesn't matter if I declare it in SimpleSearch call or in property set.
Anyway, my pagination looks like "1 2 3 4 5" without FIRST, PREV, NEXT and LAST-buttons.
What is the reason?

2 Posts

antpopov Reply #6, 9 years, 11 months ago

Solution of the problem to use both variants together.
This call not working:

[[!SimpleSearch?
    &parent=`0`
    &includeTVs=`1`
    &toPlaceholder=`resultInfo`
    &perPage=`6`
    &containerTpl=`SiseaContainer`
    &tpl=`SiseaResults`
    &sortBy=`publishedon`
    &sortDir=`DESC`
    &pageTpl=`pageTpl`
    &pageNextTpl=`pageNextTpl`
    &pagePrevTpl=`pagePrevTpl`
    &pageFirstTpl=`pageFirstTpl`
    &pagingSeparator=``
]]

This call not working too:

[[!SimpleSearch@Pagination?
    &parent=`0`
    &includeTVs=`1`
    &toPlaceholder=`resultInfo`
    &perPage=`6`
    &containerTpl=`SiseaContainer`
    &tpl=`SiseaResults`
    &sortBy=`publishedon`
    &sortDir=`DESC`
]]

although I have declared FIRST, PREV, NEXT and LAST properties in property set

So, my action steps:
to create chunks
to create property set and to declare properties here
to call SimpleSearch using second variant with declaration of properties like in first variant:

[[!SimpleSearch@Pagination?
    &parent=`0`
    &includeTVs=`1`
    &toPlaceholder=`resultInfo`
    &perPage=`6`
    &containerTpl=`SiseaContainer`
    &tpl=`SiseaResults`
    &sortBy=`publishedon`
    &sortDir=`DESC`
    &pageTpl=`pageTpl`
    &pageNextTpl=`pageNextTpl`
    &pagePrevTpl=`pagePrevTpl`
    &pageFirstTpl=`pageFirstTpl`
    &pagingSeparator=``
]]

Answered Paging: SimpleSearch & getPage