I am trying to feed a value to the input using Jquery.val() but the input filter does not trigger the Jplist refresh/update. After adding a space in that input filter triggers the Jplist refresh.

Tried adding the Jquery.trigger("keypress") to simulate the user key press but it still does not trigger the Jplist refresh. Does JPList has a way to refresh the list similar to data-clear-btn-id which clears the filters?

Hi! Is there a way to use a standard class to define items? i don't can use "data-jplist-item" attribute.

'text search' does not like the 'space bar' so I can only search for 'The sunlit face' in the example below by pasting it into the 'Description' search. However, type it in and the space continually disappears.

https://www.jplist.org/examples/nature

I am trying to remove elements from the list on a button click. But when I click the button, the last item not deleted. I have to click button 2 times to remove all items.

Can any help? So all items can be removed in a single click. (What's wrong in my code).

https://codepen.io/nasir-mehmood/pen/YbJGog

if the rangeslider is put into a collapse menu, and it is hidden by default. The slider is not initialized. In the old version, there was no such problem.

I would like to filter class names like class="51-60" or class="70+" but it seems the filters are only working with letters in class names, so things like data-path=".51-60" is not working.

Hello
When an EventListener was added, all element of jplist form run the event.
Could you add a reference to the element who triggered the event ?
Is-it possible to add the previous value and new new value of element ?

Hi

Tell me how you can nastify the filtering on the logic "or". Now there is an opportunity to use only "and". In the old version there was such an opportunity. An example in the screenshot.
And I also have a small problem - when there are no results, the pagination buttons remain active.

Thank you,
Great plug-in

Is it possible to reset all fields (or ones with data-id) after button press, while using localStorage or sessionStorage?
I tryed this and this, but without any luck.
Maybe i'm doing it wrong, i have 4 select filters (each one is defined with diferent data-id) and a search field. Reset works fine if i don't use storage or use cookies, but then on page refresh no values are saved.

There is no animation extension added in this version.

How to go back to first page after a filter is selected? It stays on current page.

First of all, I want to express my gratitude for your excellent work, this plugin does not really have competitors in its functionality. I have some questions.

1. When will it be possible to download this plug-in via npm?
2. And how can I initialize the plugin if I want to connect it as a module ES6?

I note that there was store locator 'Places Autocomplete Control' with a load of relating demos. Are there any plans to update these controls please?

Thanks
Shane

Previous version had Auto-complete, please implement it. Also if its possible to implement a search with a button that you can have on any subpages that takes you to the filter page and then search/filter. /thanks

How is it possible to get the total number of items before/after filtering using multiple filters or change please?
e.jplistState.itemsNumber only returns the items on the first page unfortunately
and this https://www.jplist.org/documentation/controls/counter doesn't do the trick either unfortunately. Is there a way to globally get the total number of items ?

Hi,
Looks like a great upgrade! Thanks.

I'm interested in understanding where I define the HTML DIV structure now?

It used to documented and along the lines of....

		$('#demo').jplist({				
			itemsBox: '.list' 
			,itemPath: '.list-item' 
			,panelPath: '.jplist-panel'	
    			    //save plugin state
		    , storage: 'localstorage' //'', 'cookies', 'localstorage'			
		    , storageName: 'sticky'
		});
	});

I'm also interested if I utilize 'sticky' as above and before?

Any scope for 'Infinitive loading' or a 'View More' button in terms of pagination?

Happy to pay for such enhancements.

Thanks

Hi,

I would like to use your plugin, but my data comes from server-side.

How can i call an ajax (or else) function to populate my data with your plugin ?

Thanks

sorting of dates isn´t working.
Due to a naming issue:

• in the documentation you want the html-attribute "data-datetime-format"
• in your code you are looking for the html-attribute "data-date-format"

we´re trying to use the datesorting in a dropdown filed

Would it be possible to enhance JPList to hide data controls, by the data name, where the counter control = 0 on either of the two data modes?

I have several examples where this would be extremely useful in narrowing down the available controls/filters to be more meaningful and logical for the end users.

For example:

Upon selecting a Cruise Line from a list, the Cruise Ship control would only display the relating 5 ships instead of a list of 500 ships with (0) next to them.

Upon selecting a Destination, only the available Ports of Call would display.

There are instances where (0) is more appropriate, therefore this would have to be an optional data attribute?

Many thanks and keep up the good work.

Do you have a demo for using a reset button to reset just radio button text filter controls, for example? I looked at the reset API and tried many different times, but can't seem to get it to work. Thanks.

Is it possible to request data using ajax and json as per previous version

When this option data-jump="top" is enabled for pagination, it applies to all controls. Can I enable it only for pagination, and for other controls to disable?

Can't add multiple classes on data-selected-class spaces is not acceptable :(

Hi. Thanks for this work.

The css has some styles that will clash with many site designs, like font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif; It would be great if the css could be splitted: One providing the core css absolutely necessary for placement etc, and one second css file with the css specific to the design.

Like with http://github.hubspot.com/vex/ that could result in support for included themes, but more important is that it owuld make it easier to make jplist for the the site design.

The resetContent function does'nt exist in es6 version

Is it possible to request data using PHP/Mysql as in previous version, or should we use the old version? If not what do you think it´s best "plugin" for that type of listening? /thanks

