Как автоматически выбрать текущую дату в форме ввода со следующим кодом - PullRequest
Новая
       16

Как автоматически выбрать текущую дату в форме ввода со следующим кодом

0 голосов
/ 04 января 2019

Я пытаюсь использовать этот предыдущий код в менеджере бронирования отелей, чтобы выбрать текущую дату (день, месяц, год) в форме ввода. Я встраиваю код в блок HTML-кода прямо на моей веб-странице через конструктор перетаскивания веб-сайтов (Webflow).

И я также хотел бы, чтобы дату отъезда автоматически выбирали через семь дней после текущей даты.

Я нашел, что это самый близкий ответ к тому, что я искал, Установить текущую дату в списках выбора форм , но не знал, как реализовать это в моем рассматриваемом коде.

Любая помощь будет принята с благодарностью.

Вот код, который я использую: 

    <form action="https://...." method="POST" name="SearchForm">
<table>
    <tbody>
    <tr>
        <td>
            <span>Arrival:</span>
        </td>
        <td>
            <select name="CIM" size="1">
                <!-- CIM = CheckInMonth -->
                    <option value="1" selected>Jan</option>
                    <option value="2" >Feb</option>
                    <option value="3" >Mar</option>
                    <option value="4" >Apr</option>
                    <option value="5" >May</option>
                    <option value="6" >Jun</option>
                    <option value="7" >Jul</option>
                    <option value="8" >Aug</option>
                    <option value="9" >Sep</option>
                    <option value="10" >Oct</option>
                    <option value="11" >Nov</option>
                    <option value="12" >Dec</option>
            </select>
        </td>
        <td>
            <select name="CID" size="1">
                <!-- CID = CheckInDay -->
                    <option value="1" >1</option>
                    <option value="2" >2</option>
                    <option value="3" >3</option>
                    <option value="4" selected>4</option>
                    <option value="5" >5</option>
                    <option value="6" >6</option>
                    <option value="7" >7</option>
                    <option value="8" >8</option>
                    <option value="9" >9</option>
                    <option value="10" >10</option>
                    <option value="11" >11</option>
                    <option value="12" >12</option>
                    <option value="13" >13</option>
                    <option value="14" >14</option>
                    <option value="15" >15</option>
                    <option value="16" >16</option>
                    <option value="17" >17</option>
                    <option value="18" >18</option>
                    <option value="19" >19</option>
                    <option value="20" >20</option>
                    <option value="21" >21</option>
                    <option value="22" >22</option>
                    <option value="23" >23</option>
                    <option value="24" >24</option>
                    <option value="25" >25</option>
                    <option value="26" >26</option>
                    <option value="27" >27</option>
                    <option value="28" >28</option>
                    <option value="29" >29</option>
                    <option value="30" >30</option>
                    <option value="31" >31</option>
            </select>
        </td>
        <td>
            <select name="CIY" size="1">
                <!-- CIY = CheckInYear -->
                    <option value="2019" selected>2019</option>
                    <option value="2020" >2020</option>
                    <option value="2021" >2021</option>
            </select>
        </td>
        <td>
            <span>Departure:</span>
        </td>
        <td>
            <select name="COM" size="1">
                <!-- COM = CheckOutMonth -->
                    <option value="1">Jan</option>
                    <option value="2">Feb</option>
                    <option value="3">Mar</option>
                    <option value="4">Apr</option>
                    <option value="5">May</option>
                    <option value="6">Jun</option>
                    <option value="7">Jul</option>
                    <option value="8">Aug</option>
                    <option value="9">Sep</option>
                    <option value="10">Oct</option>
                    <option value="11">Nov</option>
                    <option value="12">Dec</option>
            </select>
        </td>
        <td>
            <select name="COD" size="1">
                <!-- COD = CheckOutDay -->
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                    <option value="4">4</option>
                    <option value="5">5</option>
                    <option value="6">6</option>
                    <option value="7">7</option>
                    <option value="8">8</option>
                    <option value="9">9</option>
                    <option value="10">10</option>
                    <option value="11">11</option>
                    <option value="12">12</option>
                    <option value="13">13</option>
                    <option value="14">14</option>
                    <option value="15">15</option>
                    <option value="16">16</option>
                    <option value="17">17</option>
                    <option value="18">18</option>
                    <option value="19">19</option>
                    <option value="20">20</option>
                    <option value="21">21</option>
                    <option value="22">22</option>
                    <option value="23">23</option>
                    <option value="24">24</option>
                    <option value="25">25</option>
                    <option value="26">26</option>
                    <option value="27">27</option>
                    <option value="28">28</option>
                    <option value="29">29</option>
                    <option value="30">30</option>
                    <option value="31">31</option>
            </select>
        </td>
        <td>
            <select name="COY" size="1">
                <!-- COY = CheckOutYear -->
                    <option value="2019">2019</option>
                    <option value="2020">2020</option>
                    <option value="2021">2021</option>
            </select>
        </td>
        <td>

...

1 Ответ

0 голосов
/ 04 января 2019

Надеюсь, это поможет вам.

Исходная часть вашего HTML будет выглядеть следующим образом. Просто добавьте соответствующий идентификатор для выбора тега. 

 <td>
        <span>Departure:</span>
    </td>
    <td>
        <select name="COM" size="1" id="departureMonth">
            <!-- COM = CheckOutMonth -->
                <option value="1">Jan</option>
                <option value="2">Feb</option>
                <option value="3">Mar</option>
                <option value="4">Apr</option>
                <option value="5">May</option>
                <option value="6">Jun</option>
                <option value="7">Jul</option>
                <option value="8">Aug</option>
                <option value="9">Sep</option>
                <option value="10">Oct</option>
                <option value="11">Nov</option>
                <option value="12">Dec</option>
        </select>
    </td>
    <td>
        <select name="COD" size="1" id="departureDay">
            <!-- COD = CheckOutDay -->
                <option value="1">1</option>
                <option value="2">2</option>
                <option value="3">3</option>
                <option value="4">4</option>
                <option value="5">5</option>
                <option value="6">6</option>
                <option value="7">7</option>
                <option value="8">8</option>
                <option value="9">9</option>
                <option value="10">10</option>
                <option value="11">11</option>
                <option value="12">12</option>
                <option value="13">13</option>
                <option value="14">14</option>
                <option value="15">15</option>
                <option value="16">16</option>
                <option value="17">17</option>
                <option value="18">18</option>
                <option value="19">19</option>
                <option value="20">20</option>
                <option value="21">21</option>
                <option value="22">22</option>
                <option value="23">23</option>
                <option value="24">24</option>
                <option value="25">25</option>
                <option value="26">26</option>
                <option value="27">27</option>
                <option value="28">28</option>
                <option value="29">29</option>
                <option value="30">30</option>
                <option value="31">31</option>
        </select>
    </td>
    <td>
        <select name="COY" size="1" id="departureYear">
            <!-- COY = CheckOutYear -->
                <option value="2019">2019</option>
                <option value="2020">2020</option>
                <option value="2021">2021</option>
        </select>
    </td>


и добавьте этот код javascript + jquery. 

var departureDate = new Date();
departureDate.setDate(departureDate.getDate()+7);

$("#departureYear").val(departureDate.getFullYear());
$("#departureMonth").val(departureDate.getMonth());
$("#departureDay").val(departureDate.getDate());
...