الفريق العربي للبرمجةأرشيف المنتديات · 2000 – 2023
نسخة أرشيفية للقراءة فقط — التسجيل والمشاركة مغلقان، والمحتوى محفوظ كما كان.

كود التقويم لا يعمل ؟؟

بدأه hanon_abha في 29 يناير 2011 · 11 رد · 933 مشاهدة · في قسم البرمجة بــ Javascript
مشاركة: واتساب X فيسبوك تيليجرام
#1 صاحب الموضوع

السلام عليكم هذا الكود لا يعمل ارجو المساعدة في ايجاد الخلل ؟؟

<html>
<head>
</head>
<body>
<script language="JavaScript">
<!--
var months = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December");
var daysInMonth = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
var days = new Array("S", "M", "T", "W", "T", "F", "S");

today = new getToday();	
var element_id;

function getDays(month, year) 
{
	// Test for leap year when February is selected.
	if (1 == month)
		return ((0 == year % 4) && (0 != (year % 100))) ||
			(0 == year % 400) ? 29 : 28;
	else
		return daysInMonth[month];
}

function getToday()
{
	// Generate today's date.
	this.now = new Date();
	this.year = this.now.getFullYear() ; // Returned year XXXX
	this.month = this.now.getMonth();
	this.day = this.now.getDate();
}


function newCalendar() 
{
	var parseYear = parseInt(document.all.year[document.all.year.selectedIndex].text);

	var newCal = new Date(parseYear , document.all.month.selectedIndex, 1);
	var day = -1;
	var startDay = newCal.getDay();
	var daily = 0; 

	today = new getToday(); // 1st call
	if ((today.year == newCal.getFullYear() ) &&   (today.month == newCal.getMonth()))
	   day = today.day;
	// Cache the calendar table's tBody section, dayList.
	var tableCal = document.all.calendar.tBodies.dayList;

	var intDaysInMonth =
	   getDays(newCal.getMonth(), newCal.getFullYear() );

	for (var intWeek = 0; intWeek < tableCal.rows.length;  intWeek++)
		   for (var intDay = 0;
			 intDay < tableCal.rows[intWeek].cells.length;
			 intDay++)
	 {
		  var cell = tableCal.rows[intWeek].cells[intDay];

		  // Start counting days.
		  if ((intDay == startDay) && (0 == daily))
			 daily = 1;

		  // Highlight the current day.
		  cell.style.color = (day == daily) ? "red" : "";
		  if(day == daily)
		  {
				document.all.todayday.innerText= "Today: " +  day + "/" + 
					(newCal.getMonth()+1) + "/" + newCal.getFullYear() ;
		  }
		  // Output the day number into the cell.
		  if ((daily > 0) && (daily <= intDaysInMonth))
			 cell.innerText = daily++;
		  else
			 cell.innerText = "";
	   }

}

	 function getTodayDay()
	 {
			    document.all[element_id].value = today.year + "-" + (today.month+1) + 
					"-" +  today.day; 
		        //document.all.calendar.style.visibility="hidden";
				document.all.calendar.style.display="none";
				document.all.year.selectedIndex =100;   
	            document.all.month.selectedIndex = today.month; 
	 }

        function getDate() 
		 {
            // This code executes when the user clicks on a day
            // in the calendar.
            if ("TD" == event.srcElement.tagName)
               // Test whether day is valid.
               if ("" != event.srcElement.innerText)
			   { 
				 var mn = document.all.month.selectedIndex+1;
    			 var Year = document.all.year [document.all.year.selectedIndex].text;
				 document.all[element_id].value=event.srcElement.innerText+"/"+mn +"/"  +Year;
		         //document.all.calendar.style.visibility="hidden";
				 document.all.calendar.style.display="none";
			 }
		 }

function GetBodyOffsetX(el_name, shift)
{
	var x;
	var y;
	x = 0;
	y = 0;

	var elem = document.all[el_name];
	do 
	{
		x += elem.offsetLeft;
		y += elem.offsetTop;
		if (elem.tagName == "BODY")
			break;
		elem = elem.offsetParent; 
	} while  (1 > 0);

	shift[0] = x;
	shift[1] = y;
	return  x;
}	

