Mazhar Ahmed
Mazhar Ahmed

Reputation: 1533

FancyUpload with JQuery

How to use FancyUpload in a JQuery based project? The page in which I will use FancyUpload is made of JQuery. How to use FancyUpload? Please mention every steps in details. Please

Upvotes: 3

Views: 6000

Answers (4)

Jonathon Hibbard
Jonathon Hibbard

Reputation: 81

I successfully implemented FancyUpload with jQuery loaded as I discussed above. jQuery.noConflict() is the best solution if you want both jQuery and Mootools to co-exist. Otherwise, yeah, probably should stick with either "just" jQuery or "just" mootools.

My opinion, though, is that (while I'm a jQuery fan), the FancyUpload tool for Mootools is hands-down the cleanest, nicest looking, best/easiest to use tool for the job. it's the only piece that was mootools for me, and is light-weight enough to include without seriously burdening the browser loadtime.

Upvotes: 1

Jonathon Hibbard
Jonathon Hibbard

Reputation: 81

You could just place jQuery in noConflict mode. Doing this requires that you put wrappers around all jQuery code where mootools will be loaded on the page. It's simple enough.

Example:

<script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/mootools/1.2.5/mootools-yui-compressed.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script language="javascript" type="text/javascript">
  jQuery.noConflict();
</script>

<script type="text/javascript" language="javascript">
// Example with Sep Mootools and jQuery domready's...
(function($){
  window.addEvent('domready',function() {
    // Do some MooTools Magic here!
  });
})(document.id);

(function($) {
  $(document).ready(function() {
    // Do some jQuery stuff!
  });
})(jQuery);


// Example with Mootools used as domready, with jQuery calls inside
(function($){
  window.addEvent('domready',function() {
    // Some mootools magic here! 
    //......
    //Option 1 for jQuery using jQuery identifier...
    alert(jQuery("#some_input_value").val());

    // Option 2 for jQuery using temp override of $
    (function($) {
      alert($("#some_input_value").val());
    })(jQuery);
  });
})(document.id);
</script>

Upvotes: 7

GlenCrawford
GlenCrawford

Reputation: 3389

If your heart is set on using FancyUpload in your jQuery project:

Step #1: Get MooTools.

FancyUpload does not work in jQuery, and as far as I know, there are no plans to make it do so. There are, of course, plenty of alternatives, such as meo's answer, above.

Upvotes: 0

meo
meo

Reputation: 31249

maybe you should use http://www.uploadify.com/demo/, its native Jquery with Flash. FancyUpload is a mootools plugin.

Upvotes: 2

Related Questions