CRM sareng Platform Data

Kumaha Prepopulate Lapang Formulir Sareng Tanggal Dinten sareng JavaScript atanapi JQuery

Sanaos seueur solusi nawiskeun kasempetan pikeun nyimpen tanggal sareng unggal éntri formulir, aya waktos sanés sanés pilihan. Urang ajak klien kami pikeun nambahkeun widang disumputkeun kana situs maranéhanana sarta lulus informasi ieu babarengan jeung entri ambéh maranéhanana bisa ngalacak lamun formulir entri diasupkeun. Ngagunakeun JavaScript, ieu téh gampang.

Kumaha Prepopulate Lapang Formulir Sareng Tanggal Dinten sareng JavaScript

<!DOCTYPE html>
<html>
<head>
    <title>Date Prepopulation with JavaScript</title>
</head>
<body>
    <form>
        <!-- Hidden field for the date -->
        <input type="hidden" id="hiddenDateField" name="hiddenDateField">
    </form>

    <script>
        // Function to get today's date in the desired format
        function getFormattedDate() {
            const today = new Date();
            const formattedDate = today.toLocaleDateString('en-US', {
                year: 'numeric',
                month: '2-digit',
                day: '2-digit'
            });
            return formattedDate;
        }

        // Use JavaScript to set the value of the hidden field to today's date
        document.getElementById('hiddenDateField').value = getFormattedDate();
    </script>
</body>
</html>

Hayu urang ngarecah kode HTML jeung JavaScript disadiakeun step by step:

  1. <!DOCTYPE html> jeung <html>: Ieu mangrupikeun deklarasi dokumén HTML standar anu netepkeun yén ieu mangrupikeun dokumen HTML5.
  2. <head>: Bagian ieu ilaharna dipaké pikeun ngawengku metadata ngeunaan dokumén, kayaning judul kaca web, nu diatur ngagunakeun <title> elemen.
  3. <title>: Ieu netepkeun judul halaman wéb janten "Prepopulasi Tanggal sareng JavaScript."
  4. <body>: Ieu wewengkon eusi utama kaca web dimana anjeun nempatkeun eusi katempo jeung elemen panganteur pamaké.
  5. <form>: Unsur formulir nu bisa ngandung widang input. Dina hal ieu, éta dipaké pikeun ngandung widang input disumputkeun nu bakal Asezare populata kalawan tanggal kiwari.
  6. <input type="hidden" id="hiddenDateField" name="hiddenDateField">: Ieu widang input disumputkeun. Éta henteu muncul dina halaman tapi tiasa nyimpen data. Éta dibéré ID "hiddenDateField" sareng nami "hiddenDateField" kanggo idéntifikasi sareng dianggo dina JavaScript.
  7. <script>: Ieu mangrupikeun tag pambuka pikeun blok skrip JavaScript, dimana anjeun tiasa nyerat kode JavaScript.
  8. function getFormattedDate() { ... }: Ieu ngahartikeun fungsi JavaScript disebut getFormattedDate(). Dina fungsi ieu:
    • Éta nyiptakeun énggal Date objék ngalambangkeun tanggal ayeuna jeung waktu ngagunakeun const today = new Date();.
    • Ieu pormat tanggal kana string jeung format nu dipikahoyong (mm/dd/yyyy) ngagunakeun today.toLocaleDateString(). nu 'en-US' argumen nangtukeun lokal (Amérika Inggris) pikeun pormat, sarta objék kalawan year, month, sarta day sipat ngahartikeun format tanggal.
  9. return formattedDate;: Garis ieu mulih tanggal formatna salaku string a.
  10. document.getElementById('hiddenDateField').value = getFormattedDate();: Baris kode ieu:
    • Mangpaat document.getElementById('hiddenDateField') pikeun milih widang input disumputkeun ku ID "hiddenDateField."
    • Susunan anu value milik widang input dipilih kana nilai balik ku getFormattedDate() fungsi. Ieu populates widang disumputkeun jeung tanggal dinten ieu dina format dieusian.

Hasil ahir nyaéta nalika halaman dimuat, médan input disumputkeun sareng ID "hiddenDateField" dieusian ku tanggal dinten ayeuna dina format mm/dd/yyyy tanpa nol utama, sakumaha anu ditetepkeun dina getFormattedDate() fungsi.

Kumaha Prepopulate Lapang Formulir Sareng Tanggal sareng jQuery Kiwari

