How to make a Dynamic Search Bar for Wix Data Collections | Wix Website Tutorial (Velo)

Поделиться
HTML-код
  • Опубликовано: 5 сен 2024

Комментарии • 61

  • @jimmyboy7504
    @jimmyboy7504 7 дней назад

    Wow ❤️ I'm trying to learn Wix development.. very useful your videos ❤️❤️

  • @jtreignz
    @jtreignz 3 месяца назад

    Thank you so much. I am trying to create a custom search for my blog that populates in a multi state box. Couldn't find a tut that helped, but this was perfect. Huzzah!

  • @mattflanagan6246
    @mattflanagan6246 Год назад

    Very useful! Great work as always, Eitan! Always love seeing new videos from you on Mondays!

    • @thewixwiz
      @thewixwiz  Год назад +1

      Thanks man! It's good to be back :)

  • @yp6324
    @yp6324 14 дней назад +1

    Cristal clear tutorial, many many thanks! Do you know if it is possible to search a collection including an address field type, which is an array type, and not a text type ? It would be powerful to search within the 'city" or the 'formatted" subfields of the address field for example.

    • @strategy4startup
      @strategy4startup 13 дней назад +1

      Same issue for me: search address fields. Haven't been able to find out a solution in the Wix doc yet.

    • @thewixwiz
      @thewixwiz  10 дней назад +2

      Thanks! If I'm not mistaken the address field is an object. You should be able to query its properties using dot notation. For example:
      wixData.query("Example").eq("address.city", "New York").find()

    • @yp6324
      @yp6324 10 дней назад +1

      @@thewixwiz Great, as simple as that! I thought I tried this way but I probably made a mistake and then went in a completely different direction. For other interested people, it works in my case with wixdata.filter() as well as with wixdata.query()... Many thanks again, your tutorials and advices are of great value!

  • @GioDCruz
    @GioDCruz 5 месяцев назад

    finally found it! Saving this!!!!

  • @Celestalis333
    @Celestalis333 5 месяцев назад +1

    thanks so much! how do we add a search via enter button as well as the search button?

    • @thewixwiz
      @thewixwiz  5 месяцев назад +1

      Thanks for watching! You can use the keyPress event handler of the input to detect when the user presses Enter and then execute the search.

  • @_Product_Finder
    @_Product_Finder 10 месяцев назад

    I had to comment thank you my guy you made it clear enough for me to understand

  • @darrenpearson4701
    @darrenpearson4701 Год назад

    thank you so much, well explained and demonstrated. 10 out of 10

  • @tartaria936
    @tartaria936 Год назад

    yes i was looking for this for a while. thanx.

  • @daveb3987
    @daveb3987 9 месяцев назад

    This was a great tutorial. I've had no trouble implementing a search input, or adding filters bound to the dataset in the wix editor... but seem to have trouble coming up with a good solution that combines search and filters. Even with a fully coded option I run into issues. Has anyone found best practice for this?

  • @johnnathaniel1336
    @johnnathaniel1336 Год назад +1

    hei, this does not work on editor x , it tells me that .or is not a property of type 'pomise'
    how can i do that, cause i was trying toimplement the .or() query operator

    • @thewixwiz
      @thewixwiz  Год назад

      Hey, thanks for commenting and sharing about your project!
      I offer viewers two options for getting assistance with their projects:
      1. My free forum: thewixwiz.com.com/forum - I try to address questions there at least once a week. Please support your question with code snippets, screenshots, and even video.
      2. Offering my services as a developer. You can schedule a consult at thewixwiz.com/book-online or fill out this onboarding form: thewixwiz.com/client-onboarding
      I appreciate your support and thanks for watching!

  • @user-ti2tl1ld4g
    @user-ti2tl1ld4g Год назад

    Great Tutorial, its working perfectly with text. But there is a way to also appear a hyperlink for the item page link in the search result?

    • @thewixwiz
      @thewixwiz  Год назад +1

      Thanks! Yes you can using the .html property of a text element. Or a button/image.

  • @joaopgz
    @joaopgz Год назад

    Awesome! It worked very well! I'm creating an item database, and the results are showing up nicely as I input the keywords. However, only a maximum of 50 results are being displayed. Is it possible for the search to keep these 50 results and create a "next" and "previous" page to navigate through the results?

    • @thewixwiz
      @thewixwiz  Год назад

      Great! Yes that can be done using .next() and .prev(). I elaborate on this in Module 5 of the course which will be coming out this weekend:
      www.thewixwiz.com/courses

  • @btsysis6058
    @btsysis6058 9 месяцев назад

    this was such a helpful video. But how do we add products image next to its name in the search bar?

    • @thewixwiz
      @thewixwiz  9 месяцев назад

      Happy to hear! Since there may be many products that match a search query I'm not sure what image you would like to display. Generally displaying an image would be done by assigning the url in the data to the .src of an image element.

  • @AlRarela
    @AlRarela 7 месяцев назад +1

    Does this work on Dynamic Page with Dynamic Page Dataset?

    • @thewixwiz
      @thewixwiz  7 месяцев назад +1

      It can! Filtering datasets works slightly differently though.

  • @calin8158
    @calin8158 16 дней назад

    Hi! Is there any option to filter the typos in the input? So for example if customers want to search for books and they write boks or something similar, I would like to filter this and appear all the "books" in the output (repeater etc.). I saw something like fuzzy with WixSearch but I don't understand how that filter is working tbh.
    Thank you!

    • @thewixwiz
      @thewixwiz  15 дней назад +2

      Hi, great question! I've heard rumors of WixSearch introducing semantic search but that wouldn't hold for a custom search experience.
      There are a few approaches I can think of when building a custom search experience -
      1. Utilizing AI for semantic search: this would include generating vectors for the searchable data as well as the query. Best done with a vector database.
      2. Utilizing an API: I'm imagining an API which takes a term and returns possible alternative spellings. You can then query for those alternatives instead of the misspelled word.
      3. Handling it internally: For example if the search term doesn't return any results you can break the search term down and query for those parts. So for bok - no results show up so you query for "bo" and "ok" instead.
      These are just off the top of my head but it's an interesting topic to explore!

    • @calin8158
      @calin8158 15 дней назад

      @@thewixwizthanks for the advice! I tried recently to use the built in Site search. It works fine but it grabs only products that are in wix store. I need the products that are in my custom collection. And if I click on the results, it redirects me to the default product-page items not to my dynamic page. I tried also to set the redirects using redirect url manager but no success. The redirect works only when I enter the page url directly, not if I click to my product item on website to reroute me to the dynamic page..😢

  • @akhilaramganesh2798
    @akhilaramganesh2798 3 месяца назад

    Hi, Can I get the code script somewhere?

  • @user-ke9nf9kv3w
    @user-ke9nf9kv3w Год назад

    How would you link each of the individual search results to the dynamic pages associated with that data?

    • @thewixwiz
      @thewixwiz  Год назад

      There is an autogenerated field in the collection that stores the link data. You can assign the link property of a button or navigate to it with Wix location API. My video on dynamic pages may help.

  • @tordthelord
    @tordthelord Год назад

    Hi, wow, great video! I want to ONLY be able to search for a small selection of pages, without having to hide them on the site. Is there a easy way to make this possible? Would be extremely grateful for a response!

    • @thewixwiz
      @thewixwiz  Год назад

      Thanks! Are they dynamic pages? What do you mean by "search for pages"?

    • @tordthelord
      @tordthelord Год назад

      @@thewixwiz They are not dynamic at the moment. I want customers to use the search element to write in their type of business, and then get directed to a matching product page. F. example, when a customer have a "hair salon" they can use search element, type their type of business, and get a resulting product pages specified for hair saloons. But I dont want it to be possible to search for pages like "contact information" or "about us" or random products, or random product pages. Only able to search for a small collection of sites( or "types of businesses") Do you understand, sorry if Im not a good at explaining😅?

  • @jhovannyvargas1371
    @jhovannyvargas1371 Год назад

    Esta formidable el tutorial.
    Me gustaría saber como puedo hacer esta función pero agregando los resultados de busqueda a un elemnto TexInput.
    Te cuento, tengo una colección de datos de perdonas, quiero que al agregar el dato "ID" en un "TextImput" dar clic en el botón buscar, aparezca la información de la persona (nombre, a. paterno, ap materno) en el "TextImput" que le corresponda a cada dato. ¿me podrás ayudar por favor?
    Saludos y gracias por tus videos.

    • @thewixwiz
      @thewixwiz  Год назад +1

      Muchas Gracias!
      Please post any technical questions you have to our forum:
      www.thewixwiz.com/forum
      Make sure to provide all the necessary context (code, screenshots, link to your site, etc.) for us to help!

    • @jhovannyvargas1371
      @jhovannyvargas1371 Год назад

      @@thewixwiz Listo! ya subí mi pregunta al foro y tambien mande los datos y link de mi sitio web.
      Te agradezco.

  • @ashg4178
    @ashg4178 6 месяцев назад

    It mostly works well, but if I combine multiple search terms (to refine it further) it does not work. How can I make it so that the more terms I type, the more refined the search becomes?

    • @thewixwiz
      @thewixwiz  6 месяцев назад

      If you use .and instead of .or it will refine the search.

    • @ashg4178
      @ashg4178 6 месяцев назад

      @@thewixwiz Thank you for your response. When I tried .and the repeater doesn't show at all (it's collapsed). When I filtered another term to get the repeater to show and then typed in another search term, the repeater completely disappeared. Is there something else I could do?

    • @ashg4178
      @ashg4178 6 месяцев назад

      @@thewixwiz any ideas or could you point me in the right direction. I’m a complete newbie.

  • @reddyjyosna7202
    @reddyjyosna7202 Год назад

    Can we do search method for tables instead of repeaters

  • @angelvargascampos
    @angelvargascampos 3 дня назад

    is there a way to achieve this with no code?

  • @AtalMurad
    @AtalMurad 7 месяцев назад

    Hello I write the code and my dynamic page 404 error not showing

    • @thewixwiz
      @thewixwiz  7 месяцев назад

      Hey, thanks for commenting and sharing about your project!
      We offer viewers a few options for getting assistance with their projects:
      1. Our free forum: thewixwiz.com.com/forum - I try to address questions there at least once a week. Please support your question with code snippets, screenshots, and even video.
      2. Developer services. You can schedule a consult at thewixwiz.com/book-online.
      I appreciate your support and thanks for watching!

  • @pikkuGH
    @pikkuGH 10 месяцев назад

    Hi, does this work for Wix Stores search results?

  • @7wolfgaming710
    @7wolfgaming710 10 месяцев назад

    if I input my information with the cms menu will this still work?

    • @thewixwiz
      @thewixwiz  10 месяцев назад

      What do you mean by CMS menu?

    • @7wolfgaming710
      @7wolfgaming710 10 месяцев назад

      @@thewixwiz I have very large repeater controlled by the cms, I would like to sort just though that database

  • @Monkeyindatrees
    @Monkeyindatrees Год назад

    Hi, Could you please make a video regarding how to manually set up google pay and apple pay to a wix store instead of paying a fee to a 3rd party?

    • @thewixwiz
      @thewixwiz  Год назад

      Hey! You can make video suggestions here:
      thewixwiz.com/youtube

  • @georgeriley2000
    @georgeriley2000 10 месяцев назад

    Some of my fields arent showing, any help?

    • @thewixwiz
      @thewixwiz  10 месяцев назад

      Hey, thanks for commenting and sharing about your project!
      I offer viewers two options for getting assistance with their projects:
      1. My free forum: thewixwiz.com.com/forum - I try to address questions there at least once a week. Please support your question with code snippets, screenshots, and even video.
      2. Offering my services as a developer. You can schedule a consult at thewixwiz.com/book-online or fill out this onboarding form: thewixwiz.com/client-onboarding
      I appreciate your support and thanks for watching!

  • @desireeweiss906
    @desireeweiss906 Год назад

    For some reason I can´t get it to work! It´s been driving me nuts... I´ve been trying to get a search bar to work for the past week.
    My database is called "items1" I´m trying to only search the first field "title" but no go! Wix has both $item, itemData (3rd line and 4th line) underlined in red, saying "cannot find name". Not sure what I´m doing wrong.
    import wixData from 'wix-data';
    $w.onReady (function () {

    $w("#mockDataRepeater").onItemReady(($item, itemData)) => {
    $item("#title").text = itemData.title;
    });
    async function search(){
    const query = $w("#searchQueryInput").value;
    const titleQuery = wixData.query("Items1").contains("title", query);
    const mockDataQueryResult = await wixData.query("Items1").contains("title", query).find();
    const mockData = mockDataQueryResult.items;
    $w('#mockDataRepeater').data = mockData;
    }
    $w("#searchButton").onClick(search)
    $w("#searchQueryInput").onInput(() => {
    search();
    })
    });

    • @thewixwiz
      @thewixwiz  Год назад

      Hi,
      Please post any technical questions you have to our forum:
      www.thewixwiz.com/forum
      Make sure to provide all the necessary context (code, screenshots, link to your site, etc.) for us to help!

    • @rescuekindness
      @rescuekindness 7 месяцев назад

      have you fixed it?