Is there any sort of free control which does what the Occupation field does on http://monster.ca? That is allow for grouping of the options in a drop down box with expandable sections? I just learned about the optgroup tag which is close to what I want, but not quite.
It is just a mock up of a drop down control.
The down arrow is an image, all the remainder is made of divs, the drop down list itself being a big div with overflow containing lot of controls with JavaScript to manage all of this (like collapsing sections).
So you can do that yourself, with a bit of work, and lot of help from a good JavaScript framework...
Basically what the developers at Monster.ca are doing, is emulating a select-control using a div-element with scrollable content.
Take a look at the "overflow" CSS-property.
You can't do this with a traditional <select> control, and I doubt there are ready-made components that fit the bill. If you do want to make this yourself, and don't want to buy into a toolkit like extjs or dojo (which would probably make it easiest to build this), I can recommend the following tree library, as it is very simple to use and BSD licensed: http://www.silverstripe.com/tree-control/
Try this, not sure if the interface is any good for your purposes:
http://flooble.com/scripts/hier.php
Related
Is there any best practices?
Say, I need to develop a flip-flop block with title/icon on front and text on reverse side.
And I want that user can simply insert that block in a grid. With params, I said above.
From here - I see only macros-way (simple). I mean - develop each block in macros, so umbraco-engine can paste it (macros) to grid "from-a-box". But, I don't believe it, I can not even create a folder from backoffice for macro!
Harder way - dive into custom property editor, many setups, many moves. And I don't sure - can I paste result into grid?
I see, that people talks about some great package that called "ARCHETYPE", but project is closed for now... Should anyone bet on that?
Which way is right?
If I understand correctly, you are using Umbraco Grid and want to create a custom grid edtior. If that is the case, I would recommend you looking into LeBlender. It basically enables you to create grid types in the same way you make document types, including templates.
I am interested in knowing how the following link is able to list items/links in the form of an explorable tree - I am referring to the PAGE TREE structure in the left hand side div/section.
https://www.securecoding.cert.org/confluence/pages/viewpage.action?pageId=637
I want to know how what all things/items/urls that have to appear under the parent node are determined. I mean how does this happen?.
Any inputs are most welcome.
Thanks,
Pavan.
What Guille and Banana said is correct. Plus if you use the Inspect option in your browser while testing out the tree, it'll show part of what they are using is
style="display:none"
and
style="display:block"
That's a hint to get you started but yeah like they said, lots of plugins out there to use or ways for you to program it.
Also as a quick suggestion, Bootstrap comes with a tree option along with many other features.
I am a fresh from XAML person. I am now building a HTML5 UI, where I need a dropdown box which will have items in a hierarchal view (need to have ul with li(s) inside dropdown). Each item also needs to have a check-box to its left. If this was XAML, I could've done it easily, because most elements are containers. But in HTML5, I've no idea what to do.
From my searching, what I've understood is that one way is to build a custom control using jQuery.
Is there a simpler way to achieve this in HTML5?
Thanks
I think the easiest way to do that is a jQuery (or any other JS UI Framework). You can also just use plain Javascript.
A combination of HTML and CSS is also possible. Just search "CSS Dropdown" and add some Checkboxes. I do not know a pure HTML5 solution.
I have this textarea element, and i want each line in the box to be clickable and respond to javascript events, is that possible or am i looking for a different type of element?
That is not possible. In order for you do produce such behavior, you would need to design your own "textbox". Google Docs has done this for example, where the entire "textarea" is a complex and highly functional set of divs etc.
A much less intensive version of the multi-div selectable layout could be accomplished with Data Tables. See the tutorial here
They also offer tutorials on edit-in-place as well as select and delete. If you're not already using a grid to present data, it's a great tool for UI.
I required to write a small web application that allow customer to select predefined layout template in html and be able to modify it. The application need to allow customer to add block text to pre defined area and images. The block texts need to be able to reorder based on customer need. eg. move up , move down or move to sidebar. THe complete layout will be able to convert to table layout and inline css due to email program doesn't like div & css. I don't know where should I looking for the information to make this happen, could anyone show me how to do this.
Thank you
Of course, I may be misunderstanding you. You might consider using a standard content management system such as:
linux based
joomla
Mambo
Windows based
DotNetNuke
Sharepoint
Those systems have the functionality you described built in with the added benefit that most of them are free and open source.
I'm not sure why someone downvoted you, but check out a javascript framework like script.aculo.us or Yahoo's YUI
Those will go a long way towards creating the interface you need. Also they have a lot of examples.
The Yahoo framework has an inplace html editor (I think that is what you are asking for). Another editing is the fckeditor.