عندي صفحة بي اتش بي مصمم بداخلها حقول ومن ضمنها حقين من نوع
drop down menu
السؤال هنا كيف استطيع ان اختار من
drop down menu 1
وعلى اساس هذا الاختيار يظهر لي البيانات في drop down menu 2
| |
عندي صفحة بي اتش بي مصمم بداخلها حقول ومن ضمنها حقين من نوع
drop down menu
السؤال هنا كيف استطيع ان اختار من
drop down menu 1
وعلى اساس هذا الاختيار يظهر لي البيانات في drop down menu 2
انا بديت تعلم الجافاسكربت من كم يوم يعني خبرتي قليلة مو ذاك الزود لكن بحاول
-------
اعتقد في القائمة الأولى تحط فيها onchange دالة وفيها قيمة الإختيار اللي إختاره
مثلا :
كود:القائمة الأولى <select onchange="changeMenu(this.value)"> <option value="tatweer">تطوير المواقع</option> <option value="montada">تطوير المنتديات</option> </select>يعني لما يتغير راح دخل قيمة ال value اللي من الإختيارات (tatweer او montada)كود:onchange="changeMenu(this.value)"
-----
أما القائمة الثانية التي تبي تغيرها لازم انك تحط لها id بأي اسم كالتالي
في هالمثال استخدم اسم DROPTWO تقدر تغيرها فيما بعدكود:القائمة الثانية <select id="DROPTWO"> </select>
---
يعني الآن لما تتغير القائمة الأولى راح تبدي الدالة changeMenu اللي كالتالي :
أول خطوة يشوف أي قيمة رجعت له (أي قائمة إختار) هل هي tatweer أم montada (راجع الكود الأول)كود:function changeMenu(myValue) { if (myValue == 'tatweer') { menu = document.getElementById('DROPTWO'); menu.innerHTML = '<option>مكتبة السكربتات</option><option>قسم الدروس</option>'; } else if (myValue == 'montada') { menu = document.getElementById('DROPTWO'); menu.innerHTML = '<option>مكتبة الهاكات</option><option>مكتبة الستايلات</option>'; } }
إذا كان tatweer :
أول خطوة :
متغير جديد باسم menu ويستخدم الدالة getElementById وداخلها اسم ال id للقائمة اللي تبي تغيرها (يمكن استخدامه لأي غرض ليس فقط القوائم)كود:menu = document.getElementById('DROPTWO');
ثاني خطوة :
كما هو واضح يغير كود الداخلي (innerHTML) للقائمة menu (المتغير اللي حددناه قبله) إلى الكود اللي تبيه وهو القوائم، تقدر تزيد وتعدل فيها كما شئتكود:menu.innerHTML = '<option>مكتبة السكربتات</option><option>قسم الدروس</option>';
نفس الخطوات إذا كانت القيمة montada وتقدر تزيد في القوائم كما تريد
آسف أعتقد اني طولت لكن أحببت اني احط الطريقة مع الشرح لكرهي لعملية (أخذ وحط)
وآسف ان كنت قصرت فمازلت في اولى ايامي مع الجافاسكريبت :shy:
وهذا الكود كامل (لمعرفة ترتيب الأكواد)
كود:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <script type="text/javascript"> function changeMenu(myValue) { if (myValue == 'tatweer') { menu = document.getElementById('DROPTWO'); menu.innerHTML = '<option>مكتبة السكربتات</option><option>قسم الدروس</option>'; } else if (myValue == 'montada') { menu = document.getElementById('DROPTWO'); menu.innerHTML = '<option>مكتبة الهاكات</option><option>مكتبة الستايلات</option>'; } } </script> <title>myTitle<title> </head> <body> القائمة الأولى <select onchange="changeMenu(this.value)"> <option value="tatweer">تطوير المواقع</option> <option value="montada">تطوير المنتديات</option> </select> <br /><br /> القائمة الثانية <select id="DROPTWO"> </select> </body> </html>
انت
يا اخ fnan4arab
بالعكس ما قدمته ليس بالشي الهين الله يعطيك العافيه
thank u
سأجرب وارد عليك
ضوابط المشاركة
رد مع اقتباس
