How to Switch Search Channels on the Fly?

Question

I've asked a couple of other questions about parts of this issue, but I haven't explained the whole thing. I think I'm going down rabbit holes on specific issues; but if I explained the whole thing, perhaps someone could point me in a different, more productive direction.

I have a search page using the simple_form tag. By default, it searches in the products channel. But we want a mechanism which allows users to alternatively search in the blog channel. So when they arrive on the search_results page, in addition to the search results, we also display Product and Blog links. The Product link is highlighted, to show we're displaying product results. If the user clicks the Blog link, jQuery takes over, changes a hidden field called search_type to "blog", and clicks the search button on the search form.

This brings us back to the search_results page, but now we've passed the "blog" flag as a hidden field. We pick it up using stash:get, and use the search_type as the channel parameter in the search:simple_form tag...

Well, that's how it should work, anyhow. As I was writing that last bit, it occurred to me that the channel parameter had been parsed some time ago, so when we hit the search button, the channel is already encoded in teh hidden fields. (I'm guessing that's how it works.)

OK, so how would I handle this product/blog search thing? I've been going round in circles for over a day. Thanks for your help.

Answer 1

I have done something similar, but using categories in the mix.

My search form will search each category that is "selected" via named toggles. When the user searches using my simple search form I use jquery to override the search form, collect the toggled categories and then submit that url with the category and search values.

I then reload the results into the existing page, in a div.

Here is my code that I am using... hth

/* attach a submit handler to the contact form. By default, EE generates the ID "contact_form" */
    $("#calform").submit(function(event)
    {
      event.preventDefault();
      $('#calLoad').fadeTo('fast', 0.5); 
      /* send the form data using post and check the results for any errors*/
      $.ajax(
      {
       url: "/",
       type: "post",
       dataType: "html",  
       data: $(this).serialize(),
       beforeSend: function(){ },
       error: function(jqXHR, textStatus, errorThrown){displayAjaxMessage("Sorry, there was an error submitting your form.");},
       success: function(html, textStatus, jqXHR){
           $('#calLoad').fadeTo('fast', 1);
           $('#calLoad').empty().append(html);   
           }
      });
    });