استفسار عن الطريقة الأفضل لفلترة قيم متعلقة بأخرى في جافاسكربت

بتاريخ 10 ساعات قال عبدالله غازي:

السلام عليكم ، انا عندي مشروع اسويه بال json مطلوب مني اني انشاء قاعده بيانات محلية وهميه عبارة عن مصفوفة من الكائنات ، وايضا مطلوب ايضا عندما يقوم العميل بادخال اسم المدينه يعرض له الحيونات الموجوده في المدينه انا هذا ما استطعت فعله ولكن عندما اكتب اي شي في الحقل تظهر لي الحيونات انا سويت ملف ال JSON لكن احس انه في شي ناقص او غلط اتمنى اني قدرت اوصل المعلومه وايضا ارجو عدم حله ولكن اعطائي تلميحات او مساعده خفيفه يعني hint نفس ما نقول ههههههههههههههههههههه عشان اعتمد على نفسي في الحل وشكرا لكم على ردكم السريع والله 

project2.rar

هذا هو ال input والنتيجه مفروض تطلع في البطاقه من تحت 

كل الأمور تعمل بشكل طبيعي و صحيح غير أن العملية غير منطقية و غير حسنة من ناحية تجربة المستخدم بعض الشيء . فالعملية ليست عملية بحث و إنما فلترة بحسب المدينة لذلك لا يجدر بك استخدام حقول الإدخال من النوع نص .

خطوات عملية : 

• عوضا عن البحث عن اسم المدينة و إظهار مربع بحث عن اسم المدينة قم بعمل قائمة منسدلة بخيارات المدن المتوفرة , فالمدن محدودة من جهة . و عملية البحث ليست عليها و إنما هو فلترة بحسب المدينة . 
• بعد ذلك يمكنك ربط التغير بقيم القائمة المنسدلة بحادثة تحميل حيوانات جديدة تخص تلك المدينة دون غيرها عوضا عن تحميلها كلها أو تحميل تلك الخاصة بـ AbuDhabi مثلما تقوم بفعله .
• طبعا تحتاج إخفاء كل مربعات الحيوانات القديمة كل مرة تقوم بعملية بحث و فلترة .

طبعا هذا هو منطق العملية موصوفة فقط و تحتاج تحويل العملية إلى كود عملي يمكنك من عمل الفكرة بشكل محترف .