日期选择器采用相同的日期值

date picker take same values of date

我有两个日期选择器 select 开始日期和结束日期 date.when 我 select 从第一个开始它的工作正常但是当我 select 从第二个日期选择器开始它会覆盖第一个 selected 的日期。 我的代码是:

<script type="text/javascript" src="datetimepicker_css.js" /></script>
<table align="left" class="tbl_altcolor shadow" style="width:35%; margin-left:20px">
<tbody>
<tr>
     <td>Date-From:</td>
      <td>
         <input type="Text" id="demo3" class="input required" maxlength="20" size="15" name="time3">
         <img src="images2/date.png" align="center" width="20" height="20" border="0" onclick="javascript:NewCssCal('demo3','yyyyMMdd')" style="cursor:pointer"/>
        <span class="descriptions"></span>
        </td>

         <td>Date-To:</td>
      <td>
         <input type="Text" id="demo2" class="input required" maxlength="20" size="15" name="time5">
         <img src="images2/date.png" align="center" width="20" height="20" border="0" onclick="javascript:NewCssCal('demo3','yyyyMMdd')" style="cursor:pointer"/>
        <span class="descriptions"></span>
        </td>
</tr>

如何解决?

点击图片时,您的代码会触发:

javascript:NewCssCal('demo3','yyyyMMdd')

它在输入 ID demo3 时触发日历,而您在示例中提供的元素具有 ID demo2:

<input type="Text" id="demo2" class="input required" maxlength="20" size="15" name="time5">

因此请确保您的元素具有正确的 ID,并且在触发点击时被正确引用。

HTML代码应该是:

<table align="left" class="tbl_altcolor shadow" style="width:35%; margin-left:20px">
    <tbody>
        <tr>
            <td>Date-From:</td>
            <td>
                <input type="Text" id="demo2" class="input required" maxlength="20" size="15" name="time3">
                <img src="http://www.rainforestnet.com/datetimepicker/images2/cal.gif" align="center" width="20" height="20" border="0" onclick="javascript:NewCssCal('demo2','yyyyMMdd')" style="cursor:pointer" />    <span class="descriptions"></span>

            </td>
        </tr>
        <tr>
            <td>Date-To:</td>
            <td>
                <input type="Text" id="demo3" class="input required" maxlength="20" size="15" name="time5">
                <img src="http://www.rainforestnet.com/datetimepicker/images2/cal.gif" align="center" width="20" height="20" border="0" onclick="javascript:NewCssCal('demo3','yyyyMMdd')" style="cursor:pointer" />    <span class="descriptions"></span>

            </td>
        </tr>
    </tbody>
</table>

Here is the JSFiddle demo