2011-12-06 49 views
1

我有2個窗體在1頁和日期字段在這兩種形式打開datepicker JavaScript。使用datepicker與1頁上的多個表單

當我點擊第一個表單日期字段時,我選擇一個日期並且所有的工作都很好。 當我點擊SECOND窗體時,日期選擇器會像正常一樣彈出,但是當我選擇一個日期時,日期會插入到第一個窗體的日期字段中。

這是爲什麼?

的Javascript是這樣:

<script> 
$(function() { 
    $('.datepicker').datepicker({ 
     numberOfMonths: 3, 
     showButtonPanel: true 
    }); 
}); 
</script> 

我試着做$('.datepicker', this).datepicker({但它沒有工作!有任何想法嗎?

HTML兩種形式:

<form method="post" action="contact.php" name="contactform" id="contactform"  
    class="contactform"><div class="message"></div> 
<div id="my_contact_left"> 



     <label for="name" accesskey="U"><span class="required">* 
</span>Name</label><br /> 
     <input name="name" type="text" id="name" size="30" class="name" /> 

     <br /> 
     <label for="email" accesskey="E"><span class="required">* 
</span>Email</label><br /> 
     <input name="email" type="text" id="email" size="30" class="email" 

/> 

     <br /> 
     <label for="phone" accesskey="P"><span class="required">* 
</span>Phone:</label><br /> 
     <input name="phone" type="text" id="phone" size="30" class="phone" 
/> 

     <br /> 
     <label for="dayin" accesskey="P">Day in:</label><br /> 

     <input name="dayin" type="text" id="dayin" size="30" class="dayin 
datepicker" /> 

     <br /> 
     <label for="dayout" accesskey="P">Day out:</label><br /> 
     <input name="dayout" type="text" id="dayout" size="30" 
class="dayout datepicker" /> 

</div> 
<div id="my_contact_right"> 

     <label for="comments" accesskey="C"><span class="required">* 
</span>Your Comments</label><br /> 
     <textarea name="comments" cols="40" rows="3" id="comments" 
class="comments" style="width: 350px; height:100px;"></textarea> 

     <p><span class="required">*</span>Type the validation code in 
below</p> 

     <div style="width:100px; height:40px; float:left;"><label 
for="verify" accesskey="V">&nbsp;&nbsp;&nbsp;<img src="image.php" alt="Image 
verification" 
border="0"/></label></div> 
     <div style="width:310px; height:40px; float:right;"><input 
name="verify" type="text" id="verify" class="verify" size="6" value="" style="width: 
50px;" /> 
     <input type="submit" style="margin-left:112px;" class="submit" 
id="submit" value="Send it!" /></div> 
     <div style="clear:both; width:410px;"></div> 

</div> 
<div id="clearing1"></div> 

     </form> 
+2

顯示您的html代碼 –

回答

1

你可以嘗試這樣的:

 
//make 2 ids for date pickers instead of class 
$(function() { 
    $('#datepickerId1, #datePickerId2').datepicker({ 
     numberOfMonths: 3, 
     showButtonPanel: true 
    }); 
}); 

+0

是的,我試圖避免這樣做,因爲我可能會添加更多的表單和不想繼續添加另一個ID(不像它的任務) - 只是認爲會有一個簡單的方法,而不是一直添加不同的ID – Reflex84

3
<script> 
$(function() { 
    $('#datepicker1').datepicker({ 
     numberOfMonths: 3, 
     showButtonPanel: true 
    }); 
    $('#datepicker2').datepicker({ 
     numberOfMonths: 3, 
     showButtonPanel: true 
    }); 
}); 

</script> 

然後給你datepickers DATEPICKER1或DATEPICKER2的ID等

相關問題