added pagination template, ajax-enabled js and instructions

README.md

@@ -62,3 +62,28 @@ class App.AjaxForm.YourCustomClass extends App.AjaxForm.Default
 
 Probably most easiest way to use this bundle is to use it with ElasticSearch because XiSearchBundle provides you
 premade implementation for it. This however requires [FOQElasticaBundle](https://github.com/Exercise/FOQElasticaBundle) to work.
+
+## Pagination
+Pagination uses knp-pagination bundle, and it's on by default
+
+Suppose the search is retreived via ajax, there's a jquery plugin included that binds the received pagination's logic to the actual search form with javascript.
+
+As the pagination generally uses the search forms default fields, only the indices need configuration. page, term and submit button values can also be overridden
+``` coffee
+$('#search-result-container').xiSearchPaginate
+        indices: ['#xi_searchbundle_searchtype_index_0', '#xi_searchbundle_searchtype_index_1', ...]
+```
+
+For these bindigs to work, configure the knp pagination to use the proper pagination template
+```yml
+knp_paginator:
+    page_range: 9                      # default page range used in pagination control
+    default_options:
+        page_name: page                # page query parameter name
+        sort_field_name: sort          # sort field query parameter name
+        sort_direction_name: direction # sort direction query parameter name
+        distinct: true                 # ensure distinct results, useful when ORM queries are using GROUP BY statements
+    template:
+        pagination: XiSearchBundle:Pagination:sliding.html.twig     # sliding pagination controls template
+        sortable: KnpPaginatorBundle:Pagination:sortable_link.html.twig # sort link template
+```

Resources/coffee/pagination.coffee

@@ -0,0 +1,28 @@
+$ = jQuery
+$.fn.xiSearchPaginate = (options) ->
+	defaultOptions =
+		page: '#xi_searchbundle_searchtype_page'
+		submit: '#xi_searchbundle_searchtype_submit'
+		term: '#xi_searchbundle_searchtype_term'
+		indices: []
+
+	options = $.extend true, {}, defaultOptions, options
+
+	# change page
+	@.on "click", ".pagination a", ->
+		pageValue = $(this).attr("data-page")
+		$(options.page).val pageValue
+		$(options.submit).find("button").trigger "click", silent: true
+
+	# reset page
+	$(options.term).change ->
+		$(options.page).val 1
+
+	if options.indices
+		for index in options.indices
+			$(index).change ->
+				$(options.page).val 1
+
+	$(options.submit).find("button").click (event, data) ->
+		unless data and data.silent
+			$(options.page).val 1

Resources/views/Pagination/sliding.html.twig

@@ -0,0 +1,40 @@
+{# default Sliding pagination control implementation #}
+
+{% if pageCount > 1 %}
+<div class="pages">
+    {% if first is defined and current != first %}
+        <span class="first">
+            <a href="#main-content" data-page="{{first}}">&lt;&lt;</a>
+        </span>
+    {% endif %}
+
+    {% if previous is defined %}
+        <span class="previous">
+            <a href="#main-content" data-page="{{previous}}">&lt;</a>
+        </span>
+    {% endif %}
+
+    {% for page in pagesInRange %}
+        {% if page != current %}
+            <span class="page">
+                <a href="#main-content" data-page="{{ page }}">{{ page }}</a>
+            </span>
+        {% else %}
+            <span class="current">{{ page }}</span>
+        {% endif %}
+
+    {% endfor %}
+
+    {% if next is defined %}
+        <span class="next">
+            <a href="#main-content" data-page="{{next}}">&gt;</a>
+        </span>
+    {% endif %}
+
+    {% if last is defined and current != last %}
+        <span class="last">
+            <a href="#main-content" data-page="{{last}}">&gt;&gt;</a>
+        </span>
+    {% endif %}
+</div>
+{% endif %}

Resources/views/SearchForm/searchform.html.twig

@@ -1,7 +1,7 @@
 <form action="{{ path('XiSearchBundle_search') }}" class="ajax-form article-form" method="post" {{ form_enctype(form) }}>
 	{{ form_widget(form.term, { 'attr': {'placeholder' : ('search.form.term.placeholder')|trans} }) }}
     {{ form_rest(form) }}
-    <p>
+    <p id="xi_searchbundle_searchtype_submit">
         <button type="submit">{{'search.form.submit_button'|trans}}</button>
     </p>
 </form>