5
Answers

expaned calender

can any one tell me how to show ur calender in full screen for example like this http://www.asp-dev.com/diary/default.asp?cat=all 
 
does i need to put certain style.i have write certain code in order to make this ,but calender is small size.
 
please do let me know if u need my code etc etc
 
Thanks
 
so far i neeed to chaneg this code in order to get desired output
 
 

 
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Calender2.aspx.vb" Inherits="Calender2" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>

<script type="text/javascript" src="Scripts/jquery-1.4.1.min.js"></script>
<script type="text/javascript" src="Scripts/jquery.autocomplete.js"></script>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>


<script type="text/javascript" src="http://jqueryui.com/js/jquery.js"></script>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>


<script type="text/javascript" src="jquery/jquery.datepick.js"></script>



<script type="text/javascript">
//var myArray = new Date();
var myArray = [];



$(document).ready(function() {
$('#datepicker').datepicker({ beforeShowDay: highlightEvents, onSelect: showEvent, onChangeMonthYear: showEventsFromMonth });
// $("#datepicker").datepicker();
$.ajax({
type: "GET",
url: "Events.xml",
dataType: "xml",
success: parseXml


});

function highlightEvents(date) {

var isEventDate = false;

for (var i = 0; i < myArray.length; i++) {
if (myArray[i].getTime() == date.getTime()) {
isEventDate = true;
break;
}
}
return [isEventDate, (isEventDate ? 'event' : '')];
}



});
function parseXml(xml) {

var count = 0;
$(xml).find("Events").each(function() {

var Date1 = $(this).find('Date').text() + " ";
$("#output").append(Date1);
var EventName = $(this).find('Name').text() + " ";
$("#output").append(EventName);


myArray.push($.datepicker.parseDate('yy/m/d', Date1));
// myArray.push($.datepicker.parseDate('yy/m/d', Date1));
$("#output").append("<BR>" + " ");

count++;
});
$('#datepicker').datepicker('refresh');

}
function showEventsFromMonth() {

}
function showEvent(dateStr) {
$("Show").append("sdsdsdsdsd");
}


</script> 
<script type="text/javascript">
function getDropDownList1Value() {
var SelectedVal = $('#< %=<strong>ddlMonth.ClientID %>').val();
return SelectedVal;
}
</script>


</head>
<body style="font-size:93.5%;">
<form id="form1" runat="server">
<div id="output">
<div id="datepicker"></div>
<div id="Show"></div>
</div>
<asp:DropDownList ID="ddlMonth" runat="server" AutoPostBack="True">
</asp:DropDownList>
<asp:DropDownList ID="ddlYear" runat="server" AutoPostBack="True">
</asp:DropDownList>
<asp:Button ID="Button1" runat="server" Text="GO !!" />
</form>

</body>
</html>

 
 

Answers (5)