完整日历插件 - 单击日期输入



工作更新:

我正在使用完整的日历jQuery插件,但是我无法弄清楚如何进行单击日期并将其设置为输入值。

单击日期上的警报非常完美,但是当我想移至事件或输入字段时,它不起作用。这是代码:

$(document).ready(function() {
        $('#bootstrapModalFullCalendar').fullCalendar({
            lang: 'hr',
            displayEventTime: false,
            dayClick: function(date, jsEvent, view) {
                var datum = date.format();
                alert(datum);
            },
            header: {
                left: '',
                center: 'prev title next',
                right: ''
            },
            eventClick:  function(event, jsEvent, view) {
                $('#modalTitle').html(event.title);
                $('#modalBody').html(event.description);
                $('#datum').html(moment(event.start._d).format("YYYY-MM-DD"));
                $('#fullCalModal').modal();
                return false;
            },
            events:
            [
               {
                  "title":"   Add data on this day",
                  "datum":"Date:"+moment(datum).format(),
                  "allday":"true",
                  "description":"<p><center><b>test..</b></center></p>",
                  "start":'06:00',
                  "end":'23:00',
                  "dow":'[1,2,3,4,5,6, 7]'
               }
            ]
        });
    });

在事件上单击它调用模态(html表单):

<div id="fullCalModal" class="modal fade">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4 id="modalTitle" class="modal-title"></h4> <!-- NASLOV -->
            </div>
            <div id="modalBody" class="modal-body"></div> <!-- OPIS  -->
        <form method="POST" name="plan" id="plan">
            <!-- POLJA ZA UNOS  -->
                <center><label for="datum">Datum:</label></center> <div id="datum" class=""></div>
                <center><input style="width:200px" autocomplete="off" style="z-index: 1;" placeholder="Datum" maxlength="100" class="form-control" type="text"  name="datum" id="datum" value="" /></center>
                <br />
                <center><label for="sifra_smjene">Šifra smjene:</label></center>
                <center><input style="width:200px" autocomplete="off" style="z-index: 1;" placeholder="Šifra smjene" maxlength="100" class="form-control" type="number"  name="sifra_smjene" id="sifra_smjene" value="" /></center>
                <br />
                <center><label for="objekt">Objekt:</label></center>
                <center><input style="width:200px" autocomplete="off" style="z-index: 1;" placeholder="Objekt" maxlength="100" class="form-control" type="number"  name="objekt" id="objekt" value="" /></center>
                <br />
                <center><label for="smjena">Smjena</label></center>
                <center><input style="width:200px" autocomplete="off" style="z-index: 1;" placeholder="Smjena" maxlength="100" class="form-control" type="number"  name="smjena" id="smjena" value="" /></center>
                <br />
        </form>
            <!-- KRAJ POLJA -->
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Odustani</button>
                <button class="btn btn-success font" type="submit">Spremi</button>
            </div>
        </div>
    </div>
</div>

我正在单击日期:未定义/无效日期。我想念什么吗?

尝试将JS更改为

$(document).ready(function() {
  var datum;
        $('#bootstrapModalFullCalendar').fullCalendar({
            lang: 'hr',
            displayEventTime: false,
            dayClick: function(date, jsEvent, view) {
                datum = date.format();
                alert(datum);
            },
            header: {
                left: '',
                center: 'prev title next',
                right: ''
            },
            eventClick:  function(event, jsEvent, view) {
                $('#modalTitle').html(event.title);
                $('#modalBody').html(event.description);
                $('#datum').html(event.datum);
                $('#fullCalModal').modal();
                return false;
            },
            events:
            [
               {
                  "title":"   Add data on this day",
                  "datum":"Date:"+moment(datum).format(),
                  "allday":"true",
                  "description":"<p><center><b>test..</b></center></p>",
                  "start":'06:00',
                  "end":'23:00'
               }
            ]
        });
    });

您很可能会获取undefined,因为您在函数内声明了变量,因此它在其外部无法访问。将其声明为外部的空变量,然后更改内部的值。

相关内容

  • 没有找到相关文章