Solved

How to use datepicker with dynamic table

Posted on 2013-01-29
2
387 Views
Last Modified: 2013-01-29
I am trying to use jQuery datepicker with a dynamic table. The problem I am having is that the date picker keep changing the date in the first row. The codes I am currently using is as follows:-

<script>
$( document ).ready(function() {

  $(function()

        {
            $(".datepicker").datepicker({dateFormat: "dd M yy", changeMonth: true, changeYear: true,Anim:"Clip"});

            $(".datepicker").attr('readOnly', 'true');

        }
    );

    $(".button").click(function() {

                var $currentrow= $(this).closest('tr');
                $(".datepicker").datepicker("destroy")
                var $newrow=$currentrow.clone(true);
                $newrow.find('input:text').val('');
                $newrow.find(".datepicker").datepicker({dateFormat: "dd M yy", changeMonth: true, changeYear: true,Anim:"Clip"});
                $newrow.appendTo('tbody');

            })

        });

</script>

Open in new window


So what do I need to do to insert the date into the new row.

Thanks
0
Comment
Question by:Sheils
2 Comments
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
ID: 38830800
Test page : http://jsfiddle.net/F5cPx/
$( document ).ready(function() {
    $(".datepicker").datepicker({dateFormat: "dd M yy", changeMonth: true, changeYear: true,Anim:"Clip"});
    $("table").on("click", ".button", function() {
        var $newrow = $(this).closest('tr').clone().appendTo('table');
        var id = "dp"+new Date().getTime();
        $newrow.find('.datepicker').attr({"id":id}).val("").removeClass("hasDatepicker");
        $("#" + id).datepicker({dateFormat: "dd M yy", changeMonth: true, changeYear: true,Anim:"Clip"});
    })
});

Open in new window

0
 
LVL 16

Author Closing Comment

by:Sheils
ID: 38834190
Thanks Mate
0

Featured Post

How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

Join & Write a Comment

Introduction HyperText Transfer Protocol (http://www.ietf.org/rfc/rfc2616.txt) or "HTTP" is the underpinning of internet communication.  As a teacher of web development I have heard many questions, mostly from my younger students who have come to t…
Introduction Got endorsements from your clients?  Great!  There is almost nothing better than word-of-mouth advertising.  But how can you do that on the internet?  Sure you can make a page for endorsement quotations and list them all, but who is …
It is a freely distributed piece of software for such tasks as photo retouching, image composition and image authoring. It works on many operating systems, in many languages.
Get a first impression of how PRTG looks and learn how it works.   This video is a short introduction to PRTG, as an initial overview or as a quick start for new PRTG users.

746 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

15 Experts available now in Live!

Get 1:1 Help Now