[Resolved] Split: Search Forms doesn't work as expected

[Author]

Posts

[Waqar]

Hi Charles,

I apologize, as I confused your "wpv-form-view" shortcode with a different shortcode "wpv-view".

To show the search form and the search results on the homepage, you have two options:

1. If your goal is to show the search form and the results together so that the results are immediately followed below the form, please replace your shortcode with only:

{!{wpv-view name='single-product-list-entry'}!}

2. If you would like to split the form and the results, so that they're on the same page (home), but in different sections, you can use following shortcode, for the search form:

{!{wpv-form-view name='single-product-list-entry' target_id='self'}!}

And for the results, you'll add this shortcode:

{!{wpv-view name='single-product-list-entry' view_display='layout'}!}

Please let me know how it goes.

regards,
Waqar

[CharlesB2907]

??

[CharlesB2907]

There is something clearly wrong. Repetition after repetition and yet, still the issue remains. Now you are about to switch to weekend mode and this will lapse over to yet another wee.

I highly respect your knowledge and I appreciate you helping me but this couldn't be any slower if we were sending smoke signals back and forth.

I beg that either you or someone log into my installation and help me find out what's going on - please!

[Waqar]

Hi Charles,

There are some extra spaces and non-breaking spaces included in your shortcodes (i.e. "{!{" & "}!}").
( screenshot: hidden link )

Please fix that and the shortcodes should work.

Note: Wrapping those shortcodes inside the paragraph tags (<p></p>) is also not its correct usage, so you should remove those as well.

regards,
Waqar

[CharlesB2907]

This is what the code appeared like in your email: {!{wpv-form-view name='single-product-list-entry' target_id='self'}!}

The following codes in your support ticket system when I copied and pasted them into my module they had a grey back around each and the codes did not display. I was forced to manually type them which is where the space issue originated.

{!{wpv-form-view name='single-product-list-entry' target_id='self'}!}

{!{wpv-view name='single-product-list-entry' view_display='layout'}!}

Now the form does appear and the entire list of products thumbnails appear directly.

1. No results should appear until a search form is submitted.

2. I select "eCollage" for Category and "2018" for the year and after nearly a minute (no visitor is going to wait that long) the entire list displayed not just what I searched for.

The form and search is still not working correctly.

[CharlesB2907]

But at least I can now see something on the page, which is progress so I am grateful, thank you.

Now, if we can please fix the progress.

[CharlesB2907]

"To make any link open in a new browser tab, you just need to introduce the target="_blank" attribute to it's a tag:
hidden link"

What a tag, where?

If I were simply working with Divi I would know this n=but because Toolset is involved in the display and have no responsible documentation, I have no choice but to ask for more specification.

[Nigel]

Hi Chuck

Waqar is off for a few days, so let me jump in here.

I see this has been ongoing for some time, and you are frustrated at how long it is taking to get this working.

I read through the above thread and I'm not sure exactly what the current state of play is.

Could you provide a concise summary here of the current situation and I will go into your site and see how you have this set up, and I may make some changes directly and describe what I've done, if that seems like the best way to resolve this.

I need to set a private reply for you so that I have access to current site credentials.

[CharlesB2907]

The current situation is as follows:

1. I am a Divi Theme user.

2. I have two active Toolset Views 1. for the Homepage and 2. for Single Product List Entry which is the Product page summary that displays as a thumbnail in search results.

3. I use a Divi builder template for the following pages: Homepage, Product page, Single Product List Entry, Search Form and Search Results.

4. The Search Form should be accessible from either the Homepage or sub-page top navigation link titles "Search Other Work".

5. On the Homepage directly below the full-screen header section is currently a Divi module section that contains the form shortcode. Ideally, if a search is submitted from the form, the current page would rise up to display a single row of search results (below the form) with pagination links to additional search results if available in the query return.

4. The "Search Other Work" link in the sub-page navigation is the exact same form template but should display slightly differently as follows: when the "Search Other Work" link is clicked the /search-form/ page will appear with JUST THE FORM ONLY and after a search query is entered into the form and submitted, the page should rise up to display a single row of results with pagination links to additional search results if available in the query return.

