Question

我正在尝试将DatePicker库用于Date字段，但是在提交表单时，输入字段的“value”为空。
我从这里复制了代码：http://www.monkeyphysics.com/mootools/script/2/datepicker

<script>           
        window.addEvent('load', function() {
        new DatePicker('.demo_vista', { pickerClass: 'datepicker_vista' });
        new DatePicker('.demo_dashboard', { pickerClass: 'datepicker_dashboard' });
        new DatePicker('.demo_jqui', { pickerClass: 'datepicker_jqui', positionOffset: { x: 0, y: 5 } });
        new DatePicker('.demo', { positionOffset: { x: 0, y: 5 }});

         });
</script>
    <li>*DATE : <input name='date' type='text' value='' class='date demo_vista'  /></li>

这是我的网站：http://iconceptsolutions.com.my/projects/grandevest/online-product-registration/

Answer 1

此库的要点是您在HTML文档中写入的字段与浏览器显示的字段不同。

当您构建DatePicker对象时，它会使input fields与其第一个参数匹配，并为每个参数构建另一个input field，它实际上会获取用户选择的日期并由浏览器显示。

因此，要获得您正在寻找的值，您必须获得对原始input field的引用，并使用它调用MooTools函数getNext()，以便您可以检索所需的值：

所以，对于这个HTML：

<input name='date' type='text' value='' class='date demo' id='dateField' />

您可以使用以下代码获取所需值：

$('dateField').getNext().get('value')

例如，当用户单击提交按钮时，可以调用它。如果您需要处理表单的PHP脚本的值，那么使用上面的MooTools行，您可以设置原始input field的值，然后将其发送给PHP。

<强>更新

我已设置this JsFiddle用于测试目的。

Answer 2

不确定，但我想知道你的

value=''

在

<li>*DATE : <input name='date' type='text' value='' class='date demo_vista' /></li>

是否会覆盖日历？

如果将其删除会怎样？

Answer 3

试试这个：

<input id="datepicker" name='date' type='text'/>

javascript函数new datepicker使用ID datepicker创建'datepicker'作为DOM对象。您需要标记中的ID来指定它。您根本不需要该值，您可以在标头中的datepicker脚本本身中设置默认值。这也是您选择主题的地方，而不是HTML标签。

MooTools DatePicker库：如果提交表单，则“value”为空

3 个答案: