jQuery Context Menu development continues
Geplaats op 00:07:57 13-08-2010 in jQuery
Since this week we have decided to continue development on a jQuery plugin, once released by abeautifulsite. The creator had announced not to have the time needed to continue the development and support the of plugin. As we are currently working on a new backoffice system for webshops, we came across the plugin and need to make some changes for it to suit our needs.
During the creation of our new backoffice system we felt the need for a contextmenu navigation/selection option for tables with lists. There are quite some plugins around, but the one that in first instance suited our needs still needed some tweaking.
The tweaking
When the context menu is linked up to table rows, it can occur that each row has different information, meaning different items need to be enabled/disabled. Using the jQuery metadata plugin we have chosen to add metadata to the triggers, that are used to enable/disable items and to pass thru other information.
We have also changed the callback function, we have decided to add the metadata of the trigger in the callback function. This way all data can be used in the callback function.
Example of the metadata:
<tr data="{disabled: [1,3,5], ordernumber: '765123'}">In the example above items 2, 4 and 6 are disabled and the attribute ordernumber with the value ‘765123’ is passed thru. Why 2, 4 and 6 while the metadata says 1,3 and 5? The used jQuery eq function is a 0 starting array.
The new lines
Below you will see the two blocks, containing the new lines. The comment explains what has changed, the line numbers corrospond to the line numbers in the orriginal file.
var evt = e;
/* BEGIN NEW */
var caller_data = $(this).metadata();
$('#' + o.menu).find('LI').removeClass('disabled');
for (var i = 0; i < $(this).metadata().disabled.length; i++)
{
$('#' + o.menu).find('LI').eq($(this).metadata().disabled[i]).addClass('disabled');
}
/* END NEW */
evt.stopPropagation();$(".contextMenu").hide();
// Callback
/* $(this).attr('href').substr(1) is replaced by $(this) to offer the complete select link */
/* $(srcElement) is replaced by caller_data, the metadata of the caller object */
if( callback ) callback( $(this), caller_data, {x: x - offset.left, y: y - offset.top, docX: x, docY: y} );
return false;
You can download the context menu plugin here.
To visit the original and download the original version, please visit A Beautiful Site.
Feel free to copy, use, abuse the code of this plugin. However, we would like to be informed about improvements made, as we are never to old to learn.
If you have any kind of question, feel free to ask us, but as it is not an officially supported piece of code, we can not promise to come up with answers/solutions.
Demo
Categorien
Recente berichten
Vreemde wensen temmen
Geplaats op 21:59:47 14-07-2011 in Kantoor
Billink en waar op te letten
Geplaats op 21:56:48 14-07-2011 in Webnieuws
Tradetracker integraties op juridisch gebied
Geplaats op 20:02:08 17-03-2011 in Klanten
