Endless pagination - loading on scroll to table.

[pypetey]

Hello,

I've been trying to load paginated data into table but it does not append the data correctly to the table (it's always outside).

[greg4fun]

Hi, I had the same problem it is caused by show_more it creates div inside table. I've managed to repair it but I hate this solution cause it interfences in library source (in any update of library solution will stop working) I've changed show_more.html from: <div class="endless_container"> <a class="endless_more" href="{{ path }}{{ querystring }}" rel="{{ querystring_key }}">{% if label %}{{ label }}{% else %}{% trans "more" %}{% endif %}</a> <div class="endless_loading" style="display: none;">{{ loading|safe }}</div> </div> to :
<tr class="endless_container"><td> <a class="endless_more" href="{{ path }}{{ querystring }}" rel="{{ querystring_key }}">{% if label %}{{ label }}{% else %}{% trans "more" %}{% endif %}</a></td> <td class="endless_loading" style="display: none;">{{ loading|safe }}</td> </tr> and it works perfectly :) just need to find this python lib directory in virtualenv it'll be myEnv/lib/pythonx.x/site-packages/endless_pagination/templates/endless/show_more.html

[macdhuibh]

Thanks Greg, that was extremely helpful!

If your apps templates load before endless's you can just add your modified template to your app in the directory <your app>/endless/show_more.html.

[konrad1234]

Hi Anders, I am having the same problem and neither solution works. Using tr and td stop the entire pagination from working. Any other solutions to stop this from happening?

[greg4fun]

Anders Good point thank you too!!! I totally forgot about this I'm using this solution for userena to customize my templates but didn't think to use it for endless :D :), Konrad take a look at my example http://pastebin.com/fj5GCmRq and here you can see it working: http://exerceo.pl/food/

[macdhuibh]

Hi @konrad1234,

In my project created the template <my project>/<my app>/templates/endless/show_more.html and this overrides the default template:

{% load i18n %}

<tr class="endless_container">
    <td> <a class="endless_more" href="{{ path }}{{ querystring }}" rel="{{ querystring_key }}">{% if label %}
        {{ label }}
    {% else %}
        {% trans "more" %}
    {% endif %}</a>
    </td> 
    <td class="endless_loading" style="display: none;">
        {{ loading|safe }}
    </td>
</tr>

Then in my main template which uses endless I wrap it in a <table>.

[konrad1234]

Thanks Greg and Anders! I'm not sure if we actually had the same problem but I used Greg's example to figure it out. I believe my problem was associated with not implementing the page_template system properly.

[hecrogon]

Hi, thank you very much for this comments, they help me a lot.

I had a little problem with the new "show_more" template, if I scroll down, it doesn't stop of reload contents even when they are repeated. In order to avoid this, just add {% if querystring %} as follow (we can see it in the original file):

{% load i18n %}

{% if querystring %}
<tr class="endless_container">
     <td>
          <a class="endless_more" href="{{ path }}{{ querystring }}" rel="{{ querystring_key }}">
                {% if label %}
                     {{ label }}
                {% else %}
                     {% trans "more" %}
                {% endif %}
          </a>
     </td> 
     <td class="endless_loading" style="display: none;">
          {{ loading|safe }}
     </td>
</tr>
{% endif %}

Best regards

[jturi]

If you want to overwrite the:

your_venv_name/lib/pythonx.x/site-packages/el_pagination/templates/el_pagination/show_more.html

or if you use el_pagination like me:

your_venv_name/lib/pythonx.x/site-packages/endless_pagination/templates/endless/show_more.html

Then palce your custom show_more.html template in your app tempalte folder:

your_app_name/templates/el_pagination/show_more.html

Make sure that your_app_name is above the endless pagination package in the INSTALLED_APPS to overwrite the original:

INSTALLED_APPS = [ 
    '...',
    '...',
    'your_app_name',
    'el_pagination',
]

and

APP_DIRS are set to true:

TEMPLATES = [

{
    'BACKEND': 'django.template.backends.django.DjangoTemplates',
    'DIRS': [os.path.join(PROJECT_DIR, 'templates')],
    'APP_DIRS': True,
    'OPTIONS': {
        'context_processors': [
            'django.template.context_processors.debug',
            'django.template.context_processors.request',
            'django.contrib.auth.context_processors.auth',
            'django.contrib.messages.context_processors.messages',
        ],
    },
},

]

[JediKnightChan]

Previous versions didn't seem to work. Working:

{% load i18n %}

{% if querystring %}
    <tr class="endless_container">
        <td>
            <a class="endless_more{% if class_name %} {{ class_name }}{% endif %}" href="{{ path }}{{ querystring }}"
               data-el-querystring-key="{{ querystring_key }}">
                {% if label %}
                    {{ label|safe }}
                {% else %}
                    {% trans "more" %}
                {% endif %}
            </a>
            <div class="endless_loading" style="display: none;">{{ loading|safe }}</div>
        </td>
    </tr>
{% endif %}