Hi Ciaran,
this is the code from my EntryCategory controller:
/**
* create searchform based on CustomSearchContext fields
*
* @see Entry::getCustomSearchContext
* @return object form
*/
public function SearchForm()
{
$context = singleton( 'Entry' )->getCustomSearchContext();
$fields = $context->getSearchFields();
$form = new Form(
$this,
'SearchForm',
$fields,
new Fieldset(
new FormAction( 'doSearch', _t( 'EntryCategory.DOSEARCH', 'Suchen' ) )
)
);
return $form;
}
/**
* execute search
*
* @param $data
* @param $form
* @return string rendered content
*/
public function doSearch( $data, $form )
{
$context = singleton( 'Entry' )->getCustomSearchContext();
...
$results = $context->getResults( $data );
return $this->customise( array(
'Results' => $results,
) )->renderWith( 'EntryCategory_Results' );
}
Here I get a custom search context, but the crucial part is the "doSearch" method which has a renderWith() call chained. This I use to get a rendered template response.
In your /mysite/code/Page.php you'll need an init() method call to include the needed jQuery sources:
function init()
{
Requirements::javascript( THIRDPARTY_DIR . '/jquery/jquery-packed.js' );
Requirements::javascript( THIRDPARTY_DIR . '/jquery/plugins/livequery/jquery.livequery.js' );
Requirements::javascript( THIRDPARTY_DIR . '/jquery/plugins/form/jquery.form.js' );
...
parent::init();
}
Here you load the jQuery sources and plugins. So you're able to use the form plugin :-)
Now you need two templates: One for your searchform and one for the results. The easiest way is to use your existing one and strip the whole part with the control to iterate the resultset.
EntryCategory.ss:
<div id="entryCategory">
<h2>
<a href="$Link">$Title</a>
</h2>
$Content
$SearchForm
<div id="Form_SearchForm_Result"> </div>
</div>
Now the results (EntryCategory_Results.ss):
<% if Entries %>
...
<% control Entries %>
...
<% end_control %>
<% else %>
<h3>Sorry, no entries</h3>
<% end_if %>
This result template needs to be placed in the code-folder where your controller is located. I haven't figured out why SS searches in there for the template in this special case...
Now the fun-part :-)
Since we use jQuery, this is quite easy: You'll have to place this code either in your main .js file (maybe use a try/catch) or within script tags in the controller's template (in my case EntryCategory.ss), so the stuff will be loaded with the page and finds the mentioned id to hook in.
JS in script-tag-style:
<script type="text/javascript">
/* <![CDATA[ */
jQuery( document ).ready( function()
{
var options = {
target: '#Form_SearchForm_Result'
};
// bind to the form's submit event
jQuery( '#Form_SearchForm' ).submit( function()
{
jQuery( this ).ajaxSubmit( options );
return false;
} );
}
/* ]]> */
</script>
Normally I'd place this at the bottom of the template file.
Some things to keep in mind about jQuery:
- SS uses prototype for lots of things, so don't use "jQuery" instead of "$" as selector
- use jQuery(document).ready(), so jQ will load and hook in directly after the DOM is ready (before the complete page is loaded)
I hope this helps :-)
Regards,
Marc
