Updating the "auto count" manually via javascript

Anonymous

#139353

Due to layout concerns I have created a separate text input outside of the .searchandfilter form and use javascript to copy the value of that “placeholder” text field to the one inside the .searchandfilter form (“.sf-input-text”).

However, even though this function is successful at copying the value of the placeholder input to the real S&F search input, the form does not update the Auto Count function as happens when you’re actually typing in the original input.

I am using $(“.searchandfilter”).searchAndFilter(); to try and force the auto count to update but it’s not working.

Any suggestions?

var copyInput = function($proxyinput, $sfinput) {
		if(window.copying == true) {
			return false;
		}
		
		window.copying = true;
		
		var $me = $proxyinput,
			$myVal = $me.val();
					
		$sfinput.val($myVal);
		$sfinput.attr('value', $myVal);
		
		var doMe = function(){
			$(".searchandfilter").searchAndFilter();
			window.copying = false;
		}
		
		setTimeout(doMe, 10);
	},
	wtgSearchProxy = function(){
		// PROXY SEARCH FIELD
		window.$proxyinput = $('#lib-filter--search-input');
		window.$proxyinputlabel = $('#lib-filter--search-label');
		window.$proxysubmit = $('#lib-filter--search-submit');
		window.$sfinput = $('.sf-field-search .sf-input-text');
		
		$proxyinput = window.$proxyinput;
		$proxyinputlabel = window.$proxyinputlabel;
		$proxysubmit = window.$proxysubmit;
		$sfinput = window.$sfinput;
		
		var doIt = function(){
			copyInput($proxyinput, $sfinput);
		};
			
		//force search form to submit on enter 
		$(document).off('keyup', '#lib-filter--search-input');
		
		$(document).on('keyup', '#lib-filter--search-input', function(e) {
		    copyInput($proxyinput, $sfinput);
			
		    if($proxyinput.is(':focus') && e.which == 13) {
		    	setAjaxin();
		        $('.searchandfilter').submit();
		        return false;
		    }
		});

Anonymous

#139354

Also, when I console.log('$(“.searchandfilter”).searchAndFilter()') it returns undefined. Not sure if that’s a hint…

Trevor

#139385

I am not sure whether what you are doing will even work, as I am not sure it can be done like this (or that it can be done at all), but the code you showed should not use curly (smart) quotes.

Or whether the function name is correct (upper and lowercase letters like that).

Anonymous

#139451

Trevor that line $(".searchandfilter").searchAndFilter(); is direct from search-filter-build.min.js from the plugin files.

Basically I need to run the “updateForm” function (line 3697) from Version 2.3.4 of the Pro plugin.

By placing alert() functions within a few of the functions in search-filter-build.min.js, I can see that $(".searchandfilter").searchAndFilter(); (within my code above) causes buildUrlComponents to fire, but it does not cause updateForm to fire, as typing directly in the S&F input would do.

https://wtg.wpengine.com/the-library

The search field you see there is the “Proxy” input field, meaning that whatever you type in there gets “copied” into the real S&F search field, which is hidden. Again– the only part that is not working is the Auto Count update.

Thanks

Trevor

#139460

This reply has been marked as private.

Anonymous

#139477

Great, please do! Thanks Trevor

Ross Moderator

#139696

Hi Jesse

Just trying to get my head around this.

So, what you are trying to do is use your own search field outside of S&F, and copying the value when that gets submitted, to S&F and initiating a search?

If so my logic would simply be:

1) Copy from your search field to our search field, either on input change or submit (of your your field)
2) trigger the input update event on the field (so S&F handles the rest, it just thinks someone typed directly into its field)

I did a quick test locally, and this worked:

var $proxy_input = $('.proxy-search-input'); //this is your external search input field
$proxy_input.on("input", function(){
	var val = $(this).val();
	$('.searchandfilter .sf-field-search input').val(val);
	$('.searchandfilter .sf-field-search input').trigger('input');
});

Let me know how you get on 🙂

[Author]

Posts