function SetCalendarOnElement(el_name)
{
	if (el_name=="") 
	el_name = element_id;
	var shift = new Array(2);
	GetBodyOffsetX(el_name, shift);
	document.all.calendar.style.pixelLeft  = shift[0]; //  - document.all.calendar.offsetLeft;
	document.all.calendar.style.pixelTop = shift[1] + 25 ;
}



function ShowCalendar(elem_name)
{
		if (elem_name=="")
		elem_name = element_id;

		element_id	= elem_name; // element_id is global variable
		newCalendar();
		SetCalendarOnElement(element_id);
		//document.all.calendar.style.visibility = "visible";
		document.all.calendar.style.display="inline";
}

function HideCalendar()
{
	//document.all.calendar.style.visibility="hidden";
	document.all.calendar.style.display="none";
}

function toggleCalendar(elem_name)
{
	//if (document.all.calendar.style.visibility == "hidden")
	if(document.all.calendar.style.display=="none")
		ShowCalendar(elem_name);
	else 
		HideCalendar();
}
-->
</script>

<style>
.today {COLOR: black; FONT-FAMILY: sans-serif; FONT-SIZE: 10pt; FONT-WEIGHT: bold}
.days {COLOR: navy; FONT-FAMILY: sans-serif; FONT-SIZE: 10pt; FONT-WEIGHT: bold; TEXT-ALIGN: center}
.dates {COLOR: black; FONT-FAMILY: sans-serif; FONT-SIZE: 10pt}
</style>


<form name=myForm>
<INPUT id=MyDate name=MyDate size=15> 
<a href="JavaScript:;" onClick="toggleCalendar('MyDate')">Calendar</a>
</form>
</body>
</html>
#2

الكود لن يعمل لإنه غير كامل. العنصر calendar الذي من المفروض أن يظهر فيه التقويم غير موجود أصلا

#3

شكرا على ردك السريع ولكني لم افهم ردك وذلك لاني جديد في الجافاسكريبت ؟؟

#4

لم أقرأ الكود جيدا، لكن واضح أنك تستعمل بعض العناصر في الكود javascript، لكنها غير موجودة في ال html

راجع المصدر الذي نسخت منه الكود، لأن الكود ناقص

#6 
 <!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled 1</title>
<script language="JavaScript">
<!--
var months = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December");
var daysInMonth = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
var days = new Array("S", "M", "T", "W", "T", "F", "S");

today = new getToday(); 
var element_id;

function getDays(month, year) 
{
 // Test for leap year when February is selected.
 if (1 == month)
  return ((0 == year % 4) && (0 != (year % 100))) ||
   (0 == year % 400) ? 29 : 28;
 else
  return daysInMonth[month];
}

function getToday()
{
 // Generate today's date.
 this.now = new Date();
 this.year = this.now.getFullYear() ; // Returned year XXXX
 this.month = this.now.getMonth();
 this.day = this.now.getDate();
}


