需要使用Jquery在所有行中添加日期选择器

Question

我将视图附加到图像上。我想在所有行中为列到期日期添加日期选择器。

此处第一行包含列到期日期的ID为'expiry_1_date'

2nd row -> 'expiry_2_date'
3nd row -> 'expiry_3_date'
4nd row -> 'expiry_4_date'
5nd row -> 'expiry_5_date'

请帮助我在Jquery中实现所需的结果。提前谢谢!!!

Answer 1

使用选择器开始。并调用datepicker方法。

试试这个

$('input:text [id^="expiry_"]').datepicker();

或替代方法为每个文本框添加一个类。

然后像这样使用

$('.SomeClass').datepicker();

Demo

Answer 2

尝试

$("input[id^='expiry'][id$='date']").datepicker();

请参阅DEMO HERE

并添加css尝试使用此

<style type="text/css">
  .ui-datepicker {
       background: #333;
       border: 1px solid #555;
       color: #EEE;
   }
 </style>

Answer 3

将attribute selector []与^

一起使用

  

选择具有指定属性的元素，其值始于给定字符串。

试试这个

 $('input[id^="expiry_"]').datepicker();

Answer 4

使用类datepicker

设置输入

<input type="text" class="datepicker" />

然后加载它：

$(function() {
  $( ".datepicker" ).datepicker();
});

您可以从中获取日期：

$(".datepicker").datepicker(
{
    onSelect: function()
    { 
        var dateObject = $(this).datepicker('getDate'); 
        alert(dateObject);
    }
});

Answer 5

您可以选择ID为start with字符串expiry的所有元素，并为其指定datepicker：

$('input[id^="expiry"]').each(function() {
    $(this).datepicker();
})

演示：http://jsfiddle.net/pyMzT/