Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #664248

    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 3 years, 4 months ago by  sublimeprophets. Reason: Formatting
    #664282

    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

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.