I have two calendars in HTML that when you click on two dates, it shows the days between the two dates. This works perfectly for me since I just used jQuery code I found online, but the people I will be handing this HTML file to do not have any access to the links of my source code. They also don't have any access to any local shared drive where I can download the scripts and save it there.
Is there any way for me to directly add jQuery codes to the HTML file itself so that the people who will be using it will not need access to anything to use it properly? Sorry, I am only learning HTML/jQuery as I'm doing it and cannot find any solutions to my problem.
I already tried downloading the flies of the source codes to a share drive, it works perfectly but others do not have access to it. They are not allowed to save anything on their own desktops either.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment-with-locales.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="http://cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/a549aa8780dbda16f6cff545aeabc3d71073911e/src/js/bootstrap-datetimepicker.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>
<link href="http://cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/a549aa8780dbda16f6cff545aeabc3d71073911e/build/css/bootstrap-datetimepicker.css" rel="stylesheet"/>
<label>DATE TODAY:</label>
<div class="input-group date" id="initialDate">
<input type='text' name="initialDate" class="form-control" />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
<label>EXPECTED DATE:</label>
<div class='input-group date' id='finalDate'>
<input type='text' name="finalDate" class="form-control" />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
<br><label>Days between: </label> <span id="days"></span>
function CalculateDayends() {
var initialDate = $("#initialDate").data('date');
var finalDate = $("#finalDate").data('date');
var diff = Math.floor((Date.parse(initialDate)- Date.parse(finalDate)) / 86400000);
$("#days").text(diff);
}
$("#finalDate").on('dp.change', function() {
CalculateDayends();
});
$('#initialDate').datetimepicker({
format: 'YYYY-MM-DD'
});
$('#finalDate').datetimepicker({
format: 'YYYY-MM-DD'
});
<script>tag?<script>tags in your<head>, above another external<script>to a JavaScript page you create, making sure that you pay attention to their asynchronous loading functions, like jQuery's$(function(){ /* put your code in here - perhaps another asynchronous function for another library nested within here - keep nesting since they're asynchronous */})..jsfile & reference it in code. You can also call functions from this external.jsfile. Refer to my answer here roughly how to start (I know the functional JQuery content is different, but the start indicates how to reference an external.js. file): stackoverflow.com/a/57915381/11700321