[Resolved] Ajax filtering destroys layout

[Author]

Posts

[axelL]

the problem i have is after i update the request with ajax, the style of each elemnt gets scrumbled...
In detail after you slect a filter item all the links are gone until you reload the the site completely?!
why?

Item before ajax load

<div id="post-1698" class="et_pb_portfolio_item et_pb_grid_item post-1698 project type-project status-publish has-post-thumbnail hentry project_category-logos project_category-web-design">

								<a href="<em><u>hidden link</u></em>">
											<span class="et_portfolio_image">
												<img src="<em><u>hidden link</u></em>" alt="Mutterstadt">
                                              <span class="et_overlay"></span></span>
										
			
									<h2>Mutterstadt</h2>
  								</a>
				
									<p class="post-meta">
Mutterstadt, Deutschland<br>

  </p>
</div>

And after reload:

<div id="post-436" class="et_pb_portfolio_item et_pb_grid_item post-436 project type-project status-publish has-post-thumbnail hentry project_category-logos project_category-web-design">

								<a href="<em><u>hidden link</u></em>"></a>
											<span class="et_portfolio_image">
												<img src="<em><u>hidden link</u></em>" alt="Solarpark" münchweiler="">
                                              <span class="et_overlay"></span></span>
										
			
									<h2>Solarpark Münchweiler</h2>
  								
				
									<p class="post-meta">
Münchweiler<br>
Anlagengröße: 0
  </p>
</div>

As you can see tha a-Tag is getting closed where it shouldn't be.
any idea why?

[Nigel Supporter Languages: English (English ) Spanish (Español ) Timezone: Europe/London (GMT+01:00)]

When you say load the page by ajax, you mean when updating the results by changing the filters on a parametric search page, correct?

It looks as if you must have some custom JavaScript code running from your theme or from another plugin which is responsible for the issue.

If you change your parametric search so that, instead of the page updating via ajax it reloads the page when you hit search, you will probably find the problem doesn't exist.

When the page is refreshed, some custom JS is triggered which is doing something to your page contents. If you bring in new contents into the page via ajax without a page refresh, then the custom JS is not making the same changes to the new content that it does to the content on the page when it is first loaded.

If you can identify what your custom code does, you can re-trigger it whenever the page is updated via ajax.

Edit your parametric search view and in the filters section you are able to add some custom JS. You will see that there is a button to add Frontend events. We want to trigger our custom code that attaches the click handlers to run when the parametric search results have been updated, so select Parametric search, and then 'The parametric search results have been updated'.

That will add the scaffolding to attach an event handler for 'js_event_wpv_parametric_search_results_updated', but you will need to determine what custom code it should then run.

[axelL]

I have checked against any custom js code which is running, but the thing is the code gets "scrambled" when its gets load by the ajax filtering. So and there is no other code triggered.
the code " after reload" is meant by me that its the code which is produced by the ajax "reload".
Therefor the ajax loading is somehow messng up the formatting of the a tag.
the first codesnippet is the correct one! and after the ajax filtering its the second snipped, which is not the same...
you might try it yourself :
hidden link
and you will see the linking is gone after triggering the filter with the ceckboxes...

[Nigel Supporter Languages: English (English ) Spanish (Español ) Timezone: Europe/London (GMT+01:00)]

When I visit your link I can see the problem, but I cannot see what is causing it.

I doubt that the HTML that is being delivered over ajax is different from the HTML being delivered on a page reload, these ajax issues nearly always relate to JavaScript event handlers that are lost when the content is replaced by ajax.

To verify, can you please test your site with a minimal install.

You should switch to a 'standard' theme, either the Toolset starter theme or the default WordPress twentysixteen theme together with the corresponding theme integration plugin, either option is available from your downloads page: https://toolset.com/account/downloads/

Now test your site.

If switching theme alone does not resolve the issue, disable your non-Toolset plugins.

Does that resolve the issue? If so, reactivate your plugins one-by-one, testing each time, until the problem reappears, which would indicate where a conflict occurs.

Please report back to me with the results of your testing and then I will be able to advise you how to proceed.

Thanks for your patience.

[axelL]

Okay, so after double checking everything with the standart theme from the toolkit. i found out that the divi-builder plugin is causing this issue. BUt isn't divi listed as a compadible theme for the types-toolkit?

