如何使用DateBox插件在jQuery mobile中设置日期框的默认日期?

时间:2013-07-18 06:50:50

标签: jquery-mobile

我正在jQuery mobile中实现日期框。我在弹出窗口中使用日期框,这是有效的。当用户使用(+)按钮打开弹出屏幕时,我需要在文本字段中设置默认日期(当前日期)。

http://jsfiddle.net/ravi1989/uhdYv/

  <div data-role="popup" id="CaseInformationScreen" data-close-btn="none"  data-overlay-theme="a" data-dismissible="false">
                <div data-role="header" data-theme="b" >

                    <a href="#" data-role="button" data-corners="false" id="Cancel">Cancel</a>
                    <h1>Case Information</h1>
                    <a href="#" data-role="button" data-corners="false" id="AddButton">Add</a>
                </div>

                <div data-role="content">
                    <div><img src="img/Documents.png"/></div>
                    <div data-role="fieldcontain">
                        <label for="text-12" style="text-align:top;margin-left: 0px;">Case Name:</label>
                        <input name="text-12" id="text-12" value="" type="text" class="caseName_h" >
                    </div>
                    <div data-role="fieldcontain">
                        <label for="text-12" style="text-align:left;margin-left: 0px;" >Case Date:</label>
                        <!--input name="text-12" id="text-12" value="" type="date" class="caseDate_h"  -->
                           <input name="mydate" id="mydate" type="date" data-role="datebox" data-options='{"mode": "datebox", "useNewStyle":true,"zindex":1200}'/>
                    </div>
                    <div data-role="fieldcontain">
                        <label for="textarea-12">Textarea:</label>
                        <textarea cols="40" rows="8" name="textarea-12" id="text-12" class="caseTextArea_h"></textarea>
                    </div>
                </div>
            </div>

4 个答案:

答案 0 :(得分:2)

如果您使用常规jQuery。

试试这个

 $('#dateElement').datepicker('setDate', new Date());

<强>更新

听起来你正在使用DateBox插件。在这种情况下,请在"defaultValue", "[2013,1,1]"中添加data-options。它需要一个数组或一个字符串值。

<input name="mydate" id="mydate" type="date" data-role="datebox" data-options='{"defaultValue", "[2013,1,1]", "mode": "datebox", "useNewStyle":true,"zindex":1200}'/>

如果您想要当前日期,请像这样使用。

var currentDate = new Date();

"defaultValue", "[" + currentDate.getFullYear() + "," + currentDate.getMonth() + "," + currentDate.getDate() + "]"

答案 1 :(得分:1)

如果您使用的是DateBox插件,则以下内容应该有效:

<input name="mydate" id="mydate" type="date" data-role="datebox" 
       data-options='{"defaultValue": [2013,7,10]}'>

答案 2 :(得分:1)

    To set the Text box's value to current date when the popup opens use this code:

    1. Change id of the associated label to myDate:

    <label for="myDate" style="text-align:left;margin-left: 0px;" >Case Date:</label>

    <input name="mydate" id="mydate" type="date" data-role="datebox" data-options='{"mode": "datebox", "useNewStyle":true,"zindex":1200}'/>

    2. JQM code:

    $( "#CaseInformationScreen" ).bind({
       popupafteropen: function(event, ui) { 
                var date = new Date();

                $('#mydate').trigger('datebox', {
                    'method': 'set',
                    'value': date
                }).trigger('datebox', {
                    'method': 'doset'
                });


       }
    });

答案 3 :(得分:0)

这两行应该有效:

var defaultValue = [year, month, day];
$(element).datebox({'defaultValue' : defaultValue});