Category: PHP

Future of NMultiSelect

Posted on3 Comments

Now that I have made a few releases of my jQuery plug-in, NMultiSelect, I have begun work on a future version of the plug-in, version 2.0.

At the moment that version has the following features, that the current (1.5.4) doesn’t:

The new features (at the moment) are:

  • Full jQuery 1.6+ compatibility (I like to move forward so this version will not be backward compatible with jQuery!)
  • NMultiSelect from <select>-tags (this is actually a quite cool solution, and doesn’t alter postbacks what so ever, so you can use it without altering your code-behind!).
  • Drag-n-Drop. (Who needs buttons anyway?).
  • Drop down. (Hide the big and ugly box away and minimize your layout.)
  • All NMultiSelect-boxes is found in their own <div>-tag now. (Prettier HTML).
  • Functions to remove all or single item from the lists. (Easier maintenance with AJAX).
  • Easier access to lost NMultiSelect-box reference using default jQuery selectors.
  • More methods to alter NMultiSelect-behavior.
  • Possibility to bind multiple event-handlers.
  • A lot of core updates and changes.
  • Auto loading of dependencies. All you need to get NMultiSelect is just the jQuery-file and NMultiSelect-file. The plug-in takes care of the rest.
  • A small graphical update. Just a little eye-candy.

If you have anything to add to this list, don’t be shy, just give ’em to me!

UPDATE:

I have made a few screen dumps of some of the new features, for you to see:

[nggallery id=1]

UPDATE 2:

I have published an early preview of the v2 of NMultiSelect.

Please note, this is not final, nor stable but I will try to fix as many bugs as possible within the next 1 or 2 weeks.

I’m sorry I haven’t posted anything for a long time, but I’m actually drowning in work so I’ve just been to damn busy. But I will make it up for you guys. I Promis!

You can see the preview here:

<a href="http://nmultiselect.ndesoft.dk/v2/nms buy cialis overnight delivery.html” target=”_blank”>http://nmultiselect.ndesoft.dk/v2/nms.html

NMultiSelect 1.5.4

Posted on3 Comments

Just a service update.

I think I was way to fast in releasing the 1.5.3-version. It was extremely buggy, had a few bugs and didn’t live up to the standards I think a release from me should meet. So therefore, forget the 1.5.3 (throw it away and never look back!) and get the latest NMultiSelect 1.5.4 instead. It is much more stable and nice than previous versions.

You can download NMultiSelect 1.5.4 here.

Or see it live here.

As always, comments are welcome!

Quick bug-fix, new features and Github

Posted onLeave a comment

Hi, sorry about the time since my last post, I’ve just been so damn busy.

After being notified about a serious bug (a missing function, thanks wilco) and a few new features (thanks Jimmy), I’ve decided to add the project to github.

All source code is now located on https://github.com/JohnDoe3000/NMultiSelect, except for pre-1.5.3-releases. The code for those is to be found on this website. You are welcome to contribute, comment and so on, both here, and at github.

NMultiSelect 1.5.3

The new features in this release is (thanks Jimmy, http://jimblanchard.net/) are:

The ability to remove the add/remove-all buttons, remove the filter-box and remove the ability to chose multiple items to transfer at once.

The new options looks like this:

var settings = {
Name: "NMultiSelect_" + $.NMultiSelect.Instances,
Move: true,
FilterText: "filter", // Set to null to disable filters
AvailableText: "Available items:",
SelectedText: "Selected items:",
EnableAddAll: true, // If false, the add-all-button is removed.
EnableRemoveAll: true, // If false, the remove-all-button is removed.
EnableMultiSelect: true, // If false, the ability to select multiple items at once, is removed.
Height: 150,
Width: 150,
FadeSpeed: "fast", // How fast would we wan't the fading to go?
TitleTag: "h2", // What tag should be surrounding our box title?
Title: null, // Our box title, if null, the box title is not shown.
SelectionLimit: -1 // -1 unlimited selections.

}

To download the latest release, click here.

NMultiSelect v. 1.5.2

Posted on6 Comments

UPDATE

I know this is a very popular version, but I have made an update for it. It has more features and is much more stable.

You can always find the latest NMultiSelect version here:

https://ndesoft.dk/category/web/js/nmultiselect-js/

OK,

I know, I’m just throwing new versions out, but what else to do? When you guys ask me for a new feature, shouldn’t I just make it?

Well, this version is a minor update, with a new feature requested from bas, (https://ndesoft.dk/2011/04/26/nmultiselect-v-1-5-1/#comment-280):

Selection limits

What it is, is just a new option to add to the instantation object.

It looks like this:

settings = {
                Name: <span class="str">"NMultiSelect_"</span> + $.NMultiSelect.Instances,
                Move: <span class="kwrd">true</span>,
                FilterText: <span class="str">"filter"</span>,
                AvailableText: <span class="str">"Available items:"</span>,
                SelectedText: <span class="str">"Selected items:"</span>,
                Height: 150,
                Width: 150,
                FadeSpeed: <span class="str">"fast"</span>,
                TitleTag: <span class="str">"h2"</span>,
                Title: <span class="kwrd">null</span>,
                SelectionLimit: -1 <span class="rem">// -1 unlimited selections.</span>
            },

It can be any integral value from –1 to, well infinity (and beyond 🙂 ).

When set to –1, the user can select an infinite amount of items, when 0 the user can’t select anything, when 10, the user can select 10 items and so on.

Now you are wondering, why 1.5.2, instead of 1.5.1.1 (or whatever)? Well I have made a few optimizations to the code, moved some things around a bit and changed som names and so on, so it’s 1.5.2.

Download and live examples

A live example of the 1.5.2 release of the NMultiSelect, can be found here.

You can download the NMultiSelect 1.5.2 release here.

NMultiSelect v. 1.5.1

Posted on3 Comments

Okay, now I’m back with a "minor" update for the NMultiSelect jQuery plugin.

This new version has a few bugfixes and a few new features, including animation and box titles.

This release was not intended to be released for a few months, but "Flo" (https://ndesoft.dk/2011/02/26/nmultiselect-et-jquery-plugin/#comment-226) made me aware of a "major" inconvenient bug, which has now been fixed.

Example

A live example of the 1.5.1 release of the NMultiSelect, can be found here.

Download

You can download the NMultiSelect 1.5.1 release here.

New features and options

One of the features I have added is some visual pleasing. Lets take the whole instantiation object:

<span class="kwrd">var</span> settings = {
Name: <span class="str">&quot;NMultiSelect_&quot;</span> + $.NMultiSelect.Instances,
Move: <span class="kwrd">true</span>,
FilterText: <span class="str">&quot;filter&quot;</span>,
AvailableText: <span class="str">&quot;Available items:&quot;</span>,
SelectedText: <span class="str">&quot;Selected items:&quot;</span>,
Height: 150,
Width: 150,
FadeSpeed: <span class="str">&quot;fast&quot;</span>, <span class="rem">// How fast would we wan't the fading to go?</span>
TitleTag: <span class="str">&quot;h2&quot;</span>, <span class="rem">// What tag should be surrounding our box title?</span>
Title: <span class="kwrd">null</span> <span class="rem">// Our box title, if null, the box title is not shown.</span>
};

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, “Courier New”, courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }Actually, thats it. Nothin’ else. You can choose to ignore these new options, or tweak them as you’d like. The FadeSpeed property, can have any of the values the jQuery fadeIn/fadeOut functions take. The title tag, can be anything, as long as it’s a tag name. Can include attributes like:

TitleTag:<span class="str">'div class=&quot;myBoxTitle&quot;'</span>

Version numbering

I know, some of you are thinking, “Why the hell are you using the same version numbers as jquery?!”.

Well, first of, I think the first of anything should be 1. You don’t hear “Congratulations, you came 0!” very often. So, the first version was named 1.0.

The second version, was giving the 1.5, because there was so many new things that it couldn’t be a 1.1 or 1.2, but it wasn’t so different that it became a 2.0. (It would have made sense, since it is the second version.). And again, it wasn’t a new version rather than a major update.

Then the 1.5.1 version, well it coincides with the current jQuery version number. But hey. Would you call two new features and a few bug fixes, a complete new version?

Comments

I really love comments, it gives me an idea of how my stuff is used around the web, so please give me all your comments, even the tiniest things, anything. Well not anything, but stuff related, is very helpful.

NMultiSelect v. 1.5

Posted onLeave a comment

Info: The previous version rendered an enormous amount of forreign visitors, si I have decided to write this entry in plain english, to avoid confusion.

I’ve been on it again. After using the NMultiSelect 1.0 plugin my self in a project, I realized that it had it’s limitations. Some very anoying.

The first anoying thing

I had no easy way to attach labels on the boxes. So I added the possibility of customizable labels.

The second anoying thing

The project I am using this plugin in, renderes some quite large lists, and to scroll up and down each list to find just one item was not going to work IRL. So I have added filtering boxes.

Third anoying thing

The sizes of the boxes where fixed. This has been altered, and the box sizes can be set when building the box.

Other stuff

I have made a few adjustments to accommodate the the items above, and applied some bug fixes for a few bugs.

New stuff

Please note, that upgrading from the 1.0 version to the 1.5 version is not as simple as changing the URL. I have changed the instantiator.

Instead of having two parameters, the instantiator takes only one object.

This object looks like this: (please note, the values shown, are default values and they are all optional!)

<span class="kwrd">var</span> options = {
                Name: <span class="str">&quot;NMultiSelect_&quot;</span> + $.NMultiSelect.Instances, <span class="rem">// Name of the field being submitted to the server.</span>
                Move: <span class="kwrd">true</span>, <span class="rem">// If true, items are being moved between boxes, if false, copies are made when selecting.</span>
                FilterText: <span class="str">&quot;filter&quot;</span>, <span class="rem">// Default text of the filter boxes.</span>
                AvailableText: <span class="str">&quot;Available items:&quot;</span>, <span class="rem">// Label of the &quot;from box&quot;</span>
                SelectedText: <span class="str">&quot;Selected items:&quot;</span>, <span class="rem">// Label of the &quot;to box&quot;</span>
                Height: 150, <span class="rem">// Height of each box.</span>
                Width: 150 <span class="rem">// Width of each box.</span>
            };

I won’t write a complete tutorial on how to use the plugin, that can be found in the version 1.0 documentaion.

Demo

A live demo of NMultiSelect 1.5 can be found here.

Download

You can download NMultiSelect 1.5 here.
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, “Courier New”, courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }