Select identifiable qualities on the user interface

Is there a way to display a list of searchable attributes alongside the search box? Perhaps giving users the option to select which attributes to search by.

For instance, when searching for a movie, users could specify whether they want to search by title only, excluding actor names or descriptions.

It would be great to have a dropdown menu ( <select> ) positioned before the search box for this purpose.

Thank you!

Answer №1

Successfully resolved the issue by implementing a custom widget

search.addWidget({
    initialize: function(options) {
        $('#select-searchable-attributes-input').change(function() {
            var value = $(this).val();
            if ( value == 'all') {
                options.helper.setQueryParameter('restrictSearchableAttributes');
                options.helper.search();
            } else {
                var arr = [value];
                options.helper.setQueryParameter('restrictSearchableAttributes', arr);
                options.helper.search();
            }
        });
    }
});

Feel free to inquire for more information in the comments section.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Using ReactJS to strip HTML tags from JSON response

I'm having trouble figuring out how to strip HTML tags from a JSON response in reactjs. Here's the JSON response: { "price": "26,800.98", "diff": "<!--daily_changing-->+13.44 (+0.05%)&nbsp;& ...

Next.js Static Paths Filtering

How can I retrieve only filtered paths from getStaticPaths? This function currently returns all posts export async function getStaticPaths() { const { data } = await axios.get(`${url}/category`, config); const paths = data.map((post) => { ...

Learn how to eliminate all text characters from a string using jQuery, leaving only the numerical values behind

My webpage features a variety of different products, each with their own values. When trying to calculate the total sum of these products and display it in the shopping cart, I encountered an error displaying NaN. How can I remove this NaN from the strin ...

The attribute 'split' is not found on the never data type

I have a function that can update a variable called `result`. If `result` is not a string, the function will stop. However, if it is a string, I then apply the `split()` method to the `result` string. This function always runs successfully without crashin ...

Place a drop-down menu inside the input box

Struggling with this issue, I've come across various messy solutions, but I'm determined to find a cleaner one. What I'm looking for is an input field that includes a dropdown selection on the left side. This is essentially what I have in m ...

Stunning Opening and Closing Animation with Ajax

Looking for help with creating an animation like the one shown here: Incorporating this into my current site at: dageniusmarketer.com/DigitalWonderland/ I want the window displaying text content to open and close as users navigate through the links, ess ...

Updating and removing items from a React state using push and pop methods

I am working on a component in React and have the following state: this.state = { Preferences: [] } I am trying to push an element only if it does not already exist in the array to avoid adding duplicate elements. If the element is already ...

Struggling to retrieve the accurate input value when the browser's return button is clicked?

Having multiple forms created for different conditions, each one submits to a different page. However, when I navigate back from the other page, all my forms display the same values as before. Here's the code snippet: <form action="<?php echo b ...

The canvas is unable to render the image from the sprite sheet

I successfully drew an image representing the player, but now I'm encountering difficulties in drawing an enemy character. Despite adding alerts indicating that the program is executing the draw enemy function, the enemy character still doesn't a ...

Is there a way to extract only the titles from this JSON array? (using JavaScript/discord.js)

How can I extract the "title" values from this JSON array using JavaScript? I need to retrieve all the "title"s and store them in a new array like shown below: array( `hey title1`, `hey title2`, ... ) I am unsure of the number of titles we will receive, b ...

How can we display the data returned by a successful AJAX request

Having an issue with displaying Ajax success data. success: function(data){ alert(need to print it here); } When I try to access the data using: console.log(data.responseText); {"success":false,"errors":{"text":["Some text.","some more text"]}} Any ...

Vue.js blocks the use of iframes

I've come across a peculiar issue where I need to embed an iframe inside a Vue template and then be able to modify that iframe later. The code snippet below shows the simplified version of the problem: <html> <body> <div id="app" ...

Logging Modal Toggle Clicks

I'm looking for a way to track views on my media catalog page, similar to an Instagram page. Each piece of media is displayed in a modal, and I want to have a "view count" recorded every time a modal is opened for that media. Here is a basic example ...

AngularJS' $rootScope is experiencing issues with creating internal variables

My app utilizes $rootScope.requestObj to store key-value pairs representing filters. Throughout the entire application, $rootScope.requestObj is considered a singleton and behaves as expected. However, when I call an external API, I have a service that t ...

"Encountering an error stating "breakpoint set but not yet bound" while debugging a node.js application

After following the instructions in this link to configure Visual Studio code for debugging nodejs and chrome(vuejs) applications, I encountered an error message saying "Failed to exec debug script" when attempting to debug "Meteor All" in Visual Studio co ...

The error message thrown by React JS webpack is "Module not found: Error: Unable to resolve 'src/content/Login/LoginAuthentication'"

Currently working with web "webpack" version "^5.74.0" for my React js project. During the npm start command, webpack is throwing the following error: ERROR in ./src/layouts/SidebarLayout/Sidebar/SidebarMenu/items.ts 21:0-83 Module not ...

How to use jQuery to dynamically add a variable to a request in Laravel 5.2

Is it feasible to append a variable to the Laravel cookie in the client using jQuery? Understandably, the Cookie is linked to the request during GET? Can you include a variable in the $request container in Laravel 5.2 using jQuery before initiating a GET ...

Sending data from an Angular application using AJAX to FormSpree.io

Currently, I am using a jQuery script to send ajax requests to for static form submission. The documentation provided by FormSpree suggests the following approach: $.ajax({ url: "//formspree.io/<a href="/cdn-cgi/l/email-protection" class="__cf_email ...

Scrolling to an element is not possible when it has both position absolute and overflow-x hidden properties

My issue involves animating ng-view with a slideup animation, requiring absolute positioning of elements and overflow-x: hidden to clip the content. However, I need to use the scrollTo element functionality on one sub-page, which doesn't work when bot ...

What is the best way to denote arrays in ember-data models?

When dealing with an array in a model, is it essential to use DS.hasMany pointing to a DS.Model, even if the array elements are not actual models with IDs or endpoints? Is there a more efficient alternative? Despite using DS.hasMany with { embedded: true ...