Note: Referred to the form rising up to reveal the results because when I first set this configuration up, I briefly noticed a display of results directly below the form that was not visible unless I scrolled down to view them. Otherwise, I would have never known there were results below the form.

The above is the basic function workflow that I seek. I am not sure if the form is set-up to search correctly. The only search we need is for the data that appears in the Product pages.

There should be NO results displayed until only AFTER a search form field options are selected and the form is submitted.

I would be VERY grateful if you or someone can please help me achieve what I described above.

Thank you.

[Nigel]

Hi Chuck

First, an observation:
The home page contains no content. It is not blank because it uses a content template for the design, and that content template is designed with Divi and contains nothing but a View. In that case you can simplify this. There is no reason to use a content template, you can simply insert the View directly onto the page in the same way (and you can probably just insert the shortcode for the View directly on the page without having to design it with Divi, unless the formatting depends upon the container divs and classes that Divi would add).

Now, I see that on both the home page and the search page you have inserted the View, but only the search form.

A search View comprises two parts, the search form and the search results.

Typically when you insert a View, it inserts both parts at once.

But you can separate the form and the results to display them in different parts of the same page, or even on different pages.

In your case, on both pages you have inserted the search form only, specifying that the results will be included in the same page.

But you haven't also inserted the search results anywhere.

You need to insert the View again, where you want the results to appear, and specify that you are only inserting the results (because you have already included the search form).

(If you are just going to place the results straight after the search form, you might as well just insert the whole View once, no need to insert the form and the results separately.)

I am guessing from this together with your description that you have been doing this because you don't want the normal Views behaviour where all results are shown when you first load the page and before you apply any filters. With Views filtering you are narrowing down the results as you apply filters, starting from all results.

If your intention is to only show results once someone has entered search terms or filters, then splitting the search form and results is not the way to go about it (unless(!) you split them across pages and show the results on a different page).

For that you need to use some custom code which effectively checks to see whether any kind of filter has been applied, and if not to nullify the results.

Here is a generic snippet you can use for that:

/**
 * No initial results
 *
 * Don't show View results until a filter has been applied
 * 
 * Tests for custom field filters, taxonomy filters, or text searches
 */
function tssupp_no_initial_results( $query_results, $view_settings, $view_id ){
  
	$target_views = array( 226 ); // Edit to add IDs of Views to add this to

    if ( in_array( $view_id, $target_views ) ) {
  
        // if there is a search term set
        if ( !isset( $query_results->query['meta_query'] ) && !isset( $query_results->query['tax_query'] ) && !isset( $query_results->query['s'] ) ) {
            $query_results->posts = array();
            $query_results->post_count = 0;
            $query_results->found_posts = 0;
        }
    }
  
    return $query_results;
}
add_filter( 'wpv_filter_query_post_process', 'tssupp_no_initial_results', 10, 3 );

You can add this as a code snippet at Toolset > Settings > Custom code, or add it to your theme's functions.php file if you prefer. You just need to edit the View ID(s) it should apply to.

Try adding that and fixing up how you insert your Views to include the results, and see if you still have a problem with scrolling to the results, and let me know, I can look at that when you have everything else working.

[CharlesB2907]

Hi Nigel,

Thank you for taking time to gather this information. I will need to break it into a few sections for clarification.

"First, an observation:
The home page contains no content. It is not blank because it uses a content template for the design, and that content template is designed with Divi and contains nothing but a View. In that case you can simplify this. There is no reason to use a content template, you can simply insert the View directly onto the page in the same way (and you can probably just insert the shortcode for the View directly on the page without having to design it with Divi, unless the formatting depends upon the container divs and classes that Divi would add)."

I think you are saying that I can insert the Toolset View shortcode into the default editor. It's very good to know this moving forward but for this project, the Divi template contains formatting setting max height and width parameters for the featured image which while being updated by the client, may contain single image displays of varying shape aspect ratio and Divi support provides assistance if needed with the page display.

---------

"Now, I see that on both the home page and the search page you have inserted the View, but only the search form.

In your case, on both pages you have inserted the search form only, specifying that the results will be included in the same page.

But you haven't also inserted the search results anywhere."

