4

How do we rename a jquery function. let's say i want to rename the Jquery UI function draggble() to xdraggble() so that it does not conflict with another draggable function loaded from another library. Does renaming affect performance.

Pinkie
  • 10,126
  • 22
  • 78
  • 124

2 Answers2

8

Something like this, executed before the other script loads:

jQuery.fn.xdraggable = jQuery.fn.draggable;
Matt Ball
  • 354,903
  • 100
  • 647
  • 710
  • you may need to call `delete jQuery.fn.draggable` if the other script checks for the existence of `jQuery.fn.draggable`. – zzzzBov Mar 04 '11 at 03:52
  • why would the other script check for the existence of draggable. What does delete do behind the scene. – Pinkie Mar 04 '11 at 03:56
  • @Pinkie: see the [MDC `delete` docs](https://developer.mozilla.org/en/JavaScript/Reference/Operators/Special_Operators/delete_Operator). – Matt Ball Mar 04 '11 at 16:33
  • `delete` deletes the value of property in object but not the property itself – Muhammad Umer Aug 23 '13 at 17:54
2
var xdraggable = $.fn.draggable;
//or
var xdraggable = $.draggable;

(depending implementation)

Same as what you'd do if you wanted to override the function but still have access.

See this post regarding what I mean by overriding

Community
  • 1
  • 1
Brad Christie
  • 100,477
  • 16
  • 156
  • 200
  • You set xdraggble as a var. I can't use it as a function. – Pinkie Mar 04 '11 at 03:54
  • @Pinkie: I was just demonstrating you can make it any variable and copy the function. MattBall's answer copies it within the jQuery object (which is more or less what you probably want--retain implementation, just use a different alias). Also, you can call xdraggable as a function, try this: `var a = function(){ alert('Hello, world!'); } a();` – Brad Christie Mar 04 '11 at 03:56
  • +1 @Brad: very insightful @ Pinkie: are functions not first class variables in javascript? http://stackoverflow.com/questions/705173/what-is-meant-by-first-class-object – naveen Mar 04 '11 at 03:58
  • @brad I set `var xdraggable = $.fn.draggable;`, when i try `$('div').xdraggble();` it doesn't work. Isn't this how i'm supposed to use it. – Pinkie Mar 04 '11 at 04:12
  • @Pinkie: use `jQuery.fn.xdraggable = jQuery.draggable` then try. – Brad Christie Mar 04 '11 at 05:46
  • I got it, but `jQuery.draggable` does not work. It only works when it has the `fn` like `jQuery.fn.draggable` as i matts answer. +1 for the info. – Pinkie Mar 04 '11 at 06:52
  • @Pinkie: `jQuery.fn.` is the shortcut to `jQuery.prototype`. It extends the jQuery object so you can use `$(...).xdraggable`--but it needs to be a jquery object. – Brad Christie Mar 04 '11 at 13:05