function newCalendar() 
{
 var parseYear = parseInt(document.all.year  [document.all.year.selectedIndex].text);

 var newCal = new Date(parseYear , document.all.month.selectedIndex, 1);
 var day = -1;
 var startDay = newCal.getDay();
 var daily = 0; 

 today = new getToday(); // 1st call
 if ((today.year == newCal.getFullYear() ) &&   (today.month == newCal.getMonth()))
	day = today.day;
 // Cache the calendar table's tBody section, dayList.
 var tableCal = document.all.calendar.tBodies.dayList;

 var intDaysInMonth =
	getDays(newCal.getMonth(), newCal.getFullYear() );

 for (var intWeek = 0; intWeek < tableCal.rows.length;  intWeek++)
 	for (var intDay = 0;
	intDay < tableCal.rows[intWeek].cells.length;
	intDay++)
  {
	var cell = tableCal.rows[intWeek].cells[intDay];

	// Start counting days.
	if ((intDay == startDay) && (0 == daily))
	daily = 1;

	// Highlight the current day.
	cell.style.color = (day == daily) ? "red" : "";
	if(day == daily)
	{
    document.all.todayday.innerText= "Today: " +  day + "/" + 
     (newCal.getMonth()+1) + "/" + newCal.getFullYear() ;
	}
	// Output the day number into the cell.
	if ((daily > 0) && (daily <= intDaysInMonth))
	cell.innerText = daily++;
	else
	cell.innerText = "";
	}

}

  function getTodayDay()
  {
   	document.all[element_id].value = today.day + "/" + (today.month+1) + 
     "/" + today.year; 
      	//document.all.calendar.style.visibility="hidden";
    document.all.calendar.style.display="none";
    document.all.year.selectedIndex =100;   
         	document.all.month.selectedIndex = today.month; 
  }

    	function getDate() 
   {
        	// This code executes when the user clicks on a day
        	// in the calendar.
        	if ("TD" == event.srcElement.tagName)
           	// Test whether day is valid.
           	if ("" != event.srcElement.innerText)
  	{ 
 	var mn = document.all.month.selectedIndex+1;
		var Year = document.all.year [document.all.year.selectedIndex].text;
 	document.all[element_id].value=event.srcElement.innerText+"/"+mn +"/"  +Year;
       	//document.all.calendar.style.visibility="hidden";
 	document.all.calendar.style.display="none";
	}
   }

function GetBodyOffsetX(el_name, shift)
{
 var x;
 var y;
 x = 0;
 y = 0;

 var elem = document.all[el_name];
 do 
 {
  x += elem.offsetLeft;
  y += elem.offsetTop;
  if (elem.tagName == "BODY")
   break;
  elem = elem.offsetParent; 
 } while  (1 > 0);

 shift[0] = x;
 shift[1] = y;
 return  x;
} 

function SetCalendarOnElement(el_name)
{
 if (el_name=="") 
 el_name = element_id;
 var shift = new Array(2);
 GetBodyOffsetX(el_name, shift);
 document.all.calendar.style.pixelLeft  = shift[0]; //  - document.all.calendar.offsetLeft;
 document.all.calendar.style.pixelTop = shift[1] + 25 ;
}



function ShowCalendar(elem_name)
{
  if (elem_name=="")
  elem_name = element_id;

  element_id = elem_name; // element_id is global variable
  newCalendar();
  SetCalendarOnElement(element_id);
  //document.all.calendar.style.visibility = "visible";
  document.all.calendar.style.display="inline";
}

function HideCalendar()
{
 //document.all.calendar.style.visibility="hidden";
 document.all.calendar.style.display="none";
}

function toggleCalendar(elem_name)
{
 //if (document.all.calendar.style.visibility == "hidden")
 if(document.all.calendar.style.display=="none")
  ShowCalendar(elem_name);
 else 
  HideCalendar();
}
-->
</script>

<style type="text/css">
.today {COLOR: black; FONT-FAMILY: sans-serif; FONT-SIZE: 10pt; FONT-WEIGHT: bold}
.days {COLOR: navy; FONT-FAMILY: sans-serif; FONT-SIZE: 10pt; FONT-WEIGHT: bold; TEXT-ALIGN: center}
.dates {COLOR: black; FONT-FAMILY: sans-serif; FONT-SIZE: 10pt}
</style>


</head>

<body>



<FORM name=myForm>
<INPUT id=MyDate name=MyDate size=15> 
<a href="JavaScript:;" onClick="toggleCalendar('MyDate')">Calendar</a>
</form>











