First of all, I'm not a JS developer, so I apologize if I'm asking a rather too general, previously asked or complex question. The functionality I'm searching for is that I'd like to have two HTML lists, on the load the first one is empty and I want user to pick the items he like from the second list and drag them into the first one (which should be sortable so user can set the order he likes). Is there a easy to use plugin for it?
I really like the idea and look of those two plugins..
http://www.emposha.com/javascript/fcbkcomplete.html
http://loopj.com/jquery-tokeninput/
http://code.drewwilson.com/entry/autosuggest-jquery-plugin
There are doing something different, but those "bubbles" in textfield are a great way to handle it (from UX point of view). Just to be able to have an empty text field, available bubbles below it and to be able to drag them into the text field, just those user wants (no autocomplete functionality, just draging from some list of them, maybe sorting in text field available would be nice). Maybe there's a similar plugin to do that.
Another thing is, it's a part of a form so I need to be able to send those picked up elements to the server with the form, each with it's position. I know, I am asking too much but any help will help me.
Try to use Jquery UI
Here are links for demos
http://jqueryui.com/demos/sortable/
http://jqueryui.com/demos/droppable/
EDIT
I think all you want is this
http://jqueryui.com/demos/droppable/#shopping-cart
Maybe jQuery UI would work for you; it is composed of several handy helper functions.
Take a look at sortable with connected lists: http://jqueryui.com/demos/sortable/#connect-lists
Related
I have a form and would like to achieve the following effective
Preference for Option A --------------|----------------Preference for Option B
The use is then able to drag to indicate his level of preference.
I'm pretty sure some library exists that already achieves this, but I for the heck of me can't figure out what I would call it, to make a correct search.
Does this exist?
That's called a slider. Here's the jQuery implementation. If you want to see another example, I use four different ones in my drawing tool on my website. And here's another example that uses jQuery sliders, the filter.js steam example.
Here's the API documentation for jQuery sliders.
Yesterday I discovered that jQuery is really powerful and can do amazing things with only a few (sometimes just one) line of code, amazing! I did some animating which went really well!
So I was wondering if the following is also possible/ simple to implement with jQuery (if not, please tell me what could do this):
Basically I want a suggestion mechanism for the webapplication we are creating. We are doing this using ASP.NET MVC 4. By suggestion mechanism I mean the user gets presented with a textfield, he can start typing and based on his typing topics (I have a model class Topic with a few properties) get suggested. The user can ONLY choose out of those topics, they can't define any by themself. So I would like to generate a list based on the input (with each key tap). If they click on an item, it gets added to the box and they can choose other topics if they would want to.
I do realize that this is probably rather difficult to implement, but it would be great if I could find a tutorial or example. Preferable with JavaScript or jQuery, but if that's not possible anything will do really!
If my explanation is not clear enough: I mean something similar to the StackOverflow suggestion mechanism for tags.
If you want suggestive text field, search for html5 datalist datalist
Also take a look at JqueryUI Auto Complete
However if the options are not too much, i would go with select menu instead of text field.
I've been looking around for a good back-end independent HTML/CSS/JS widget for many-to-many/has_many relations with XHR filtering and I can't seem to find any.
I find hard to believe people are constantly re-inventing this wheel.
What am I missing?
EDIT: Ok, from the number of people that didn't understand it, this was a crappy question.
I believe that regular web interactions should come at minimal cost (it should either already be in HTML or a package install away).
That's true for most cases. However, I'm having a hard time finding something for picking up an item from a collection (Not autocomplete, something more elaborate than merely a string. If you want an example, assume you want to pick users and have their avatar displayed while picking.).
Picture this:
When you want the user to provide
a short string in a form, you give them an input box
a long text in a form, you give them a text area
a piece of HTML (for a blog post's body, for example), you give them a text area with CKEditor or TinyMCE
pick something from a short list, you give them a drop down menu (like a select box)
a string based on a wide range of known alternatives, you give them an input box with autocomplete (jQuery UI Autocomplete, YUI Autocomplete, etc..)
a set of items from a wide range of options, you give them... drumroll...
I don't know! And that's my question. I've searched a bit and could only come up with jquery-tokeninput as a credible option.
I want to remove the "New" option in a entry on the main menu. Its that little right arrow that allows the user to see this menu at all, I'd be okay with completely removing that.
Here is what the element looks like in my sitemap:
<SubArea Id="nav_cases" Entity="incident"
DescriptionResourceId="Cases_SubArea_Description"
GetStartedPanePath="Cases_Web_User_Visor.html"
GetStartedPanePathAdmin="Cases_Web_Admin_Visor.html"
GetStartedPanePathOutlook="Cases_Outlook_User_Visor.html"
GetStartedPanePathAdminOutlook="Cases_Outlook_Admin_Visor.html" />
And based on the sitemap documentation I don't think I can acheive this with the xml.
So I guess I want to know if this is possible? Or is this just part of the framework I can't get at? Is there some clever javascript I can do?
The reason I want to remove it is because these are childen in a parent:child relationship and we only want users to create them from the context of the parent record.
Unfortunately I don't think there is a way to do this (unless you go way unsupported and are not online).
An alternative would be to have JavaScript on the form that immediately prompts the user for the parent record. That's probably the approach I would take.
For example my SQL has columns 1,2,3,4,5. if the user wants to order the results by say 4,2,5 or 5,1,3,2,4 etc, how should i design my form to ask the user or whats the best way to do this?
one solution comes to mind is a select box with add/remove and up/down button. Is there a better solution?
btw the output result is in a file and not a datagrid.
A good UI for this would be to allow the users to use the mouse to move the items around. For example look at the sortable demo of the jQuery UI.