मैं आज की तारीख के साथ एक jQuery के डेटापिक टेक्स्टबॉक्स को पूर्व-आबाद कैसे करूं?

Question

मेरे पास एक बहुत ही सरल jQuery का Datepicker कैलेंडर है:

$(document).ready(function(){
    $("#date_pretty").datepicker({ 
    });
});

और HTML में ...

<input type="text" size="10" value="" id="date_pretty"/>

जब वे कैलेंडर लाते हैं, तो उपयोगकर्ता के लिए आज की तारीख अच्छी तरह से हाइलाइट होती है, लेकिन मैं उपयोगकर्ता को कुछ भी किए बिना पृष्ठ लोड पर आज की तारीख के साथ टेक्स्टबॉक्स को पूर्व-आबाद करने के लिए jQuery कैसे प्राप्त करूं? 99% समय, आज की तारीख डिफ़ॉल्ट वही होगी जो वे चाहते हैं।

Comments

सबसे लोकप्रिय उत्तर बेहतर है जो स्वीकृत उत्तर है। स्वीकार किए गए उत्तर को बदलना बेहतर है।

— अहम्दाली शफी ने

मेरे संबंधित प्रश्न stackoverflow.com/questions/25602649/…

— एड्रियन बनो

@ अहमदलीशाफी (और बाकी सभी)। वर्तमान में स्वीकृत समाधान 2015-05-07 को स्वीकार किया गया था।

— तेईपेम्म

Answer 1

अपडेट: ऐसी रिपोर्टें हैं जो अब क्रोम में काम नहीं करती हैं।

यह संक्षिप्त है और काम करता है (अप्रचलित):

$(".date-pick").datepicker('setDate', new Date());

यह कम संक्षिप्त है, का उपयोग श्रृंखलन यह क्रोम में काम (2019/06/04) की अनुमति देता है:

$(".date-pick").datepicker().datepicker('setDate', new Date());

Comments

यह समाधान सुरुचिपूर्ण है

— छिपा हुआ

यह वह है जो वास्तव में मेरे लिए काम करता है न कि स्वीकृत समाधान। धन्यवाद

— Mehdiway

यह काम नहीं करेगा, पहले आपको $ ("। तारीख-पिक") कॉल करना चाहिए। डेटपिकर (); और फिर $ ("। तारीख-पिक")। डेटपिकर ('सेटडेट', नई तारीख ());

— मीशा अकोपोव

हाल के ब्राउज़र अपडेट के बाद क्रोम में काम नहीं कर रहा है

— मैक्स फ्लेक्स

काम करता है। मैं सेट कर रहा हूं $(".date-pick").datepicker().datepicker('setDate', new Date()); यद्यपि

— seebiscuit

Answer 2

आपको कॉल डेट (पहले) को कॉल करना होगा, फिर वर्तमान तिथि प्राप्त करने के लिए 'सेटडेट' का उपयोग करना होगा ।

$(".date-pick").datepicker();
$(".date-pick").datepicker("setDate", new Date());

या अपने सेटपेड विधि कॉल को अपने डेटपिकर इनिशियलाइज़ेशन के बाद कॉल करें, जैसा कि इस उत्तर पर टिप्पणी में दिया गया है

$('.date-pick').datepicker({ /* optional option parameters... */ })
               .datepicker("setDate", new Date());

यह सिर्फ साथ काम नहीं करेगा

$(".date-pick").datepicker("setDate", new Date());

नोट : स्वीकार्य सेटडेट पैरामीटर यहाँ वर्णित हैं

Comments

JQueryUI 1.8 का उपयोग करके मैंने इस समाधान को पूरा करने के लिए एकमात्र (समझदार) तरीका पाया।

— ब्रायनज़

$ ("चयनकर्ता")। डेटपिकर ()। डेटपिकर ("सेटडेट", नई तिथि ()); काम करेगा और दो बार jQuery खोज डोम नहीं बनाता है।

— abc123

