Lookup Value in a Field

Hi! I am a newbie in RW and I want to know if there is a way to enable an option selection from a form field, that the user has set somewhere online the options for this selection, not from desktop rapidweaver, but online like a CMS. Similar paradigm is when we can setting colors in a cloth product in an e-commerce solution. I want to use it as a lookup value but I cannot find any solution for a relational database, or relational forms or relational tables, that’s why I am looking for your opinions… I hope to not confuse you so much!

I am interesting for something similar to this screenshot:

It’s called a datalist:

The idea being you start to type words in a box, and a list of suggestions are shown underneath.

I don’t imagine it would be too difficult to append one of these onto an input box, using some Javascript.

In terms of populating it with words from a CMS, I suppose you could use PHP code to read the data from a CSV spreadsheet file or JSON file. Both of those are fairly simple data formats to login and edit via FTP. If you wanted to wire it up to a full CMS, I think it would depend on the capabilities of the CMS being used.

Thanks willwood!
Do you know any RW stack or plugin that can do this job?

The only way I can think of would be to use my recently updated Builder stack:

https://rapidweavercommunity.com/addons/builder

Of course, we’d still need to know if you’re trying to target an existing form input of whether this is a new form you are making. Plus the name / version of the CMS, if this is important to connect with.

I can be hired to write and test the custom code for you. My contact details are on my website.

You can suggest me any combination that can be work!
I have already bought Foundry+Alloy, Foundation6+TotalCMS and Formplus…

Here’s a proof of concept using my new Builder stack. This takes a CSV spreadsheet file (common English trees) and adds it as a resource in RapidWeaver 8:

https://www.dropbox.com/t/F1bZyYR6cpkakybj

Then uses PHP in Builder to fetch that data and convert it into an HTML datalist:

https://www.dropbox.com/t/R8o4QIenlfiEEPCy

I found from my own tests that you don’t actually need to move the datalist into the form. Providing that the ID of the datalist matches the datalist value on the form input, it works perfectly. And it passes the HTML validation test too. So that radically cuts-down on the amount of code needed.

This is the result (click to see a larger image):

The list of suggestions appears when you click on the input box. Safari styles them as a scrolling list.

You need to assign a datalist to a form input. As in my example, it can be as easy as one line of Javascript:

document.querySelector('#exampleInput').setAttribute('list', 'tree_names');

So that code assumes there is an input with an ID of exampleInput on the page. It adds datalist="tree_names" to the input box. That corresponds to the ID on the data list that PHP is creating in the page.

Perhaps with some modifications, this will work on any form.

3 Likes

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.