And how can i find a workaround for this? any ideas?

Thanks in advance...

[Nigel Supporter Languages: English (English ) Spanish (Español ) Timezone: Europe/London (GMT+01:00)]

Are you using the Divi Integration plugin?

Layout doesn't work out-of-the-box with other themes, it requires integrating. That can be done manually, and we have prepared some plugins for popular themes to do it, but you have to install the plugin.

https://toolset.com/download/toolset-divi-integration/

[axelL]

I don't use Layouts TM, just Views and Types... So therefore the divi integration plugin wouldn't neither be necessary nor usefull , doesn't it?

But i will try and see if its changing anything..
update: can't eaven active it, cause the lack of Layouts Oo...

[Nigel Supporter Languages: English (English ) Spanish (Español ) Timezone: Europe/London (GMT+01:00)]

No, sorry, if you are not using Layouts you don't need the integration plugin.

Can you confirm from your testing that switching to a default theme eliminates the problem, and that the problem only occurs when using Divi?

If that's the case I will escalate this thread so that our developers can investigate if there is a compatibility issue with Divi.

To do so I will need to take a snapshot of your site for testing. I will set your next response as private so that you can supply credentials for WordPress access and FTP. You might want to create a temporary admin user which you can later delete. I will need to temporarily install a backup plugin to make a copy of your site which I will delete when finished.

Can you please also confirm a URL for a page where I can see the problem.

[Nigel Supporter Languages: English (English ) Spanish (Español ) Timezone: Europe/London (GMT+01:00)]

We will need something to be able to test the issue.

Can you please set up a test site which has the issue described. Then install the duplicator plugin to make a copy of the test site. https://wordpress.org/plugins/duplicator/

It will create 2 packages, an installer package and an archive package, and you will need to send both of them (via dropbox, google drive or similar). If the duplicator plugin fails for some reason, you could try to make a site copy using All in One WP Migration.

I will again mark your next reply as private so that you can post the backup archive urls. I'll let you know when I have taken a copy if you then want to delete them.

I can then make them available to our developers for testing to see if they can isolate the issue.

[axelL]

Okay so here we go 😀

sorry that it took me so long. but i had to clear out which kind of information i could last in the clone and stuff...
Archive

removed

Installer

removed

[Nigel Supporter Languages: English (English ) Spanish (Español ) Timezone: Europe/London (GMT+01:00)]

I ran some more tests using the default theme twentysixteen and creating a test page to display your View which didn't require the use of the Divi pagebuilder and saw that even then the problem occurred.

I have escalated this issue to our developers to investigate further, and someone will update you with news when we have some.

[Adriano]

Hello,

I’m Adriano, Toolset support lead and I have been escalated to this thread. I’ll give my best to help you to achieve your needs through Toolset components.

I'm really sorry about that problem. I was debugging an issue like this one last week and we managed to fix that. Please tell if it does sounds like your problem.

When you call a View inside of another one (mainly in Filter & Loop Output, last section), then after doing an AJAX call, the results from the first View is displayed for both included Views. So if you have this below:

View 1:

Filter & Loop Output:
[myview2]
[myview3]
[views-filter]
[views-layout]

View 1 is AJAX, so as soon as you make an AJAX call, the results of myview2 will replace the results of View 1, wrongly.

We've fixed that and we will include a fix for this in Views 2.1 later this week.

[axelL]

Hy Adriano,
no its note like your problem its just one view with ajax filterning (as stated above)...
but maybe your fix is also able to fix my problem. Do you have a beta that i could try?

[Nigel Supporter Languages: English (English ) Spanish (Español ) Timezone: Europe/London (GMT+01:00)]

Axel

I have done some testing with the development version of Views and it does appear to have fixed your problem, with and without using Divi builder.

We don't have a beta version available to distribute, the next version is still in development and is not fully stable, but it is due to go into testing soon and should be available soon (we are hoping to release it next week, if not, the start of the following week).

-Nigel

[Mohammed]

Hi,

This is an update that we've launched a new Toolset release.

Please, backup your website and update WordPress and all Toolset plugins to the latest version then test the issue.

I'm waiting for your feedback.

Thanks.