Tagged: , ,

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • July 23, 2016 at 9:19 pm #664248
    sublimeprophets

    Dear Support-Team

    I am trying to implement a Big search box in the middle of the mainpage.
    The search box is working fine as well the Design is proper.
    Unfortunately, the ajax-instantsearch does not work as expected.

    I am using the Plugin search shortcode to enable [search] and it’s working fine with following output:

    <form action="./index.php" id="searchform" method="get" class="">
	<div>
		<input type="submit" value="" id="searchsubmit" class="button avia-font-entypo-fontello">
		<input type="text" id="s" name="s" value="" placeholder="Search">
			</div>
<input type="hidden" name="lang" value="en">
<div class="ajax_search_response"></div>
</form>

    I found in js/avia.js on line 52 and 53 code which instances a ajax search and tried to refactoring it, but here I am failing.
    With following Code i tried to enable the search (using the recommended Custom Javascript Editor):

    
// Invoke jQuery
(function($)
    {	
        //Load readyState
        $(document).ready(function()
        {
            
            // Only apply to mainpage
            if ( $("#home_mainscreen").length != 0 ) {
                //creates ajax search$
                new $.AviaAjaxSearch({scope:'#home_mainscreen'});
                
            } 
    	});
            
    });

    What am I a doing wrong? Don’t get any JS errors logged..
    All is up to date, using following stuff:
    – WordPress 4.5.3
    – Enfold 3.6.1
    – Woocommerce 2.6.3
    – WPML Mulitlanguage 3.4.1

    Thanks for any help!

    Greets Chris

    • This topic was modified 7 years, 9 months ago by sublimeprophets. Reason: Formatting
    July 24, 2016 at 6:22 am #664282
    sublimeprophets

    Dear Support,

    I already found the solution, just a little failures: I forget the (jQuery) Endtag, so it never saw output something.. That’s also why no failure.

    Final Soultion:

    // Invoke jQuery
(function($){	
     //Load readyState	 	 
 	$(document).ready(function(){
            // Only apply to mainpage
            if ( $("#home_mainscreen").length) {
               //creates ajax search$
                new $.AviaAjaxSearch({scope:'#home_mainscreen'});   
            }
       }); 
  })( jQuery );

    I hope these will help someone in the future :) if() check is optional if you include it permament.
    Mark this thread as solved.
    Greets Chris

  • Author
    Posts
Viewing 2 posts - 1 through 2 (of 2 total)
  • The topic ‘Enable AJAX-Instantsearch on big search box on frontpage’ is closed to new replies.