महान, स्वीकृत जवाब केवल $ ("दिनांक-पिक") कहते हैं। डेटपिकर ("सेटडेट", नई तिथि ()); और यह पहली कॉल $ ("। डेट-पिक") के बिना काम नहीं करता है। डेटपिकर (); आपका उत्तर बहुत बेहतर है

— मीशा अकोपोव

Answer 3

var myDate = new Date();
var prettyDate =(myDate.getMonth()+1) + '/' + myDate.getDate() + '/' +
        myDate.getFullYear();
$("#date_pretty").val(prettyDate);

काम करने के लिए लग रहा था, लेकिन वहाँ एक बेहतर तरीका हो सकता है ..

Comments

यह दो चीजों को छोड़कर बहुत अच्छी तरह से काम करता है: 1) मैं वर्तमान तिथि प्राप्त करने के लिए jQuery विधि का उपयोग करने की उम्मीद कर रहा था, लेकिन शायद यह कोई फर्क नहीं पड़ता। 2) यह समाधान आज की तारीख से ठीक एक महीने पहले एक मूल्य पैदा करता है!

— मार्कस

ओह - तुम सही हो! यह बाहर की जाँच - w3schools.com/jsref/jsref_obj_date.asp - महीने के 0-11 है - आप 1 जोड़ना होगा .. दिलचस्प, getDate 1-31 है, लेकिन getMonth 0-11 है ..

— लुकास

एक आसान तरीका है .. नीचे मेरी पोस्ट देखें।

— रवि राम

यह समाधान पाठ को सीधे दिखाने और तिथि को एक साथ सेट करने के लिए है, जबकि सिस्कोपफोन के समाधान को पिकर खोलने के बिना मूल्य दिखाने के लिए एक और कदम की आवश्यकता है।

— अफसर मोहेबी

उदाहरण के लिए, setDateआप निम्न तिथि के प्रकार के सामान्य सापेक्ष अंकन का उपयोग भी कर सकते हैं, उदाहरण के लिए अगले दिन .datepicker('setDate', '+1d')।

— कोसी जू

Answer 4

setDate()विधि तारीख सेट और संबद्ध नियंत्रण अद्यतन करता है। यहां कैसे:

$("#datepicker1").datepicker({
    dateFormat: "yy-mm-dd"
}).datepicker("setDate", "0");

डेमो

जैसा कि प्रलेखन में उल्लेख किया गया है, setDate()खुशी से जावास्क्रिप्ट दिनांक ऑब्जेक्ट, संख्या या एक स्ट्रिंग को स्वीकार करता है:

नई तिथि वर्तमान दिनांक स्वरूप (जैसे '01 / 26/2009 ') में दिनांक ऑब्जेक्ट या स्ट्रिंग हो सकती है, आज से कई दिनों तक (जैसे +7) या मान और अवधि (' y ') के लिए स्ट्रिंग महीनों, महीनों के लिए 'एम', हफ्तों के लिए 'डब्ल्यू', दिनों के लिए 'डी', जैसे '+ 1 एम + 7 डी'), या चयनित तिथि को खाली करने के लिए शून्य।

यदि आप सोच रहे हैं, defaultDateतो निर्माणकर्ता में संपत्ति सेट करना संबंधित नियंत्रण को अद्यतन नहीं करता है ।

Comments

यह आपके डेमो में क्यों है यह काम करता है। जब मैं इस कोड को अपनी साइट में कॉपी करता हूं तो पीजी लोड होने पर डायलॉग पॉप अप होता रहता है।

— चोबो 2

यह मेरे लिए काम करता है - स्वीकृत उत्तर और ऊपर दिए गए अन्य विकल्प।

— लाइडियाट

यह उपरोक्त में से किसी भी तरह से एक बहुत बेहतर समाधान है।

— adamj

वर्तमान समय में इस सवाल का सबसे अच्छा जवाब है, हालांकि मुझे तारीख पिकर का मिलान करने के लिए तारीख प्रारूप की आवश्यकता "मिमी-डीडी-वाई" होगी।

