I have a model Item, that has_many Tags.
I would like to make a form field on the Item form like a text field, where the solution looks up matching tags, when the use enters text.
The user should be able to select multiple tags, but the user should not be able to select tags that does not exist in the system.
Basecamp is doing this in this screenshot for the "With" field, and Stackoverflow do it for the tag field.Can you help me how I do this?
Screenshoot from Basecamp
Consider using a gem like acts-as-taggable-on (https://github.com/mbleigh/acts-as-taggable-on), which is well suited to your stated requirements.
I found this solution, which is exactly what I was looking for:
https://github.com/tsechingho/chosen-rails
Related
I'd like to know how to implement a textarea where a user can tag people by typing # and then write a person's name. You get inline suggestions for word matches.
I'm not even sure what the technical name would be for such a feature but it's a common in sites like Facebook.
You want an autocompleter of some sort.
Have a look at this jQuery autocomplete tagging plug-in like StackOverflow's input tags?
The solution for this is using jQuery Tokeninput.
Hopefully you are looking for some Twitter style autocomplete
Is there any plugin or way to make select with search option, and if there is no option like entered in search that entered value would be like input..
Have form with lots of manufacturers and models to select.. but also there is lots of new ones and want to make it in one place.. so that wouldn't need to go another page ant save the model or manufacturer..
for now thinking about making it with chosen plugin (https://harvesthq.github.io/chosen/) like tag input.. but still more want to make like select with input in one..
also must work with select/input with names of array like manufacturer_id[] etc..
Do you know Select2 ?
https://select2.github.io/examples.html
Maybe you can do something with it.
Are there any bootstrap or jQuery tools that give me suggestions when I type something in a textarea? like autocomplete but I don't want to replace the whole text when I click on the suggestion. I want something like SQL editor when I start typing a table name, tables name starting with that particular letter should suggestest me. When I click on a suggestion, particular suggestion should append with the existing sentences.
http://autocomplete-js.com/
Pretty much my go to autocomplete library i use in the frontend. It has no dependencies, which is awesome.
If you're more into jQuery, here's one from jQuery UI
I've spent hours on this one.
My company is forced to use a non-user-friendly 3rd party website. We only use IE11. My job is to use javascript and jquery to customize the screen and make things a little easier for our users. I use a bookmarklet to insert <script> tags into IE and reference a .js file saved locally.
This website uses hundreds of input text fields but we only need a handful of them. So, I want to highlight input text fields on the screen.
Some fields have ID's some only have Name. For the most part, this works:
$(document.getElementById('s_3_1_18_0').toggleClass("highlightField");
$(document.getElementsByName('s_3_1_19_0')[0]).toggleClass("highlightField");
HighlightField simply adds CSS background-color: yellow !important
The problem is, this 3rd party app changes the ID and the Name in bizarre ways. One day, the name will be 's_3_1_19_0', the next it will be 's_3_2_48_0'. So highlighting using this method is not stable.
However, these fields have an area-label that stays constant. I'm wondering how to use javascript or jquery to iterate through each text box, looking for a specific aria-label. For example, the "valid to" field has a bizarre name that changes all the time but it's aria-label is always "Valid To".
Can anyone please help me with this?
You can find the input with the aria-label "Valid To" by searching for
$(document).find('input').attr('aria-label', 'Valid To');
I recommend being a little bit more specific than $(document), though. That searches the entire doc.
You can use jquery to get the list of all aria-label attributes and use a switch case to perform what you need. Something like this
switch ($(this).attr('aria-label')) {
case 'label1': {
//do something
break;
}
}
I don't know if this is possible in Javascript but I am trying to achieve this. I don't know the terminology so I thought I would post it on here with pseudo code to help you understand what I want to implement.
Pseudo Code:
User Selects Option from pull down.
If selection matches criteria
Add text boxes to the form
Else if selection is something else
Add invisible text box with NULL value
I would like to code it myself but if you could post some reference material or links as I have not done much with Javascript.
Thanks
For your first and second entries, google for 'html select onchange'.
You'll want to check out document.createElement for "Add text boxes to the form"
To make your text box invisible, check out the CSS display property, setting it to none or block (or inline)
I've tried to keep this answer very short without code samples because it sounds like you want to do it yourself. Add a comment to my answer if you want more of an example.
EDIT
Also of note, along with document.createElement, you will want to look at appendChild to add the created element to an HTML element, most likely some FORM element in your page.