Take bank dates , and "Highlight them" in a Jquery Calendar

Asked

Viewed 1,223 times

0

I have a code with two dates that will mark something, such as a week event for example, one is the start date of the event and the other the end date of this event, to facilitate the user view I want to put these two dates in a calendar (Datepicker)but I have no idea how to show the start and end date in my calendar, have to do this?

Here he is taking the dates and displaying them in table together with some other values 

 <?php
                include 'phpfiles/connect.php';

                $sql = "SELECT Campanha, DATE_FORMAT( Data_inicio, '%d/%m/%Y' ) AS Data_inicio, DATE_FORMAT( Data_fim, '%d/%m/%Y' ) AS Data_fim, Thumbnail, Descricao FROM walldata limit 0,10";
                $result = $con->query($sql);

                if ($result->num_rows > 0) {
                    while ($row = mysqli_fetch_assoc($result)) {
                        ?>
                        <tbody>       
                            <tr>
                                <td><?= $row['Campanha'] ?></td>
                                <td><?= $row['Data_inicio'] ?></td>
                                <td><?= $row['Data_fim'] ?></td>
                                <td><?= $row['Thumbnail'] ?></td>
                                <td>
                                    <a class="btn btn-primary btn-sm" href="phpfiles/edit.php?Campanha=<?= $row['Campanha'] ?>">Edit</a>
                                    <a class="btn btn-danger btn-sm" href="phpfiles/Delete.php?Campanha=<?= $row['Campanha'] ?>" onclick="return confirm('Tem certeza que deseja deletar esse registro?');">Delete</a>
                                </td>

                            </tr>
                        </tbody>
                        <?php
                    }
                }
                ?>
And here ta calendar( I got from the internet because I do not know very well js)Da to see the selected days, this is how I wanted it to stay, it’s as if the date 1 was the day 1 and two was the day 4, understood?inserir a descrição da imagem aqui 
<html>
    <head>
        <meta charset="utf-8" />
        <title>Calendário jQuery</title>   

<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.0/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script src="http://code.jquery.com/ui/1.9.0/jquery-ui.js"></script>

<script>
$(function() {
    $("#calendario").datepicker({
        dateFormat: 'dd/mm/yy',
        dayNames: ['Domingo','Segunda','Terça','Quarta','Quinta','Sexta','Sábado','Domingo'],
        dayNamesMin: ['D','S','T','Q','Q','S','S','D'],
        dayNamesShort: ['Dom','Seg','Ter','Qua','Qui','Sex','Sáb','Dom'],
        monthNames: ['Janeiro','Fevereiro','Março','Abril','Maio','Junho','Julho','Agosto','Setembro','Outubro','Novembro','Dezembro'],
        monthNamesShort: ['Jan','Fev','Mar','Abr','Mai','Jun','Jul','Ago','Set','Out','Nov','Dez']
    });
});
</script>
    </head>
    <body>
        <p>Data: <input type="text" id="calendario" /></p>
    </body>
</html>

php javascript jquery mysql-workbench

  • I am currently using datepicker that picks the date of the pc, da de pegar a dos valores do banco?

  • But you just want the user to select the dates that are in the start and end date range or you want to leave those dates only highlighted ?

  • In fact, he has a record that he will register the event and the duration, these data will be stored in the database, then I want to display in a calendar, the start date and the end date, several at the same time, Worry about validating equal dates at different events I’ll arrange that later.

  • @Lucaoa Only display dates that are already in the comic book

1 answer

1


For these cases I use the Datepicker Range, as you already use the Datepicker I believe you will not have any problem.

Here has a prettier version of him.

  • This will help in fact, but it would be possible to leave the calendar always the type view without having to select the dates, and also put several different dates that mark other events in the same calendar?

  • 1

    To make it always visible just call it on a div <div id="datepicker"></div>. To load the calendar with a selected date you can set in the declaration a "defaultDate". However, if you need to select more than one date (other than a range), you can test the Multidatespicker.

  • But wouldn’t you do it just to display the dates, don’t need to change, I just want to display? :D

  • I get it, you just want to show the scheduled days. Then you could declare Multidatespicker already with the pre-selected dates and use jQuery to mark it as Readonly.

Browser other questions tagged php javascript jquery mysql-workbench

You are not signed in. Login or sign up in order to post.