I am working on a search bar in the header. The search bar has 2 input fields, and to search through the products requires both values to be inputted (eg user is looking for a battery with 12volts and 10 amp/h).
The first input field (volts) will have a dropdown for the volts which will only have 4 different values to choose from. These values are already set within the metadata and when the user clicks inside the input field this dropdown will show up straight away with the 4 values to choose from.
The second input field however (amp/h), has a dropdown with about 30 values to choose from. I want this dropdown to be hidden until the user begins to type which value they are specifically searching for, then the dropdown will be visible with a reduced amount to choose from.
I have coded the first input field (volts), i just don't know how i can get the second one to be the way I have described above. I also am unsure how to make it actually search through the products based on the values the user inserts into input field based on what they click from dropdowns, but this can be sorted at a later date once functionality is sorted.
Any help will be greatly appreciated!
Related
I have this functionality to search the product. However, I could only search the name of the product.
Problem: How can I implement a search where it will allow me to search either the product name, size, or category?
For now, I was able to search and display the products according to what product name was entered in the search field.
For example:
it will show all of the products with a category of ML upon entering in the search field.
It will show all of the products with a size of M upon entering mor M in the search field.
PS- I don't have enough reputation to add comments
approach 1-
You can add multiple fields for the filter. A dropdown for sizes and one for the search field for the category.
approach 2-
add a dropdown from which users can select what type of filter they want, and then the search field will work according to that.
I have integrated a search with JSF inside a view. This search has 2 search boxes and 2 search filters. The 2 filters contain the same elements. THis is done so the user can make search combinations. If the user wants to search he gives the input and clicks the search button. The search button executes a javascript function that makes API calls and takes the right data. What I want to do is prevent the user from selecting the same filter element on both of filters(For example if in the first filter "name" is chosen, this cannot be chosen at the second filter). I have tried something with itemDisabled but no luck until now...
Can someone help me, please?
Is it possible to have a "load more" button on a Contact Form 7 form that would just duplicate another field set on the form? I need to create a form that will allow restaurant owners to enter each item on their menu, and was wanting to display something like the following:
Item title (text field)
Menu section (dropdown -- appetizer/entree/side/dessert)
These fields would then be followed by a "load more" button that, when clicked, would generate another Item title/menu section field set. The button would need to be indefinitely clickable to generate as many field sets as needed for the user to enter all of their menu items.
I've seen the CF7 Conditional Logic plugin, but it seems like I'd have to specify how many additional "hidden" field sets I'd want, and the number of them available to the user would be finite depending on how many I added to the back end form. I need the field sets duplicated/generated on the fly.
Any help is appreciated, and please go easy if I'm not posting correctly or in the right area. This is my first time posting here :)
I have a text box which is an autocomplete field allowing the user to enter values into it but user is able to change the value after selecting from the list of populated values.
In order to avoid that, I tried using combobox, but combobox doesn't seem to work with input and it only works with select. In my case, I cannot use select as the values coming up are from a database table and not any predefined values.
Is there any way to avoid users from selecting any values other than the ones in the autopopulating list into the text field? I beleive we can do this with jQuery, as I am not having enough knowledge on jQuery, I am unable to check any solution for it.
Can anyone help me out with this?
I have a Typeahead.js project working, I am able to search. Within this I am pre-filling a second input (using an ID column).
I need a way to detect if the user goes back and alters the filled information but does not choose an item from the typeahead list so that I can clear this hidden field.
Example:
User types "project 1"
"My Project 1" is displayed as a suggestion and user selects suggestion.
Hidden field is set to ID of this item (1)
User returns to field, and types in "something else"
user does not select any suggestions presented
Currently there is no trigger supplied by Typeahead.js that presents me with the second scenario. Is there another way to detect this?