Hi,
I'm trying to use jquery datepicker and the result I want is to select a date from it and display the data take from a mysql database referred to the datapicker date .
I don't have a precise idea if is better an iframe or a div content load (which I think is preferred). Unlikely my javascript (ajax) skill in very low
regards
if needed i will try to explain better what I want to do
I'm sorry for my bad english
Ugo
- <!DOCTYPE html>
<html lang="it">
<head>
<meta charset="utf-8" />
<!-- Html 5 e CSS3 -->
<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame Remove this if you use the .htaccess -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<title>Ugo Internet server - dati storici</title>
<meta name="description" content="Sito internet di Ugo Merlini - dati storici"/>
<meta name="author" content="Ugo Merlini"/>
<meta name="viewport" content="width=device-width; initial-scale=1.0"/>
<!-- Styles -->
<link rel="stylesheet" type="text/css" href="../../../file_comuni/javascript/jquery_ui/css/jquery-ui.css"/>
<!-- Jquery javascript -->
<script type="text/javascript" src="../../../file_comuni/javascript/jquery/jquery-1.8.2.js"></script>
<!-- Jquery-ui javascript -->
<script type="text/javascript" src="../../../file_comuni/javascript/jquery_ui/jquery-ui-1.9.0.js"></script>
<script type="text/javascript">
$(function() {
$( "#tab_dati_storici_principale" ).tabs();
});
</script>
<script>
$(function() {
var opzioni_calendario_giornaliero = ({
dateFormat: 'dd/mm/yy',
maxDate: "+10",
showOn: "button",
buttonImage: "../../../file_comuni/javascript/jquery_ui/css/images/calendar.gif",
buttonImageOnly: true,
prevText: "Ieri",
currentText: "Oggi",
monthNames: ["Gennaio","Febbraio","Marzo","Aprile","Maggio","Giugno","Luglio",'Agosto',"Settembre","Ottobre","Novembre","Dicembre"],
monthNamesShort: ["Gen","Feb","Mar","Apr","Mag","Giu","Lug","Ago","Set","Ott","Nov","Dic"],
dayNames: ["Domenica","Lunedí","Martedí","Mercoledí","Giovedí","Venerdí","Sabato"],
dayNamesShort: ['Dom','Lun','Mar','Mer;','Gio','Ven','Sab'],
dayNamesMin: ["Do","Lu","Ma","Me","Gi","Ve","Sa"],
altField : "#calendario_giornaliero_alternativo",
altFormat : "@",
});
$("#calendario_giornaliero").datepicker(opzioni_calendario_giornaliero);
});
</script>
<script type="text/javascript">
$(document).ready(function() {
$("#box_dati_storici_giornalieri").hide();
});
</script>
<script type="text/javascript">
function showDiv() {
div = document.getElementById('box_dati_storici_giornalieri');
div.style.display = "block";
}
</script>
</head>
<body>
<section>
<div id="tab_dati_storici_principale">
<ul>
<li><a href="#tab-1">Dati giornalieri</a></li>
<li><a href="#tab-2">Dati mensili</a></li>
<li><a href="#tab-3">Dati ammuali</a></li>
<li><a href="#tab-4">Eventi significativi</a></li>
</ul>
<div id="tab-1">
<input type="text" name="datepicker" id="calendario_giornaliero">
<input type="text" name="alt-datepicker" id="calendario_giornaliero_alternativo">
<button onclick="javascript:showDiv();">Click to show div</button>
<div id="box_dati_storici_giornalieri">
<p>Provae</p>
</div>
</div>
<div id="tab-2">
<p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Done</p>
</div>
</div>
</section>
</body>
</html>