Visualizzazione dei risultati da 1 a 6 su 6

Hybrid View

  1. #1

    jQuery Date Range Picker selezionare range di date e disabilitare alcune date

    Ciao, ho questo semplice codice che mi permette di selezionare un range di date e di disabilitare alcune specifiche date. Per provare il codice puoi cliccare qui.
    codice HTML:
    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>Documento senza titolo</title>
    <script type="text/javascript" src="https://cdn.jsdelivr.net/jquery/latest/jquery.min.js"></script>
    <script type="text/javascript" src="https://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js"></script>
    <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css" />
    </head>
    
    <body>
        
        <input type="text" name="daterange" id="demo" />
        
    <script>
    invalid_dates = ['2021-03-25', '2021-03-28', '2021-04-15']
    $('#demo').daterangepicker({
        isInvalidDate: function(date)
        {
          return !!(invalid_dates.indexOf(date.format('YYYY-MM-DD')) > -1);
        },
        "startDate": "03/18/2021",
        "endDate": "03/18/2021",
        "minDate": "03/18/2021",
        "maxDate": "05/31/2021"
    }, function(start, end, label) {
      console.log('New date range selected: ' + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD') + ' (predefined range: ' + label + ')');
    });
    </script>
    </body>
    </html>
    
    Vorrei fare in modo che l'utente possa selezionare solo range di date contigue. Poniamo caso, ad esempio, che il 15 aprile sia disabilitato, l'utente non deve poter selezionare il 14 ed il 16 aprile, perchè in mezzo c'è una data appunto disabilitata. Invece, come potete provare voi stessi cliccando qui, il programma lo lascia fare.

    Ho trovato questa interessante pagina https://longbill.github.io/jquery-date-range-picker/ punto 26 Disable some dates, in cui jQuery Date Range Picker funziona proprio come vorrei funzionasse io.
    Nel codice vengono però disabilitati solo i weekend, mentre io vorrei disabilitare delle date specifiche che ho racchiuso in un array. Non so come fare ...

    Grazie infinite a chiunque mi possa mettere sulla giusta strada.
    Ultima modifica di !!\Freedom9/!!; 18-03-2021 a 20:12

  2. #2
    Scusate, il post di ieri era confuso. Ho lavorato sul codice, ho fatto l'upload qui

    Devo agire sul file http://layout999.hostinggratis.it/jq...master/demo.js

    codice:
            beforeShowDay: function(t)
            {
                var valid = !(t.getDay() == 0 || t.getDay() == 6);  //disable saturday and sunday
                var _class = '';
                var _tooltip = valid ? '' : 'già prenotato';
                return [valid,_class,_tooltip];
            }
    Nel parametro valid di questa funzione vengono disabilitati i sabati e le domeniche. Dovrei modificare tale parametro per fare in modo che ad essere disabilitati siano non i sabati e le domeniche ma dei giorni specifici, contenuti in un array. Non so come fare, in javascript sono un somaro.

    Se qualcuno mi può aiutare posso contraccambiare con lavoretti in php.

    Grazie ancora

  3. #3
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,674
    Ciao, in base a quanto hai postato nel primo post chiariamo subito che si tratta di due plugin differenti.
    Inizialmente hai usato Date Range Picker di Dan Grossman mentre quella "interessante pagina" espone gli esempi per configurare jQuery Date Range Picker di Chunlong Liu, che poi hai usato nel tuo ultimo upload.

    Chiaramente i due plugin funzionano in modo differente anche se alcune configurazioni possono essere similari. Col primo plugin non ho trovato un modo semplice per fare ciò che stai chiedendo; se usi invece il secondo plugin (di Chunlong) penso sia più semplice, ora provo e ti aggiorno più tardi.
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

  4. #4
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,674
    Prova a modificare così questa riga:
    codice:
    var valid = !(invalid_dates.indexOf(moment(t).format('YYYY-MM-DD')) > -1)
    Chiaramente l'array invalid_dates puoi dichiararlo a livello globale, come hai fatto inizialmente.

    Fai sapere.
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

  5. #5
    Quote Originariamente inviata da KillerWorm Visualizza il messaggio
    Prova a modificare così questa riga:
    codice:
    var valid = !(invalid_dates.indexOf(moment(t).format('YYYY-MM-DD')) > -1)
    Chiaramente l'array invalid_dates puoi dichiararlo a livello globale, come hai fatto inizialmente.

    Fai sapere.
    Funziona benissimo, grazie infinite KillerWorm!!
    Tra i due script utilizzerò jQuery Date Range Picker di Chunlong Liu. Mi occorre per un piccolo b&b di sole due camere che covid permettendo avvierò alla fine dell'anno con un amico.
    Nei prossimi mesi affinerò il plugin per adattarlo alle mie esigenze ed a quelle di tutti coloro che lo vogliono utilizzare per gestire un sistema di booking di una struttura ricettiva.
    Una delle cose che modificherò nel breve è l'etichetta con il numero di giorni che compare dopo che viene fatta una selezione. Vedrò di far comparire anzichè il numero di giorni il numero di notti.

    Se qualcuno è interessato ad sviluppare in questo senso il plugin assieme a me, benvenuto a bordo!!

  6. #6
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,674
    Funziona benissimo
    Bene, mi fa piacere

    Se qualcuno è interessato ad sviluppare in questo senso il plugin assieme a me, benvenuto a bordo!!
    Personalmente non sono interessato ma se ritieni rendere più valida la tua proposta puoi riformularla adeguatamente, e in modo formale, nell'apposita sezione Offro lavoro/collaborazione

    Buone cose
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2024 vBulletin Solutions, Inc. All rights reserved.