JQUERY help needed!

Site URL: https://corn-apricot-zn88.squarespace.com/personnal

I have a script on my site that allows HTML to be used in BLOG titles. 

The issue is that I am also using the Squarewebsites "Lazysummaries" to have more than 30 show. 

The AJAX works for the first 30, then it does not work. you can see at "Carrie" that her text is not split. (the 3-4 before her did not need a second line). I have tried various versions of adding .lazy-summary to the script  but nothing works and finding out what I need to do to get this working is beyond my skill set. 

This is the code: 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
<script>
$(function(){
  $(".summary-title").each(function(){
    $(this).html($(this).text());
  });
});
</script>

no PW on site right now. 

Just now, deaton72 said:

Site URL: https://corn-apricot-zn88.squarespace.com/personnal

I have an AJAX script on my site that allows HTML to be used in BLOG titles. 

The issue is that I am also using the Squarewebsites "Lazysummaries" to have more than 30 show. 

 

Could you tell us more about the issue/conflict with the plugin and your script

@bangank36

It works for the first 30 summary items, but then won't work. 

Because I am using the LAZYSUMMARIES script to load more than 30 I think that the .summary-title, may be called something else past 30, but I don't know what that is. 

On this page: https://corn-apricot-zn88.squarespace.com/people  

The html has the title divided into two lines of text, one red and one black. Carrie (first one in 6th row) and everyone after does not work. 

On 11/1/2021 at 3:04 PM, deaton72 said:

I have an AJAX script on my site that allows HTML to be used in BLOG titles. The issue is that I am also using the Squarewebsites "Lazysummaries" to have more than 30 show. 

The AJAX works for the first 30, then it does not work. 

The jQuery script in your question doesn't use Ajax or take the 'lazy loading' into account. It runs once when the page loads the first 30 items. However, it doesn't run again when additional summary items are added with Ajax.

The code needs to be amended to run whenever summary items are added. You can do this by using the hooks built into Lazy Summaries (see below) or by using a mutation observer to look for new elements.

  allItemsAddedFunction: function(sum_block, jsonData) {
            //runs after all of loaded items appended to summary block
        },
        refreshFunction: function(sum_block, jsonData) {
            //runs after refresh summary block (appending items, sorting..)
        }

It's worth noting that the script above was written in 2016 when jQuery 2.2.2 was current. However, this now has known security vulnerabilities and should be replaced with a newer, safer version.

@paul2009 Thank you! I did just update the JQuery to 3.5.1

I will try the Lazysummaries settings and see what happens! Thank you for your help.

@paul2009  Okay. I tried to add the hooks with the code for the html call in between. This is also what a friend told me to do (after I showed him).

Nothing is happening! I feel like something is missing at the front end. I don't know anything about hooks and minimal about these scripts. Just enough to mess things up 🙂  

allItemsAddedFunction: function(sum_block, jsonData) {$(function(){
  $(".summary-title").each(function(){
    $(this).html($(this).text());
  });
});  
            //runs after all of loaded items appended to summary block
        },
        refreshFunction: function(sum_block, jsonData) {$(function(){
  $(".summary-title").each(function(){
    $(this).html($(this).text());
  });
});  
            //runs after refresh summary block (appending items, sorting..)
        }

Hi @deaton72, did you ever figure this out?
I'm having a similar problem, and also have no idea where/how to add the hook. Any help would be greatly appreciated!