I am looking for a jQuery list that is editable (add, change, delete elements), what is a good starting point code base that does this?
I found this one example which is great, but it doesn't add, edit or delete list items:
http://jqueryui.com/demos/sortable/default.html
you would use that jQuery library along side some small plugins, there not that hard to extend if you understand the Dom and jQuery.
take a look at this plug-in for example.
http://www.appelsiini.net/projects/jeditable/default.html
Related
Is it possible to extend rich:select or h:selectOneMenu to enable multiple selection? I am looking for a jsf component which looks like the jQuery Chosen plugin.
The component should let me select multiple options from the drop down.
Please note that I can not use h:selectManyMenu or list box because of the specific requirement.
Note: just saw the tags field below the description box while posting a question. I am looking exactly for the same functionality, except that I want a JSF component, not a js plugin.
Any suggestion is highly appreciated. Thanks in advance.
I would use that jQuery Chosen plugin and do something like this:
use jQuery to apply it to your select
use jQuery to get the selected data
pass the data to the backing bean via a hidden input field
There may be 'pure JSF' ways but it looks like more work. If you find something interesting let me know.
What it says in the title. I have a simple app that needs the functionality, but can be otherwise written in plain clojurescript so it seems pretty wasteful to load jQuery and jQueryUI just for that.
The closest thing to jQueryUI's Sortable in the google closure library is goog.fx.DragListGroup. As far as I know there is no ClojureScript wrapper for that, but it should be fairly simple to code against it directly and since it's in the closure library it should optimize well too. The basic idea is that you instantiate a DragListGroup for each independent list that you want to be sortable, and then add the list element to that group using addDragList. You can also add multiple list elements to the same group if you want to be able to drag elements between lists.
Here is one way to get this working. You'll need to use an extern file so Google Closure can read the jQuery libraries. There is one for the main jQuery already published and I posted one that works well for jQuery-ui's sortable. The project.clj should have a reference to the extern, so include something like this:
:dependencies [[org.clojure/clojure "1.5.1"]
[org.clojure/clojurescript "0.0-1806"]
[jayq "2.3.0"]]
:plugins [[lein-cljsbuild "0.3.1"]]
:cljsbuild {
:builds [
{:source-paths ["src"]
:compiler
{:output-to "resources/public/js/out.js"
:optimizations :advanced
:pretty-print false
:externs ["resources/public/externs"]}}]})
Then write some cljs for the sortable function (jayq makes this easy):
(ns sortable.core
(:use [jayq.core :only [$]]))
(defn sortable [$elem]
(.sortable $elem))
(defn disable-selection [$elem]
(.disableSelection $elem))
(let [$sortable ($ :#sortable)]
(sortable $sortable)
(disable-selection $sortable))
And include an index.html file for the project like this.
There might be some way to compile the jQuery libraries directly with :foreign-libs in the project.clj but I'm not sure how to do that.
EDIT: Sorry this still uses the entire jQuery library so it doesn't really answer the question.
Because I have no clue about clojurescript I can't give you a proper solution in clojurescript but jQuery and jQuery UI shouldn't be that wasteful.
You could include the jQuery library by making use of the Google CDN. Lots of websites use this source and therefore the file gets cached and won't be downloaded again and again.
See this link.
//you can of course easily change the version you want to use, like 1.9.1
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script
The same could be done for jQuery UI
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
But if you just want to use the sortable widget of jQuery UI you could simply use their Download Builder.
Just uncheck the "Toggle all" checkbox below "Components" and then check the sortable checkbox in "Interactions".
Download your customized jQuery UI version and all you need to include is the jquery-ui-1.10.3.custom.min.js file. The Download Builder downloads a CSS theme also but for the sortable widget I see no need to include it.
But in fact including jQuery UI from Google CDN is also a good choice. If you host the libraries locally your users must download it at least once. If you use Google most of the user won't need to download the files. (unless the version is different)
Just a suggestion if there's nothing in clojurescript which could help you out.
Are there any good alternatives to jQuery FlexBox? I need the functionality to select from auto-suggest drop down list and input new values like on a textbox.
So the Autocomplete control from jQuery UI has emerged to be a useful alternative for my own purposes:
http://api.jqueryui.com/autocomplete/
Try this :
http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/index.htm#demos/jqxgrid/dropdowngrid.htm
this will contain all functionality of grid.
is there any way (or plugin) to display editable combobox? I have a set of options, but I would like to give possibility to enter custom value.
I've searched the documentation, and I can't find way to do this. I made workaround with javascript, but I'm looking for more elegant solution.
I'm pretty sure that there simply is no HTML form element that does this, and so Rails can't provide you with a helper. As you said, you can work with JS to create something similar (and there should be JS libraries/plugins already out there), or you could just use a select element and add a text field next to it for new values.
HTML5 specification doesn't define such an element. So you may either continue using JS, either try to use autocomplete feature of an input element (although it is not exactly what you want and doesn't compatible with old browsers).
I've created a theme and applied it to my ASP.NET MVC site. However, the elements on the page aren't picking up the styles automatically. If I do the following for a specific element they get applied appropriately:
$("input[type=button]").button();
$("input[type=submit]").button();
Am I right in thinking I need to do this for all the different elements? Perhaps incorrectly, I assumed this would be done automatically by referencing the css and custom js files?
Thanks
you can write :submit instead of input[type=submit], but I know that's no the answer of your question.
The jQuery UI library only provides code to style your website, but it doesn't do it automatically. So what you need to do is something like this:
$(":submit, :button, :reset").button();
But sometimes you want to use icons or something like this, then you can use
$("#specificButton").button("option", "...", "...");
I hope it helps!