This is not entirely true from my point of view. As I was attempting to build the site using your documents and tutorials while consulting with Toolset support I was instructed to add then separate the cods multiple times. This was highly confusing because I communication exactly what my objectives were each time, but I received conflicting support directions.

I do have the results inserted on the page hidden link and your support was aware of this page link as it was discussed in previous support tickets several times. Please respond to this specifically. I likely have this setup incorrectly from what I am beginning to gather.

"(If you are just going to place the results straight after the search form, you might as well just insert the whole View once, no need to insert the form and the results separately.)"

I need the Search Results to display directly below (with a divider between) the Search Form on the same page it appears.

This search form is located in two locations on the website, the Homepage and a static page. The results should display below the form in cases.

Important: I have a concern here. During a first attempt when I did have the two codes together and the form displayed results automatically as you described, I did not realize the results were below the form because the form did not rise up to display the results, the results populated below the form, below screen level out of site.

Yes - the conclusion is, I need the the results to display below the form with a spacer and an anchor point trigger to the results. I do not know how to achieve this but it is the objective.

What is the best way to resolve this current state based on the objective I described above?

[CharlesB2907]

I am adding the code above as instructed. Can your please be more specific regarding "You just need to edit the View ID(s) it should apply to."?

[CharlesB2907]

Should a cut the Results code: {!{wpv-view name='single-product-list-entry' view_display='layout'}!} from the hidden link page and paste it in a section module directly below the search form, both on the static "Search Other Work" page where the form is to appear as well as the homepage?

[Nigel]

Hi Chuck

The search-results page seems to be something of a red herring, because neither your home page nor your search-form page link to it to display the results.

Let me elaborate a bit more.

If you edit a View at the end you will see the Output Editor, which contains these shortcodes:

[wpv-filter-meta-html]
[wpv-layout-meta-html]

The first shortcode is responsible for outputting the filter controls, the second for outputting the results.

This is an HTML editor, you can add any valid HTML markup to it directly (or indirectly, with shortcodes that generate markup).

When you insert a View "normally", i.e. without splitting the search filters and results, the whole of this Output Editor section is inserted, so if you wanted a divider between the search form and the results you could insert the markup for it between the two shortcodes in this Output Editor section, and that might be as simple as adding an hr tag, like so:

[wpv-filter-meta-html]
<hr>
[wpv-layout-meta-html]

Now, if you split the search filters and the search results then that Output Editor section won't be used, some extra attributes get added to the Views shortcode and only the relevant part is output.

If you insert just the search form a target_id attribute will be added to the wpv-view shortcode with the id of the page that will contain the results, or 'self' if the results will be shown somewhere on the same page.

If you insert just the results, a view_display="layout" attribute is added to the wpv-view shortcode.

So you can tell looking at a View whether it will output both (no extra attributes), just the search form (target_id attribute), or just the results (view_display attribute).

You have inserted the single-product-list-entry View in two places, on the home page and on the search-form page.

In both cases you have inserted it with the attribute target_id='self', meaning only the search form is inserted, and that the results are intended to be shown on the same page.

But you haven't inserted the results on the same page (the same View, but with the view_display="layout" attribute).

So the results will never be shown.

The separate results page is irrelevant because you have not specified that the results will appear on that page when inserting the Views search forms.

You should either
- edit the home page and search-form page and insert the View another time, this time just the results, or
- remove the target attribute from the Views shortcodes so that both the form and results are jointly inserted, and edit the Output Editor section of the View to add the markup for whatever divider you want to appear between the search form and results.

One last thing I must comment on.

On your home page it took me a while to realise where you had added the search form View.

On the home page you have a View to display a single artwork. And you added the search form View to the loop template you designed with Divi for that main View. That is not a good place to insert it. You should remove it from there and instead insert it in its own module after you insert the main View. No reason to nest the Views.

So. let's fix the above.

What you should end up with is the Views showing with both the search forms and the results beneath, on both the home page and the search-form page.

Once you have done that we can worry about not showing any results until a search has been entered, and scrolling the page to the results.

[CharlesB2907]

Hi Nigel,

I have read your recent reply several times now and I understand much more clearly now.

I am very grateful for the detail and I will update you on my results.

Thank you.