Loading with the "pdoPage" button does not work

1

Good evening. Tell me what the problem is

2023-06-09_001208
2023-06-09_0012081920×269 27.7 KB 

   <div class="col-xl-8 col-lg-8 col-md-12 col-sm-12 m-b30">   
                               
                                <div id="pdopage">
                                    [[!+page.nav]]
                                    <div class="row rows">
                                    
   [[!pdoPage?
    &parents=`[[*id]]`
    &element=`msProducts`
    &tpl=`products4`
	&includeTVs=`img,price`
	&limit=`10`
	&ajaxMode=`button`
	&ajaxElemMore=`@INLINE <button class="btn btn-default btn-more">[[%pdopage_more]]</button>`
	&sortby=`{"menuindex":"ASC"}`
]]                                                             
                               </div>
                                 </div>
                                
                            </div>
2

I don’t think you need to specify the &ajaxElemMore attribute in your case.

The &ajaxElemMore attribute defaults to #pdopage .btn-more so it should refer back to your button code OK as long as it’s inside your <div id="pdopage"></div>.

Remove that attribute and then take your button code and place it back in your <div id="pdopage"></div> where you want it to appear. Something like this [untested]:

   <div class="col-xl-8 col-lg-8 col-md-12 col-sm-12 m-b30">
     <div id="pdopage"> 
            [[!+page.nav]]
            <div class="row rows"> 
                  [[!pdoPage? 
                    &parents=`[[*id]]`
                    &element=`msProducts`
                    &tpl=`products4`
                    &includeTVs=`img,price`
                    &limit=`10`
                    &ajaxMode=`button`
                    &sortby=`{"menuindex":"ASC"}
                  `]]
            </div>
            <button class="btn btn-default btn-more">[[%pdopage_more]]</button>
     </div>
   </div>
3

There is no error in the console. But the button is not displayed