— 16:81 पर जॉन81

Answer 5

आज के लिए सेट करें :

$('#date_pretty').datepicker('setDate', '+0');

कल पर सेट करें :

$('#date_pretty').datepicker('setDate', '-1');

और इसलिए आज की तारीख से पहले या बाद के किसी भी दिन ।

JQuery UI देखें > तरीके ›सेट करें ।

Comments

महान, जैसा कि दूसरों ने उल्लेख किया है, आपने $(".date-pick").datepicker("setDate", '+0');

— डेटपिकर

मैंने अपनी इच्छा के अनुसार भी काम किया, क्योंकि मेरी डेटफर्मैट को MySQL के डेट फॉर्मेट (yy-mm-dd) से मेल खाना चाहिए। यह सेटडेट महीने और दिन के लिए शून्य पैडिंग जोड़ता है।

— जॉन्ज

Answer 6

समाधान है:

$(document).ready(function(){
    $("#date_pretty").datepicker({ 
    });
    var myDate = new Date();
    var month = myDate.getMonth() + 1;
    var prettyDate = month + '/' + myDate.getDate() + '/' + myDate.getFullYear();
    $("#date_pretty").val(prettyDate);
});

धन्यवाद ग्रेघोस्त!

Answer 7

यह कोड आपके तिथि-निर्धारण प्रारूप का उपयोग करने का आश्वासन देगा:

$('#date-selector').datepicker('setDate', new Date());

प्रारूप को फिर से लागू करने की आवश्यकता नहीं है, यह डेटपिकर इनिशियलाइजेशन पर (यदि आपने इसे सौंपा है!);

Answer 8

यह एक मेरे लिए काम किया।

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

Answer 9

डेविड के एगहेड के कोड ने पूरी तरह से काम किया, धन्यवाद!

$(".date-pick").datepicker(); 
$(".date-pick").datepicker("setDate", new Date()); 

मैं इसे थोड़ा ट्रिम करने में भी कामयाब रहा और इसने काम भी किया:

$(".date-pick").datepicker().datepicker("setDate", new Date()); 

Answer 10

$('input[name*="date"]').datepicker({
        dateFormat: 'dd-mm-yy',
        changeMonth: true,
        changeYear: true,
        beforeShow: function(input, instance) { 
            $(input).datepicker('setDate', new Date());
        }
    });

Answer 11

लोड करने पर एक निश्चित डिफ़ॉल्ट समय (मेरे मामले में वर्तमान तिथि) के लिए तारीख निर्धारित करने के लिए, और फिर दूसरी तिथि को सिंटैक्स चुनने का विकल्प है:

    $(function() { 
        // initialize the datapicker
        $("#date").datepicker();

        // set the time
        var currentDate = new Date();
        $("#date").datepicker("setDate",currentDate);

    //  set the options for the button  
        $("#date").datepicker("option",{
            dateFormat: 'dd/mm',
            showOn: "button",
          // whatever option Or event you want 
        });
  });

Comments

इस समाधान ने क्रोम में मेरे लिए काम किया, यहां सूचीबद्ध अन्य लोगों ने नहीं

— माइक वॉलमार्ट

Answer 12

तिथि को पूर्व-आबाद करने के लिए, पहले आपको डेटपिकर को इनिशियलाइज़ करना होगा, फिर सेटडेट पैरामीटर मान को पास करना होगा।

$("#date_pretty").datepicker().datepicker("setDate", new Date());

Answer 13

बस मैंने सोचा कि मैं अपने दो सेंट जोड़ूंगा। पिकर का उपयोग एक ऐड / अपडेट फॉर्म पर किया जा रहा है, इसलिए इसे डेटाबेस से आने वाली तारीख को दिखाने की जरूरत है यदि मौजूदा रिकॉर्ड को संपादित करते हैं, या आज की तारीख को नहीं दिखाते हैं। नीचे मेरे लिए ठीक काम कर रहा है:

    $( "#datepicker" ).datepicker();
    <?php if (!empty($oneEVENT['start_ts'])): ?>
       $( "#datepicker" ).datepicker( "setDate", "<?php echo $startDATE; ?>" );
    <? else: ?>
       $("#datepicker").datepicker('setDate', new Date());   
    <?php endif; ?>
  });