<TABLE bgColor=#ffffff border=1 cellPadding=0 cellSpacing=3 id=calendar style="DISPLAY: none; POSITION: absolute; Z-INDEX: 4">
  <TBODY>
  <TR>
	<TD colSpan=7 vAlign=center>
 <!-- Month combo box -->
 <SELECT id=month onchange=newCalendar()> 
	 <script language=JavaScript>
  // Output months into the document.
  // Select current month.
  for (var intLoop = 0; intLoop < months.length; intLoop++)
   document.write("<OPTION " + (today.month == intLoop ? "Selected" : "") + ">" + months[intLoop]);
  </SCRIPT>
 </SELECT> 
 <!-- Year combo box -->
 <SELECT id=year onchange=newCalendar()> 
    	<script language=JavaScript>
  // Output years into the document.
  // Select current year.
  for (var intLoop = 1900; intLoop < 2028; intLoop++)
   document.write("<OPTION " + (today.year == intLoop ? "Selected" : "") + ">" + intLoop);
  </SCRIPT>
 </SELECT> 

 </TD>
  </TR>



  <TR class=days>
 <!-- Generate column for each day. -->
	<script language=JavaScript>
 // Output days.
 for (var intLoop = 0; intLoop < days.length; intLoop++)
  document.write("<TD>" + days[intLoop] + "</TD>");
 </SCRIPT>
  </TR>


  <TBODY class=dates id=dayList onclick="getDate('')" vAlign=center>
  <!-- Generate grid for individual days. -->
  <script language=JavaScript>
 for (var intWeeks = 0; intWeeks < 6; intWeeks++)
 {
  document.write("<TR>");
  for (var intDays = 0; intDays < days.length; intDays++)
   document.write("<TD></TD>");
  document.write("</TR>");
 }
  </SCRIPT>

  <!-- Generate today day. --></TBODY>
  <TBODY>
  <TR>
	<TD class=today colSpan=5 id=todayday onclick=getTodayDay()></TD>
	<TD align=right colSpan=2><A href="javascript:HideCalendar();"><SPAN style="COLOR: black; FONT-SIZE: 10px"><B>Hide</B></SPAN></A></TD>
  </TR>
  </TBODY>

</TABLE>



</body>

</html>

يبدو انك نسخت فقط 

<FORM name=myForm>
<INPUT id=MyDate name=MyDate size=15> 
<a href="JavaScript:;" onClick="toggleCalendar('MyDate')">Calendar</a>
</form>
1

In bad state

#7

لك الشكر الجزيل يا سيدي ولكن هناك مشكلة بسيطة وهي اني اريد التاريخ يظهر بالشكل 30/01/2011

#8 
 
    	function getDate() 
   {
        	// This code executes when the user clicks on a day
        	// in the calendar.
        	if ("TD" == event.srcElement.tagName)
           	// Test whether day is valid.
           	if ("" != event.srcElement.innerText)
  	{ 
 	var mn = document.all.month.selectedIndex+1;
		var Year = document.all.year [document.all.year.selectedIndex].text;
 	document.all[element_id].value=Year +"/"+mn+"/"+event.srcElement.innerText;
       	//document.all.calendar.style.visibility="hidden";
 	document.all.calendar.style.display="none";
	}
   }

In bad state

#9

اشكرك على المساعدة لم يظهر بهذا الشكل 30/01/2011 بل ظهر بهذا الشكل 30/1/2011

#10

يا اخوان ارجو المساعدة التقويم يظهر بهذا الشكل 30/1/2011 وانا اريده يظهر بهذا الشكل 30/01/2011 ..

تسليم مشروعي يوم غد ولم يتبقى الا هذه المشكلة فارجو المساعدة

#11

غير الدالة getDate بالكود التالي

function getDate()
{
	// This code executes when the user clicks on a day
	// in the calendar.
	if ("TD" == event.srcElement.tagName)
	// Test whether day is valid.
		if ("" != event.srcElement.innerText)
	{
		var day = event.srcElement.innerText;
		if (day < 10) day = "0"+day;
		var mn = document.all.month.selectedIndex+1;
		if (mn < 10) mn = "0"+mn;
		var Year = document.all.year [document.all.year.selectedIndex].text;
		document.all[element_id].value=day+"/"+mn +"/"  +Year;
		//document.all.calendar.style.visibility="hidden";
		document.all.calendar.style.display="none";
	}
}
#12

الف شكر

مواضيع مشابهة