مطلوب مساعدتكم في الأجاكس

[Php student]

السلام عليكم
اخواني بغيت مساعدتكم بشغله كنت محتاج اسويها بالأجاكس
يمكن تكون واضحه لكم من الصورة التالية

عندي تشيك بوكس ابي عند تحديده يظهر سيليكت وعند ازالة التحديد عنه يختفي السيليكت

يعني الصفحة مافيها الا تشيك بوكس واذا حدد تظهر قائمه منسدله واذا ألغى التحديد تختفي القائمة المنسدله
انا حاولت اعدل والخبط بمثال للأخ دكتور نت
لكن ماوصلت لطريقه سليمه لعدم فهمي الكود :shy:
وهذا اللي انا جربته
في الرئيسية :

<script language="javascript" type="text/javascript" src="javaScript.js"></script>
<input type=checkbox name=check value="yes" onclick=show(); ><div id=showithere> &nbsp;</div>

في javaScript.js :

 var http_request = false; 

   function show() { 
       if (window.XMLHttpRequest) { // Mozilla, Safari,... 
           http_request = new XMLHttpRequest(); 
       } else if (window.ActiveXObject) { // IE 
           http_request = new ActiveXObject("Microsoft.XMLHTTP"); 
       } 
	   var theUsername = document.getElementById('check').value;
       http_request.onreadystatechange = alertContents; 
       http_request.open('POST', 'ajax.php'); 
       http_request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
       http_request.send("check="+theUsername); 

   } 

   function alertContents() { 

       if (http_request.readyState == 4) { 
           if (http_request.status == 200) { 
               document.getElementById('showithere').innerHTML = http_request.responseText;
           } else { 
                document.getElementById('showithere').innerHTML ='There was a problem with the request.'; 
           } 
       } 

   }

وفي صفحة ajax.php :

<?php
		if($check == 'yes'){
			echo '<select name=match><option>الفريق الاول</option><option>الفريق الثاني</option></select>';
}
?>

بانتظار ردودكم أخواني ما أنحرم منكم
تحياتي

[jadweb.com]

حل اخر

<!--Example drop down menu 1-->

<form name="form1">
<select name="select1" size="1" style="background-color:#FFFFD7" onChange="displaydesc(document.form1.select1, thetext1, 'textcontainer1')">
<option selected value="http://www.javascriptkit.com">JavaScript Kit </option>
<option value="http://freewarejava.com">Freewarejava.com</option>
<option value="http://wired.com" target="newwin">Wired News</option>
<option value="http://www.news.com">News.com</option>
<option value="http://www.codingforums.com" target="newwin">Coding Forums</option>
</select>
 <input type="button" value="Go" 
onClick="jumptolink(document.form1.select1)"><br>
<span id="textcontainer1" align="left" style="font:italic 13px Arial">
</span>
</form>

<!--Example drop down menu 2-->

<form name="form2">
<select name="select2" size="1" style="background-color:#E3FFDF" onChange="displaydesc(document.form2.select2, thetext2, 'textcontainer2')">
<option selected value="http://www.cnn.com">CNN</option>
<option value="http://www.msnbc.com">MSNBC</option>
<option value="http://news.bbc.co.uk">BBC News</option>
<option value="http://www.theregister.com/">The Register</option>
</select>
 <input type="button" value="Go" 
onClick="jumptolink(document.form2.select2)"><br>
<span id="textcontainer2" align="left" style="font:italic 13px Arial">
</span>
</form>



<!--IMPORTANT: Below script should always follow all of your HTML codes above, and never proceed them-->
<!--To be safe, just add below script at the end of your page-->

<script type="text/javascript">


//1) CUSTOMIZE TEXT DESCRIPTIONS FOR LINKS ABOVE
var thetext1=new Array()
thetext1[0]="Comprehensive JavaScript tutorials and over 400+ free scripts"
thetext1[1]="Direct link to hundreds of free Java applets online!"
thetext1[2]="Up to date news on the technology front"
thetext1[3]="News.com- The #1 technology News site."
thetext1[4]="Web Coding and development forums"

/// You may define additional text arrays if you have multiple drop downs:
var thetext2=new Array()
thetext2[0]="CNN- US and World News."
thetext2[1]="MSNBC- NBC News online."
thetext2[2]="BBC News- Updated every minute of every day."
thetext2[3]="TheRegister- Daily IT news."

// Now, see 2) below for final customization step

function displaydesc(which, descriptionarray, container){
if (document.getElementById)
document.getElementById(container).innerHTML=descriptionarray[which.selectedIndex]
}

function jumptolink(what){
var selectedopt=what.options[what.selectedIndex]
if (document.getElementById && selectedopt.getAttribute("target")=="newwin")
window.open(selectedopt.value)
else
window.location=selectedopt.value
}

//2) Call function displaydesc() for each drop down menu you have on the page
//   This function displays the initial description for the selected menu item
//   displaydesc(name of select menu, name of corresponding text array, ID of SPAN container tag):
//   Important: Remove the calls not in use (ie: 2nd line below if there's only 1 menu on your page)

displaydesc(document.form1.select1, thetext1, 'textcontainer1')
displaydesc(document.form2.select2, thetext2, 'textcontainer2')

</script>

في الـــ <BODY>

اعلم ان الكود مختلف ولكن من الممكن ان تجعلة يتوافق مع طلبك بكل سهولة.

[Php student]

شكراً لك اخوي
ماقصرت مثال حلو وإذا ما استفدت من حاليا راح استفيد منه لـ فهم الأجاكس أكثر
لكن الان ما اضن اني اقدر استخدمه بنفس الفكره اللي ابي
لاحظ انه التغيير من <select> انا ابي احط checkbox وبدال النص تظهر السيليكت

ممكن اقدر اسويها ويصير عند تحديد الـ checkbox يظهر السيليكت ولكن اذا ازلت التحديد عنه ماتختفي السيليكت تبقى موجوده !!

كيف اصحح هالنقطه على اساس تشتغل بشكل سليم
بانتظار ردك اخي الكريم

[Php student]