wählen startdate enddate Datumsbereich Highlight jquery ui picker

ich den folgenden Code haben mit ich weiß nicht, wie die ausgewählten Daten zu markieren, und wie mein Code für ausgewählte Termine css hinzufügenwählen startdate enddate Datumsbereich Highlight jquery ui picker

hier.

<script src="//code.jquery.com/jquery-1.10.2.js"></script> 
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> 
<script> 

    $(function() { 
    $("#from").datepicker({    
     dateFormat: 'dd/mm/yy', 
     numberOfMonths: 2, 
     autoclose: true, 
     minDate:0, 

     onClose: function(selectedDate) { 
     $("#to").datepicker("option", "minDate", selectedDate); 
     $("#to").datepicker("show"); 
     } 
    }); 
    $("#to").datepicker({    
     dateFormat: 'dd/mm/yy', 
     numberOfMonths: 2, 
     minDate:0, 
     autoclose: true, 


    }); 

    }); 
</script> 


</head> 
<body> 

    <label for="from">From</label> 
    <input type="text" id="from" name="from" value="19/04/2016"> 
    <label for="to">to</label> 
    <input type="text" id="to" name="to" value="29/04/2016">

Ich brauche das Highlight wie das Bild unten

Bitte helfen Sie mir, wie zu markieren. Danke

Quelle

2016-04-18 Robin Bronston

Wenn ich dies richtig gelesen habe, wenn ein "# from" -Datum und ein '# to'Datum ausgewählt sind, möchten Sie etwas markieren. Was genau möchten Sie hervorheben? – Twisty

Ich möchte das Datum zwischen Startdatum und Enddatum hervorheben (addClass -> background color.). Bitte überprüfen Sie meine angehängte Bildschirmsortierung. Vielen Dank –

Ja, ich habe das Problem behoben, jetzt funktioniert es.

beforeShowDay: function(date){ 
var startDate = $('#reportFrom').val(); 
var endDate = $('#reportTo').val(); 
startDate = startDate.split('/'); 
endDate = endDate.split('/'); 
startDate = new Date(startDate[2], (startDate[1]-1), startDate[0]); 
endDate = new Date(endDate[2], (endDate[1]-1), endDate[0]); 

if ($.trim(startDate) != '' && $.trim(endDate) !='') { 
    if(($.trim(startDate) == $.trim(date)) && ($.trim(endDate) == $.trim(date))) { 
    return [true, 'dp-highlight dp-end-highlight dp-start-highlight']; 
    } 
    if($.trim(startDate) == $.trim(date)) { 
    return [true, 'dp-highlight dp-start-highlight']; 
    } 
    if(date < endDate && date > startDate) { 
    return [true, 'dp-highlight']; 
    } 
    if($.trim(endDate) == $.trim(date)) { 
    return [true, 'dp-highlight dp-end-highlight']; 
    } 

    return [true, '']; 
} 
}

Quelle

2016-04-19 06:48:35

wählen startdate enddate Datumsbereich Highlight jquery ui picker

Antwort

Verwandte Themen