Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Ultimate Member 2.1 - Add search & reset buttons in member directory
<?php
add_action("um_members_directory_head","um_custom_members_directory_head",10, 1 );
function um_custom_members_directory_head( $args )
{
?>
<div class="um-search-submit" style="margin:auto;width:50%;">
<div style="width: 40%;float:left;margin:10px;text-align:center;">
<a href="#" class="um-button um-do-search" ><?php _e("Search","ultimate-member"); ?></a>
</div>
<div style="width: 40%;float:left;margin:10px;text-align:center;">
<a href="javascript:;" class="um-button um-alt um-clear-filters-a"><?php _e("Reset","ultimate-member"); ?></a>
</div>
</div>
<?php
}
@hirenshah

This comment has been minimized.

Copy link

@hirenshah hirenshah commented Jan 25, 2020

Pressing "Reset" doesn't clear the search box, so it just refreshes the directory with the same results. Should it not clear that as well as the filters?

@hirenshah

This comment has been minimized.

Copy link

@hirenshah hirenshah commented Jan 25, 2020

I added added a bit to the code to make it clear the search field as well. Not sure if this is the best way to do it:

/Edit: Added a line to remove the search query from the URL too :)

<?php

add_action("um_members_directory_head", "um_custom_members_directory_head", 10, 1);
function um_custom_members_directory_head($args)
{
	 ?>
	
	<script type="text/javascript">
		function searchClear() {
			var elements = [] ;
			elements = document.getElementsByClassName("um-search-line");

			for(var i=0; i<elements.length ; i++){
				elements[i].value = "" ;
			}
			
			window.location.href = window.location.href.split('?')[0];		
		} 
	</script>

	<div class="um-search-submit" style="margin:auto;width:50%;"> 
		<div style="width: 40%;float:left;margin:10px;text-align:center;">
			<a href="#" class="um-button um-do-search" ><?php _e("Search", "ultimate-member"); ?></a>
		</div>
		<div style="width: 40%;float:left;margin:10px;text-align:center;">
			<a href="javascript:;" onclick="searchClear()" class="um-button um-alt um-clear-filters-a"><?php _e("Reset", "ultimate-member"); ?></a>
		</div>
	</div>

	<?php
}


@hirenshah

This comment has been minimized.

Copy link

@hirenshah hirenshah commented Feb 19, 2020

@champsupertramp, any feedback on this?

@champsupertramp

This comment has been minimized.

Copy link
Owner Author

@champsupertramp champsupertramp commented Apr 26, 2020

Hi Everyone,

I'll be sharing some Ultimate Member customizations & tutorials on my website: www.champ.ninja

Subscribe to my newsletter to get the latest tutorials.

Regards,

@hirenshah

This comment has been minimized.

Copy link

@hirenshah hirenshah commented Apr 26, 2020

Hi Everyone,

I'll be sharing some Ultimate Member customizations & tutorials on my website: www.champ.ninja

Subscribe to my newsletter to get the latest tutorials.

Regards,

Doesn't really answer the question, so I assume you are going to cover this on your website?

@champsupertramp

This comment has been minimized.

Copy link
Owner Author

@champsupertramp champsupertramp commented Apr 27, 2020

Hi @hirenshah,

You can try this to clear the filters:
jQuery(".um-directory .um-clear-filters-a").trigger("click");

Also, thanks for letting me know about the Contact form issue on my website! I already have contents ready. Just getting enough subscribers to receive the newsletter when i published the tutorials/tips.

Regards,

@hirenshah

This comment has been minimized.

Copy link

@hirenshah hirenshah commented Apr 27, 2020

You can try this to clear the filters:
jQuery(".um-directory .um-clear-filters-a").trigger("click");

There isn't much point in even trying that lol :p

As per my first comment, triggering clicks on a button that doesn't actually work properly isn't going to help in anyway.

You need to clear the search bar and filters, and remove their references from the URL. If you do not do that, using the pagination or refreshing the page just restores whatever was cleared.

My revised version has been working perfectly for me, so please review that and correct yours accordingly :)

@champsupertramp

This comment has been minimized.

Copy link
Owner Author

@champsupertramp champsupertramp commented Apr 28, 2020

Hi @hirenshah, It should clear the URL parameters and fields without reloading the page. It's like you're clicking the "x" clear all filters button. Please see how it works. It's a single line of code.

Screen-Recording-2020-04-28-at-9

Regards,

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment