Load More pagination problem

Need Help
#1

Hi! In my plugin component I want to add a “Load More” button to load more projects. After clicking the button, new projects are loaded, but not in the way I would like. New projects are loaded as a separate project list instead of being included in the main project list. What am I doing wrong?
/plugins/…/projects/componens/list/default.htm

{% set items = __SELF__.projects %}
{% if items %}
	{% ajaxPartial '@posts' %}
{% else %}
	<div class="alert">
		<strong class="title">No projects found</strong>
	</div>
{% endif %}

/plugins/…/projects/componens/list/posts.htm

<ul class="projects-list">
    {% partial '@post_items' items=items %}
</ul>
{% if items.hasMorePages %}
    <button
        data-request="onAjax"
        data-request-update="{ _self: '@post_items' }"
        data-request-success="this.remove()"
        data-request-data="{ page: {{ items.currentPage + 1 }} }"
        data-attach-loading>
        Load More
    </button>
{% endif %}

/plugins/…/projects/componens/list/post_items.htm

{% for item in items %}
<li>
    <h3><a href="">{{ item.name }}</a></h3>
</li>
{% endfor %}
#2

One thing I notice is you are using component partials as instead of CMS partials. I would move them to your theme instead of storing them with components, to allow for proper abstraction.

The default markup in a component is boilerplate code, with the aim to provide a simple example of how it can be used.

See the docs for more info: