Pagination problem - dynamic filters tutorial 1

After following the dynamic filters tutorial, I successfully created a search form. The pagination is not working properly. When clicking to go to another page the search form criteria disappears. I found one other post in the forms that describes this problem (from 2009), but no solution. I am sure I am missing some little thing, but I cannot figure it out! I am using my search form with form tags enabled as identified in the tutorial. I am using version 2R3 with Joonla 1.5.22.

Thank you!

HEADER

<?php
// get the number of records returned
$db =& JFactory::getDBO();
global $count;
$count = $db->loadResult();


// get the previous filter strings
$search_surname = JRequest::getString('SURNAME', '', 'post');
$search_firstname = JRequest::getString('FIRST_NAME', '', 'post');
$search_maidenname = JRequest::getString('MAIDEN_NAME', '', 'post');
$search_burialloation = JRequest::getString('BURIAL_LOCATION', '', 'post');
?>

<!-- display the filter box and buttons -->

<table width="400" border="1" cellspacing="0" cellpadding="4">
  <tr>
    <th align="right" scope="row">Surname</th>
    <td><input type="text" name="SURNAME" id="search_lastname" value='<?php echo $search_surname; ?>'/></td>
  </tr>
  <tr>
    <th align="right" scope="row">First Name</th>
    <td><input type="text" name="FIRST_NAME" id="search_firstname" value='<?php echo $search_firstname; ?>'/></td>
  </tr>
  <tr>
    <th align="right" scope="row">Maiden Name</th>
    <td><input type="text" name="MAIDEN_NAME" id="search_maidenname" value='<?php echo $search_maidenname; ?>'/></td>
  </tr>
  <tr>
    <th align="right" scope="row">Burial Location</th>
    <td><input type="text" name="BURIAL_LOCATION" id="search_buriallocation" value='<?php echo $search_buriallocation; ?>'/></td>
  </tr>
  <tr>
    <th align="right" scope="row"> </th>
    <td><input type="submit" name="filter" id="filter" value="Submit" /> <input type='reset' name='reset' id='reset' value='Reset' /></td>
  </tr>
</table>
<hr />



<!-- Start the List -->

<h3>Obituary List</h3>

<table width="550" border="1" cellspacing="0" cellpadding="4">
<?php
global $count;
if ( !$count ) {
echo "<div>Sorry, no results were found.</div>";
}
else { 
?>

<?php
}
?> 

Body

<tr>
    <td colspan="5" bgcolor="#37223b"><strong><span style="color:#FFFFFF;">{SURNAME}, {FIRST_NAME} {MIDDLE_NAME}</span></strong></td>
  </tr>
<tr>
    <td width="142"> </td>
    <td align="right">Maiden Name:</td>
    <td>{MAIDEN_NAME}</td>
    <td align="right">Spouse:</td>
    <td>{SPOUSE}</td>
  </tr>
  <tr>
    <td> </td>
    <td align="right">Birth Date:</td>
    <td>{DATE_OF_BIRTH}</td>
    <td align="right">Veteran:</td>
    <td>{VETERAN}</td>
  </tr>
  <tr>
    <td> </td>
    <td align="right">Date of Death:</td>
    <td>{DATE_OF_DEATH}</td>
    <td align="right">Burial Location:</td>
    <td>{BURIAL_LOCATION}</td>
  </tr>
  <tr>
    <td> </td>
    <td align="right">Obituary Date:</td>
    <td>{OBITUARY}</td>
    <td align="right">Burial Date:</td>
    <td>{DATE_OF_BURIAL}</td>
  </tr>
  <tr>
    <td> </td>
    <td align="right">Obituary Source:</td>
    <td>{OBITUARY_SOURCE}</td>
    <td align="right">Photo:</td>
    <td>{PHOTOGRAPH}</td>
  </tr>
  <tr>
    <td> </td>
    <td align="right">Death Notice:</td>
    <td>{DEATH_NOTICE_SOURCE}</td>
    <td align="right">Notice Date:</td>
    <td>{DEATH_NOTICE}</td>
  </tr>
  <tr>
    <td> </td>
    <td align="right">Survivors:</td>
    <td colspan="3">{SURVIVORS}</td>
  </tr>
  <tr>
    <td> </td>
    <td align="right">Notes:</td>
    <td colspan="3">{NOTES}</td>
  </tr>
  <tr>
    <td> </td>
    <td align="right">See:</td>
    <td colspan="3">{SEE}</td>
  </tr>
  <tr>
    <td> </td>
    <td align="right">See Also:</td>
    <td colspan="3">{SEE_ALSO}</td>
  </tr>