if I write group name as allProperties the filter was not working and after just changing the name to allproperties it started working. it took me two hours to inspect that Problem :(

I'm missing the date filters of the old jQuery jplist. Is it planned to integrate a such function? :)

Hi, using this on IE 11 and below gives me the error:
Object.assign is not a function

Can you please add in the polyfill workaround for this.
Was this meant to be fixed here?:
#3

I see 1 instance of:
this.settings=Object.assign({}
in jplist.min.js

Hi,
I'm trying to dynamically populate the values and classes in each of the different controls and filters.

For example, in the case of the check box filter control, the fields enclosed in percentages (%) dynamically populate. If I need to assign 5 TravelTypes to one item, I have to create 10 database fields.
5 for each label written in proper case with spaces and then 5 for each class, written in lower case with no spaces. Even using CSS to convert the case does not overcome the spacing issue.

<div data-jplist-item>
    <div class="%TType1-LowerCase+NoSpaces%">%TType1-UpperCase+Spaces-Label%</div>
    ....
</div>

<!-- item 2 -->
<div data-jplist-item>
   <div class="%TType2-LowerCase+NoSpaces%">%TType2-UpperCase+Spaces-Label%</div>
    ....
</div>

<!-- item 3 -->
<div data-jplist-item>
    <div class="%TType1-LowerCase+NoSpaces%">%TType1-UpperCase+Spaces-Label%</div>
   <div class="%TType2-LowerCase+NoSpaces%">%TType2-UpperCase+Spaces-Label%</div>
    ....
</div>

Are you aware a better way of doing this or are there any changes to the script that to avoid this?
i.e. ignoring spaces and case sensitivity would reduce the database fields by 50% and simplify the setup.

Thanks
Shane

Hi is it possible to add a class to those buttons (or make them disabled) not matching a current selection? Let’s say i have two path filter controls in my application.

The first one says: color red, color blue, color green.
The second sasy: shape triangle, shape circle, shape rectangle.

When i click e.g. on »color red« all buttons in the second row should be disabled that do not match »color red« too.

That would make the »no results found« obsolete as you give the visitor a hint what ist matchable and what is not.

Hi

After the last update, pagination does not work (data-type="page").
Prev and Next buttons it's working.
Here you can see the demo

Thanks

Hi there,

currently the range slider only works in a fluid way. Is there a possibility to move the slider holder stepwise?

I'm not seeing any documentation for callback functions. In jquery plist there was redrawCallback . Any similar functions for this version? I have a function that fails on pagination page change and needs to be called as each page is shown.

Hi all,

I was wondering if there is a way to access elements in the prev / next pages.

A bit more info: I have a map on the page and it's using all the divs in the page to generate markers.
After that, I apply the pagination so that all markers can be created in the map.

However, I want to update the markers when the user filters out some divs, I can't really do that unless I can somehow have access to the divs in the other pages, is there any way to do this?

Is exact match available for the checkbox text filter? It was requested as an enhancement on the old jplist. For example, I have a list of names and only want to find "Rob." Not Robert, Roberta, Robin, etc.

Thanks!

Is there a way to use a custom Range slider like for example ion.rangeSlider and have an apply filter event that would trigger the list filtering. Or simply is there an overall apply filter event that enables you to set the filters and then hit a button to trigger the filter event.

I have this problem that when I use checkbox filter the Range Slider will not work. And there is no error on the console. What might be the problem?

But if I turn of the Checkbox filter the Ranger Slider works fine.

Hi, Is there a way to add change events on the Layout Controller?
its because I have to reinstantiate other plugins in the list so that they will work properly.

On the previous version of the pagination when you filter(view all) or had less items in your list, the buttons was hidden. In the new version they are visible at all time..

Hello,
looks like the plugin will not accept two Dropdown sort filter at the same time, only one will work and the other one will just be ignored. for example i have this setup

		<div class="dropdown mr-3"
			data-jplist-control="dropdown-sort"
			data-opened-class="show"
			data-group="programs"
			data-name="sortText">
			<button class="btn btn-outline dropdown-toggle"
				data-type="panel"
				type="button">Title/Desc
			</button>
	
			<div class="dropdown-menu bg-teal-600"
				data-type="content"
				aria-labelledby="dropdownMenuButton">
				
				<a
					class="dropdown-item"
					href="#"
					data-path="default">
					Title/Desc
				</a>
	
				<a
					class="dropdown-item"
					href="#"
					data-path=".title"
					data-order="asc"
					data-type="text">
					<i class="fa fa-sort-alpha-up"></i>
					Title A-Z
				</a>
		
				<a
					class="dropdown-item"
					href="#"
					data-path=".title"
					data-order="desc"
					data-type="text">
					<i class="fa fa-sort-alpha-down"></i>
					Title Z-A
				</a>
			</div>
		</div>
	
		<div class="dropdown mr-3"
			data-jplist-control="dropdown-sort"
			data-opened-class="show"
			data-group="programs"
			data-name="sortNumbers">
			<button
				data-type="panel"
				class="btn btn-outline dropdown-toggle"
				type="button">Metrics
			</button>
	
			<div class="dropdown-menu bg-teal-600"
				data-type="content"
				aria-labelledby="dropdownMenuButton">
			
				<a
					class="dropdown-item"
					href="#"
					data-path="default">
					Metrics
				</a>
				
				<!-- downloads -->
				<a
					class="dropdown-item"
					href="#"
					data-path=".downloads"
					data-order="asc"
					data-type="number">
					<i class="fa fa-sort-numeric-up"></i>
					Download
				</a>

				<a
					class="dropdown-item"
					href="#"
					data-path=".downloads"
					data-order="desc"
					data-type="number">
					<i class="fa fa-sort-numeric-down"></i>
					Download
				</a>
			</div>
		</div>

now if i have both of them on the HTML, only the first one will actually do the sort, the second sort will not trigger anything.

Hi,

I am unable to find ajax data source example for v1.2?

Thanks,
Kaleem

'Infinitive loading' or a 'View More' button in terms of pagination.
https://infinite-scroll.com/demo/full-page/