<!DOCTYPE html>
<html>
<head>
    <title>Date Prepopulation with jQuery and JavaScript Date Object</title>
    <!-- Include jQuery from a CDN -->
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
    <form>
        <!-- Hidden field for the date -->
        <input type="hidden" id="hiddenDateField" name="hiddenDateField">
    </form>

    <script>
        // Use jQuery to set the value of the hidden field to today's date
        $(document).ready(function() {
            const today = new Date();
            const formattedDate = today.toLocaleDateString('en-US', {
                year: 'numeric',
                month: '2-digit',
                day: '2-digit'
            });
            $('#hiddenDateField').val(formattedDate);
        });
    </script>
</body>
</html>

Kode HTML jeung JavaScript ieu nunjukkeun kumaha ngagunakeun jQuery pikeun prepopulate widang input disumputkeun jeung titimangsa kiwari, formatna salaku mm / dd / yyyy, tanpa nol ngarah. Hayu urang ngarecahna step by step:

  1. <!DOCTYPE html> jeung <html>: Ieu mangrupikeun deklarasi dokumén HTML standar anu nunjukkeun yén ieu mangrupikeun dokumen HTML5.
  2. <head>: Bagian ieu dianggo pikeun ngalebetkeun metadata sareng sumber pikeun halaman wéb.
  3. <title>: Nyetél judul halaman wéb ka "Prepopulasi Tanggal nganggo jQuery sareng Objék Tanggal JavaScript."
  4. <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>: Garis ieu ngawengku perpustakaan jQuery ku nangtukeun sumber na tina jaringan pangiriman eusi (CDN). Éta mastikeun yén perpustakaan jQuery sayogi dianggo dina halaman wéb.
  5. <body>: Ieu wewengkon eusi utama kaca web dimana anjeun nempatkeun eusi katempo jeung elemen panganteur pamaké.
  6. <form>: Unsur formulir HTML dipaké pikeun ngandung widang input. Dina hal ieu, éta dipaké pikeun encapsulate widang input disumputkeun.
  7. <input type="hidden" id="hiddenDateField" name="hiddenDateField">: Widang input disumputkeun anu moal katingali dina halaman wéb. Éta ditugaskeun ID "hiddenDateField" sareng nami "hiddenDateField."
  8. <script>: Ieu mangrupikeun tag pambuka pikeun blok skrip JavaScript dimana anjeun tiasa nyerat kode JavaScript.
  9. $(document).ready(function() { ... });: Ieu blok kode jQuery. Éta ngagunakeun $(document).ready() fungsi pikeun mastikeun yén kode ngandung ngajalankeun sanggeus kaca geus pinuh dimuat. Dina fungsi ieu:
    • const today = new Date(); nyiptakeun anyar Date objék anu ngagambarkeun tanggal sareng waktos ayeuna.
    • const formattedDate = today.toLocaleDateString('en-US', { ... }); format tanggal kana string jeung format nu dipikahoyong (mm/dd/yyyy) ngagunakeun toLocaleDateString Metoda.
  10. $('#hiddenDateField').val(formattedDate); milih widang input disumputkeun jeung ID "hiddenDateField" maké jQuery tur nyetel na value ka tanggal formatna. Ieu éféktif prepopulates widang disumputkeun jeung tanggal dinten ieu dina format dieusian.

Kode jQuery simplifies prosés milih jeung ngaropéa widang input disumputkeun dibandingkeun JavaScript murni. Nalika kaca dimuat, widang input disumputkeun dieusian ku tanggal dinten ieu dina format mm/dd/yyyy, tur euweuh nol ngarah hadir, sakumaha dieusian dina formattedDate variabel.

Douglas Karr

Douglas Karr nyaeta CMO tina OpenINSIGHTS jeung pangadeg nu Martech Zone. Douglas geus mantuan puluhan startups MarTech suksés, geus mantuan dina karajinan alatan leuwih $ 5 bil dina akuisisi jeung Investasi Martech, sarta terus mantuan pausahaan dina ngalaksanakeun jeung ngajadikeun otomatis jualan na strategi marketing maranéhanana. Douglas mangrupikeun transformasi digital anu diakui sacara internasional sareng ahli MarTech sareng spiker. Douglas ogé panulis anu diterbitkeun tina pituduh Dummie sareng buku kapamimpinan bisnis.

Artikel nu patali

Deui tombol luhur
deukeut

Adblock Dideteksi

Martech Zone tiasa masihan anjeun eusi ieu tanpa biaya sabab kami ngamonetisasi situs kami ngalangkungan pendapatan iklan, tautan afiliasi, sareng sponsor. Kami bakal ngahargaan upami anjeun ngahapus pameungpeuk iklan anjeun nalika anjeun ningali situs kami.