Footer:

</table>
<?php
global $count;
if ( !$count ) {
echo "Try searching on just part of a name or location.";
}
else {
?>
{pagination}
<?php
}
?>

Hi MindyK,

Sorry, it's taken a while to find the time to solve this one. I thought that this had been cracked a while ago but if it has I can't find the answer.

The page links generated by the Joomla! pagination block we use in the front-end use simple links to refresh the page (unlike the back-end pagination which uses JavaScript). These links pass a start variable - but cannot include the post variables from the form :-(

With a bit of trial and error I have come up with this script which seems to do the job. I posted it in the Footer box but the Header box should work equally well.

<?php
$script = "
window.addEvent('domready', function() {
  var pagelinks = $$('div.page-inactive a');
  var form = $$('form[name=connectivity]')[0];
  var limitstart = $$('input[name=limitstart]')[0];
  pagelinks.each(function(link) {
    var href  = link.getProperty('href'); 
    var start = href.substr(href.lastIndexOf('start=')+6);
    var title = link.getProperty('title');
    var new_link  = new Element('a', {
      'events': {
        'click': function() {
          limitstart.value = new_link.getProperty('start');
          form.submit();
        }
      },
      'title': title,
      'start': start
    });
    new_link.setText(title);
    link.replaceWith(new_link);
  });
});
";
$doc =& JFactory::getDocument();
$doc->addScriptDeclaration($script);
?>

The script strips out the link tags around the pagination and replaces them with tags that set the appropriate value for 'limitstart' and then submit the form when clicked. As the form is submitted the value of any filter fields should be preserved.

Bob

Bob, thanks for your help. I am not really sure where I am supposed to use this JavaScript. I tried putting it at the end of the footer block after my closing form tag, but that didn't work. I tried sticking it in place of pagination, and after the {pagination} call, and then in the header before everything else, but none of them worked. I am sure I am missing some silly thing!

Hi Mindy,

Maybe in the "Header" box

Cheers,
Max

Max, Thanks for the suggestion. I've tried it everywhere - header , footer, etc. I think maybe I will just have to go live without pagination for now.

Hi MindyK,

I did that in a hurry before going away for a week. It works OK with the standard Joomla! template I tested on but may not work with the pagination code from other templates. Which template are you using? What is the pagination code that it generates?

Bob

I am just using the default template on a base install on a test server. I think part of the problem is that I don't know where to put your javascript in my code. Thanks so much for taking the time to help.

Hi MindyK,

It should be OK in either the ChronoConnectivity Header or Footer box. The MooTools Upgrade module should *not* be enabled as this is MooTools 1.1 code.

Please post a link to the listing so I can take a quick look.

Bob

I just sent you the link to the page. Searching on "williams" is a good name to test with. I confirmed that the mootools upgrade is off. I put your javascript at the top of the header block.

When I dug a little deeper this morning, I discovered that we are getting a javascript error:

Error: window.addEvent is not a function, Line: 14

I did some searching and it seems this is a mooTools issue, but my javascript skills are not that great and mooTools knowledge is non-existent. I am now also wondering if maybe this is why I couldn't get the tutorial code to clear the search form boxes to work either?

Thanks again for all your help. I am sure there will be lots of happy folks besides me if we get this figured out.

Hi Mindyk,

As you noticed MooTools isn't loading. The quick fix for this is for you to add

<?php
JHTML::_('behavior.mootools');
?>

into the Listing Header box. Let's try that and see if it works. (The longer fix is to re-write the JavaScript without using MooTools syntax.)

Bob

Heavy sigh! It's not working. The Javascript Error is gone, but the search box is still refershing on load. Just so we can regroup, here's what I have now.

I have form tags turned off because I put them in myself, per the tutorial in the forums about creating a search.

HEADER

<?php
JHTML::_('behavior.mootools');
?>
<?php
$script = "
window.addEvent('domready', function() {
  var pagelinks = $$('div.page-inactive a');
  var form = $$('form[name=connectivity]')[0];
  var limitstart = $$('input[name=limitstart]')[0];
  pagelinks.each(function(link) {
    var href  = link.getProperty('href');
    var start = href.substr(href.lastIndexOf('start=')+6);
    var title = link.getProperty('title');
    var new_link  = new Element('a', {
      'events': {
        'click': function() {
          limitstart.value = new_link.getProperty('start');
          form.submit();
        }
      },
      'title': title,
      'start': start
    });
    new_link.setText(title);
    link.replaceWith(new_link);
  });
});
";
$doc =& JFactory::getDocument();
$doc->addScriptDeclaration($script);
?>

<?php

// get the number of records returned
$db =& JFactory::getDBO();
global $count;
$count = $db->loadResult();


// get the previous filter strings
$search_surname = JRequest::getString('SURNAME', '', 'post');
$search_firstname = JRequest::getString('FIRST_NAME', '', 'post');
$search_maidenname = JRequest::getString('MAIDEN_NAME', '', 'post');
$search_burialloation = JRequest::getString('BURIAL_LOCATION', '', 'post');

?>


<!-- display the filter box and buttons -->
<form name="adminForm" action="http://www.albionlibrary.org/component/chronoconnectivity/?connectionname=Obituaries" method="post">
<table width="400" border="1" cellspacing="0" cellpadding="4">
  <tr>
    <th align="right" scope="row">Surname</th>
    <td><input type="text" name="SURNAME" id="SURNAME" value='<?php echo $search_surname; ?>'/></td>
  </tr>
  <tr>
    <th align="right" scope="row">First Name</th>
    <td><input type="text" name="FIRST_NAME" id="search_firstname" value='<?php echo $search_firstname; ?>'/></td>
  </tr>
  <tr>
    <th align="right" scope="row">Maiden Name</th>
    <td><input type="text" name="MAIDEN_NAME" id="search_maidenname" value='<?php echo $search_maidenname; ?>'/></td>
  </tr>
  <tr>
    <th align="right" scope="row">Burial Location</th>
    <td><input type="text" name="BURIAL_LOCATION" id="search_buriallocation" value='<?php echo $search_buriallocation; ?>'/></td>
  </tr>
  <tr>
    <th align="right" scope="row"> </th>
    <td><input type="submit" name="filter" id="filter" value="Submit" /> <input type='reset' name='reset' id='reset' value='Reset' /></td>
  </tr>
</table>
<hr />



<!-- Start the List -->

<h3>Obituary List</h3>



<table width="550" border="1" cellspacing="0" cellpadding="4">
<?php
global $count;
if ( !$count ) {
echo "<div>Sorry, no results were found.</div>";
}
else { 
?>

<?php
}
?> 

BODY

<tr>
    <td colspan="5" bgcolor="#37223b"><strong><span style="color:#FFFFFF;">{SURNAME}, {FIRST_NAME} {MIDDLE_NAME}</span></strong></td>
  </tr>
<tr>
    <td width="142"> </td>
    <td align="right">Maiden Name:</td>
    <td>{MAIDEN_NAME}</td>
    <td align="right">Spouse:</td>
    <td>{SPOUSE}</td>
  </tr>
  <tr>
    <td> </td>
    <td align="right">Birth Date:</td>
    <td>{DATE_OF_BIRTH}</td>
    <td align="right">Veteran:</td>
    <td>{VETERAN}</td>
  </tr>
  <tr>
    <td> </td>
    <td align="right">Date of Death:</td>
    <td>{DATE_OF_DEATH}</td>
    <td align="right">Burial Location:</td>
    <td>{BURIAL_LOCATION}</td>
  </tr>
  <tr>
    <td> </td>
    <td align="right">Obituary Date:</td>
    <td>{OBITUARY}</td>
    <td align="right">Burial Date:</td>
    <td>{DATE_OF_BURIAL}</td>
  </tr>
  <tr>
    <td> </td>
    <td align="right">Obituary Source:</td>
    <td>{OBITUARY_SOURCE}</td>
    <td align="right">Photo:</td>
    <td>{PHOTOGRAPH}</td>
  </tr>
  <tr>
    <td> </td>
    <td align="right">Death Notice:</td>
    <td>{DEATH_NOTICE_SOURCE}</td>
    <td align="right">Notice Date:</td>
    <td>{DEATH_NOTICE}</td>
  </tr>
  <tr>
    <td> </td>
    <td align="right">Survivors:</td>
    <td colspan="3">{SURVIVORS}</td>
  </tr>
  <tr>
    <td> </td>
    <td align="right">Notes:</td>
    <td colspan="3">{NOTES}</td>
  </tr>
  <tr>
    <td> </td>
    <td align="right">See:</td>
    <td colspan="3">{SEE}</td>
  </tr>
  <tr>
    <td> </td>
    <td align="right">See Also:</td>
    <td colspan="3">{SEE_ALSO}</td>
  </tr>

FOOTER

</table>
<?php
global $count;
if ( !$count ) {
echo "Try searching on just part of a name or location.";
}
else {
?>
{pagination}
<?php
}
?>
</form>

Hi MindyK,

I've made some progress; the pagination code in your template is a little different from the JA-purity code :-(

Please try replacing

var pagelinks = $$('div.page-inactive a');

with

var pagelinks = $$('a.pagenav');

If that doesn't work then by all means email or PM me a SuperAdmin login and I'll test out the changes directly.

Bob

It worked!

Thank you so much! I will indeed buy you a beer! 😀

Hi, I've applied the fix(es) above (including I think domReady instead of domready...) and can't get it to work. All is well when joomla core sef urls are turned off but I can't do that. Given the 9000 wheels that are turning on this site, I can't use 3rd party extensions to selectively turn off sef.

I've been through this forum and haven't found a fix yet. If I could somehow turn off SEF URLS for CC I'd be fine but that's not in my wheelhouse (is there a way to do this using htaccess?).

Any suggestions?

Thanx a ton

Mark

Hi Mark,

First, I'm pretty certain that 'domready' with no caps is the correct event syntax for the MooTools addEvent here.

It a while since I wrote this but I think the JavaScript here uses the links in the template pagination code to set the value of a form input. How you find the links varies depending on the template. But I think that even with SEF URLs on the parameter must be there somewhere??

What is the HTML for your pagination block?

Bob

Hi Bob,

<div style="padding:0px 40px 10px 40px; margin-top:0px;">{pagination}</div>

Not sure if this is what you're looking for...

This is the url I'm taken to:
http://www.scratchgolfer.org/my-area-logged.html?connectionname=scratchtracker_rounds&start=5
This is the url I need:
http://www.scratchgolfer.org/my-area-logged/index.php?option=com_chronoconnectivity&connectionname=scratchtracker_rounds&start=5
(filtering for 5 results, showing the second page)
Assuming this helps...

ALSO - I just realized I'm posting in the chronoforms forum, the probs I'm having are with chronoconnectivity pagination - sorry if I've confused things...

Hi Mark,

As a workaround please try adding an option hidden input in the header box:

<input type='hidden' name='option' id='option' value='com_chronoconnectivity' /> 

It might just work . . .

Bob

PS I'll move the thread over to the CC forum

Thanx Bob
I tried that as well earlier but no dice.

Strange though,

If I change the dropdown number, then click 1,2,next,etc., I'm taken to the jomsocial profile page.
If I then navigate back, and click 1,2, etc, it works. If I change the dropdown number again, I'll have to have one bad redirect then it works fine.

Stumped...

Hi Mark,

It looks as though adding &option=com_chronoconnectivity to the URLs would make it work. I couldn't spot any JavaScript on the page for changing the links though??

Bob

PS I noticed that you have both MooTools 1.11 & 1.12 loading.

Is there any way I can add that to the urls?
Again, if I turn off SEF urls everything works fine...

Re mootools, I have a "ticker" that won't work unless I load mootools in that particular script...?

Hey Bob,
Now the "delete this record" button doesn't work -
If there's not an easy solution to this, I was wondering if I could get some help writing some htaccess code that would skip all chronoconnectivity links?

Thanx again
Mark

Hi Mark,

I'm no expert on htaccess. Can you set sh404SEF to ignore ChronoConnectivity links?

You can certainly re-edit them with JavaScript but it's a complete pain to have to do that :-(

Bob

Unfortunately Sh404SEF isn't playing nice with the rest of my site - when I turn it on things really get jacked up...

Hi Mark,

Sorry, my mistake. I had assumed you had sh404SEF on. if it's just the Joomla! SEF then there may be a fix to get round this. Someone posted a week or so ago that the Joomla! SEF drops anything after the first parameter.

*** can't find the post. I'll try again later.

Bob

No sweat
I went ahead and used SH404 SEF and re-posted all the articles to facebook. Painful, but I used a new feed submit component that's way better than what we were using

Thanx!

Mark