Answer 14

आपको 2 विकल्प मिले हैं:

विकल्प ए) आपके कैलेंडर में "सक्रिय" के रूप में चिह्नित होता है, केवल जब आप इनपुट में क्लिक करते हैं।

Js :

$('input.datepicker').datepicker(
                        {   
                            changeMonth: false,
                            changeYear: false,
                            beforeShow: function(input, instance) { 
                                $(input).datepicker('setDate', new Date());
                            }
                        }                         
                     );

सीएसएस :

div.ui-datepicker table.ui-datepicker-calendar .ui-state-active,
        div.ui-datepicker table.ui-datepicker-calendar .ui-widget-content .ui-state-active  {
            background: #1ABC9C;
            border-radius: 50%;
            color: #fff;
            cursor: pointer;
            display: inline-block;
            width: 24px; height: 24px;
        }​

विकल्प बी) आज के साथ डिफ़ॉल्ट रूप से इनपुट। आप पहली तारीख को पॉप्युलेट करें।

$ ("input.datepicker")। डेटपिकर ()। डेटपिकर ("सेटडेट", नई तिथि ());

Comments

विकल्प ए अच्छा है क्योंकि तिथि चयनकर्ता रिक्त रह सकता है जब तक कि किसी तिथि का चयन नहीं किया जाता है, जिस समय यह वर्तमान तिथि तक चूक जाता है

— वैक्सिंगैटिरिकल

Answer 15

var prettyDate = $.datepicker.formatDate('dd-M-yy', new Date());
alert(prettyDate);

आवश्यक नियंत्रण के लिए prettyDate असाइन करें।

Answer 16

इसे इस्तेमाल करे

$(this).datepicker("destroy").datepicker({
            changeMonth: false, changeYear: false,defaultDate:new Date(), dateFormat: "dd-mm-yy",  showOn: "focus", yearRange: "-5:+10"
        }).focus();

Answer 17

यह मेरे लिए बेहतर काम करता है क्योंकि कभी-कभी मुझे कॉल करने .datepicker('setDate', new Date());में परेशानी होती है क्योंकि अगर मैं डेटपिकर पहले से ही मापदंडों के साथ कॉन्फ़िगर किया गया है तो यह गड़बड़ करता है।

$("#myDateText").val(moment(new Date()).format('DD/MM/YYYY'));

Answer 18

इसे इस्तेमाल करो:

$(".datepicker").datepicker({ dateFormat: 'dd-M-yy' }).datepicker('setDate', new Date());

प्रारूप में दिनांक प्राप्त करने के लिए जैसे: 10-Oct-2019 जो उपयोगकर्ताओं के लिए अधिक समझ में आएगा।

Answer 19

$(function()
{
$('.date-pick').datePicker().val(new Date().asString()).trigger('change');
});

स्रोत: http://www.kelvinluck.com/assets/jquery/datePicker/v2/demo/datePickerDefaultToday.html

Comments

मेरे ब्राउज़र ने एस्ट्रिंग () फ़ंक्शन को नहीं पहचाना। मैंने इसे इस तरह किया: $ ("। तारीख-पिक")। डेटपिकर ('सेटडेट', नई तारीख ());

— सिस्कोपिपोन

मुझे लगता है कि asString () को StString () होना चाहिए।

— rg88

केविन लक का डेटपिकर और जेक्वि यूआई डेटपिकर दो बहुत अलग डेटप्रिकर हैं।

— क्रेग होगहीम

@ gamerzfuse jQuery यूआई की तारीख केविन लक के आधार पर है।

— मथियास बिएनेंस