How to Minimize the Code of JavaScript In DatePicker

Question

I am Using jQuery date picker,and I have created multiple instances of DatePicker ( an example )

In JavaScript this script is used four time:

$( "#datepicker" ).datepicker({
    showOn: "button",
    buttonImage:"images/calendar.gif",
    buttonImageOnly: true });

I want to minimize the code of javascript. What should I do?

Answer 1

You can select all ids together:

$( "#datepicker, #datepicker2, #datepicker3, #datepicker4" ).datepicker({
    ...

Although, personally I would've introduced class my-datepicker and used it:

$(".my-datepicker").datepicker({

Answer 2

You could give each of the input elements same class say myDatepicker and then try

Here is the HTML

<p>Date: <input type="text" id="datepicker" class="myDatepicker"></p>
<p>Date: <input type="text" id="datepicker2" class="myDatepicker"></p>
<p>Date: <input type="text" id="datepicker3" class="myDatepicker"></p>
<p>Date: <input type="text" id="datepicker4" class="myDatepicker"></p>

and javascript

        $( ".myDatepicker" ).datepicker({ showOn: "button",

          buttonImage:"images/calendar.gif",

          buttonImageOnly: true 
         });

and here try the fiddle