Question

I want to diffrentciate 2 timepickers. Before, both timepickers were displayed in one textbox. Now both timepickers are displayed with the right textbox. But there is one problem, I want one text box (duration text box) to display the trent richardson jquery timepicker and I want the other text box (start time text box) to display the francois gelinas timepicker.

At the moment both textboxes uses the trent richardson timepicker but I do not know how to seperate both timepickers in my function so that the code knows which timeicker is trent’s and the other is francois’s.

The jquery and html code is below:

        $(function() {
            $('#timepicker').timepicker({ //francois timepicker
        showOn: 'button',
        button: '.timepicker_button_trigger'});


            $('#durationpicker').timepicker({ //trent's timepicker

                });

        });

     <form action="QandATable.php" method="post" id="sessionForm">


<p><strong>3: Duration:</strong> <input type="text" id="durationpicker" name="durationChosen" readonly="readonly" /></span>

<p><strong>5: Start Time:</strong> <input type="text" id="timepicker" name="timeChosen" readonly="readonly" /><span class="timepicker_button_trigger"><img src="Images/clock.gif" alt="Decrease" /></span>
                <br/><span id="dateTimeAlert"></span></p>
    </form>

to look at trent’s timepicker, click here (he has one which is date and timepicker and further down the page he just has timepicker).

To look at francois’s timepcker click here (this timepicker is better for picking time but it does not contain seconds while trent’s does)

Answer 1

assuming they both follow good jquery plugin guidelines, they will both be setting the same $.fn.timepicker object to their own method. To use both plugins, I think you will have to change one of them in the source code to something else…

in the plugin…

$.fn.trentTime = function(){ ... }

and in your code…

$('#durationpicker').trentTime({ ... });