News

Statistics

Locations of visitors to this page

Personal


So if you are in my situation, where you have a project using prototype and you want to use the jQuery date picker, you will notice that in certain situations, depending where your javascript is defined, you pickers won't work.

The problem is the jQuery and Prototype $. You need to redefine the jQuery $ with anoter literal, like $j.

So try this:

<script type="text/javascript" charset="utf-8">
    var $j = jQuery.noConflict();

    $j(function() {
        $j('.date-pick')
                    .datePicker({ createButton: false })
                    .bind('click',
                        function() {
                            $j(this).dpDisplay();
                            this.blur();
                        })
                    .bind('dateSelected',
                           function(e, selectedDate, td) {
                               this.innerHTML = selectedDate.asString();
                           }
                            );
    });   

</script>

 

Translation is that all objects in the document that have class 'date-pick' will have a date picker attached , on click they will open the date picker, on dateselected they will be updated to show the new selected date (this is a link which I click in order to open the calendar and after it is open, I update the text of the link with the date selected).

 

  • Share This Post:
  • Share on Twitter
  • Share on Facebook
  • Share on Technorati

Comments

Gravatar # re: jQuery date picker avoiding Prototype conflicts : dollars on the table!
Posted by Sachin on 7/24/2010 9:23 PM
could you please me the code
Post A Comment
Title:
Name:
Email:
Website:
Comment:
Verification: