Issue with JQuery show method not functioning correctly in Prestashop

I am using prestashop 1.6.x.x along with the blocklayred navigation module to filter results on my category list page. I want to hide the category description when filtering the results...

I added this code which hides the category description, but it does not show the category description back when unchecked...

$(document).ready(function () {
$('.checkbox').on('change', function () {
$("#categorydesc").toggle(500);
});
});

Below is the code of the module:

var ajaxQueries = new Array();
var ajaxLoaderOn = 0;
var sliderList = new Array();
var slidersInit = false;

// Rest of the code goes here...

/**
* Copy of the utf8_decode() function in PHP.
*/
function utf8_decode (utfstr) {
var res = '';
for (var i = 0; i < utfstr.length;) {
var c = utfstr.charCodeAt(i);

if (c < 128)
{
res += String.fromCharCode(c);
i++;
}
else if((c > 191) && (c < 224))
{
var c1 = utfstr.charCodeAt(i+1);
res += String.fromCharCode(((c & 31) << 6) | (c1 & 63));
i += 2;
}
else
{
var c1 = utfstr.charCodeAt(i+1);
var c2 = utfstr.charCodeAt(i+2);
res += String.fromCharCode(((c & 15) << 12) | ((c1 & 63) << 6) | (c2 & 63));
i += 3;
}
}
return res;
}

Answer №1

Here is a code snippet that monitors page changes based on filters. If filters are selected, the description is hidden; otherwise, it is displayed.

Best regards,

$('#').bind("DOMSubtreeModified",function(){
    if ($('#enabled_filters').length) {
       $("#categorydesc").hide();
    } else {        
       $("#categorydesc").show();
    }
});

Edit:

$('.product_list').bind("DOMSubtreeModified",function(){
        if ($('#enabled_filters').length) {
           $("#categorydesc").hide();
        } else {        
           $("#categorydesc").show();
        }
    });

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the best way to combine jQuery objects in order to apply CSS styles collectively?

If I have a custom function that takes in multiple jQuery objects: customFunction($('.content'), $('h1'), $('input[type=button]')); The function is defined as follows: function customFunc ...

Steps on verifying if an email is already in the database and showing an error message through AJAX

My current goal is to implement a feature where, during the user login process, the database is checked to see if the email being used has already been registered. If the email is found in the database, an error message "Email address is already taken" sho ...

Unable to scroll through embed code on iOS responsive devices

-webkit-overflow-scrolling: touch; overflow-y: scroll; I have attempted using this code but unfortunately it is still not functioning as expected. The issue seems to only occur on iOS responsive devices, as it works fine on other devices including MAC. ...

Unable to change the bootstrap variables

I have been attempting to customize Bootstrap colors by referring to the documentation, but unfortunately, no changes are being applied. My setup includes react-bootstrap@2 and bootstrap@5 Below is my main sass file: // The inclusion of these two imports ...

Guide for splitting an HTML webpage into 3 separate divs with individual scrolling feature

Currently, I'm working on creating a website with three columns that allows users to scroll down each one independently. I attempted to set the columns at 33% width, but whenever I add content, a strange gap appears at the bottom of the screen and pr ...

Sending PHP session data to AJAX URL

I am currently facing an issue where I need to pass a session variable into a page that is loaded via AJAX. Below is the code snippet I have been using: jQuery(document).ready(function(){ $("#userdetail").click(function() { $.ajax({ url: "userdetai ...

Ways to deactivate a button within a Kendo Grid cell

I am trying to include 2 buttons in a cell, where one button calls a specific function and the other button disables the previous button that calls the function. In my template column, I have implemented the following: return '<button kendo-button ...

Refreshing the dropdownlist data from the database without the need to reload the entire page

I am searching for a way to refresh data in a dropdown list after clicking a button. It is crucial that only the dropdown list form reloads. // Controller View public ActionResult AddRelease() { var Authors = _context.Authors.ToList(); ...

Issue with border rendering on triangles in CSS on IE8

I currently have a horizontal navigation bar with triangle borders inserted using :before and :after for each list item. This creates the illusion of a white bordered point on the right side of each list item. The issue I'm facing is that this design ...

Element mysteriously concealed in certain Safari cases, consistently visible in Firefox and Chrome

A new angular application has been developed as a "bounce" page for an upcoming social iOS app currently in public beta. Users have the ability to share their profiles by simply providing a link to the site. If the page is accessed via an iOS device w ...

What is the method for activating scrolling in an inner div instead of the browser window?

In the code snippet provided, I am encountering an issue where the browser window scrolls instead of the specified div with overflow-y: scroll when minimizing the browser window. How can I ensure that scrolling occurs within the div itself without making ...

Establishing the default tab in JavaScript

Here's the JavaScript code snippet I have: jQuery(document).ready(function($) { // filtering subcategories var theFilter = $(".filter"); var containerFrame = $(theFilter).closest(".container-frame") var filterHeight = $(".filter").children("li") ...

What is the best way to align my two buttons in the center?

I'm having trouble aligning my two buttons to the center. Additionally, I'm not sure how to remove the gray color from inside the buttons. Here is the code: index.html <!DOCTYPE html> <html> <head> <met ...

extract element from a string with the help of jquery

When using AJAX to request HTML from a page, the process involves sending a request like this: function getHTML() { //set ajax call var options = { url: '/Controller', type: 'GET', d ...

Utilizing jQuery to load HTML content into a div restricts my ability to navigate back and forth seamlessly

I am new to jquery and currently working on my first project. In my index.php file, I have included: header.html indexview.html footer.html. The indexview.html file consists of two divs - one for the menu on the left and another (div id="content") f ...

Getting started with AJAX for newbies: Loading a webpage in a whole

Can anyone provide guidance on the optimal approach to implementing AJAX? I recently upgraded a classic ASP site to .Net, and I'm facing a situation where I want to display a slow page quickly. Some of the data on the page takes time to load, so I&ap ...

Using jQuery to send information to a freshly opened tab and retrieve the response

I'm attempting to transfer information from ClassA to ClassB. To achieve this, I've set up a hidden form within the view page of ClassA and submitted it to ClassB. <form id="invisible_form" action="classB" method="post ...

After the update to the page, the DOM retains the previous element

I'm currently developing a Chrome Extension (no prior knowledge needed for this inquiry...) and I have encountered an issue. Whenever I navigate to a page with a specific domain, a script is executed. This script simply retrieves the value of the attr ...

Ways to navigate through textarea components within an iframe tag

I am presented with the following HTML structure: <iframe id="screenshare" ref="screenshare" class="fullScreen2"></iframe> To dynamically fill the <iframe> element, I am utilizing JavaScript through the below function: func ...

Some examples of CSS styling that makes the parent element shorter than the child element

Currently, I am engaged in a project aimed at enhancing my understanding of Spring MVC practices. As part of this endeavor, I have embarked on the development of a simplified version of Twitter. Essentially, users can log in, share brief updates, and view ...