اختيار من قائمة مرتبطة بقائمة اخرى

afnan • منذ 7 سنوات

السلام عليكم ،

انا عندي قائمتين مرتبطات ببعض، وابي انه المستخدم اذا اختار من القائمة الاولى راح يطلع له خيارات في القائمة الثانية بناء على ما اختاره،

واذا كان الخيار مو موجود بالقائمة يستطيع اضافة الخيار اللي يبي،

مثلا انا عندي قائمة باسماء الدول وعندي قائمة باسماء المدن ،

فانا هنا اريد امكانية اضافة دولة جديدة وايضا تحديد المدينه التي داخله فيها،

ايضا اريد امكانية اضافة مدينة جديدة فمثلا لو اخترت السعودية وكانت تحتوي على الدمام الرياض بريدة، استطيع اضافة جدة مثلا ،

وشكرا .

وهذا الكود المستخدم

<?xml version="1.0" encoding="UTF-8"?> 
<!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" xml:lang="en" lang="en"> 
  <head> 
    <meta http-equiv="content-type" content="text/xhtml; charset=utf-8" /> 
    <title>Dynamic Select Statements</title> 
<script type="text/javascript">
 //<![CDATA[ 
 // array of possible countries in the same order as they appear in the country selection list 
 var countryLists = new Array(4) 
 countryLists["empty"] = ["Select a Country"]; 
 countryLists["North America"] = ["Canada", "United States", "Mexico"]; 
 countryLists["South America"] = ["Brazil", "Argentina", "Chile", "Ecuador"]; 
 countryLists["Asia"] = ["Russia", "China", "Japan"]; 
 countryLists["Europe"]= ["Britain", "France", "Spain", "Germany"]; 
 /* CountryChange() is called from the onchange event of a select element. 
 * param selectObj - the select object which fired the on change event. 
 */ 
 function countryChange(selectObj) { 
 // get the index of the selected option 
 var idx = selectObj.selectedIndex; 
 // get the value of the selected option 
 var which = selectObj.options[idx].value; 
 // use the selected option value to retrieve the list of items from the countryLists array 
 cList = countryLists[which]; 
 // get the country select element via its known id 
 var cSelect = document.getElementById("country"); 
 // remove the current options from the country select 
 var len=cSelect.options.length; 
 while (cSelect.options.length > 0) { 
 cSelect.remove(0); 
 } 
 var newOption; 
 // create new options 
 for (var i=0; i<cList.length; i++) { 
 newOption = document.createElement("option"); 
 newOption.value = cList[i];  // assumes option string and value are the same 
 newOption.text=cList[i]; 
 // add the new option 
 try { 
 cSelect.add(newOption);  // this will fail in DOM browsers but is needed for IE 
 } 
 catch (e) { 
 cSelect.appendChild(newOption); 
 } 
 } 
 } 
//]]>
</script>
</head>
<body>
  <noscript>This page requires JavaScript be available and enabled to function properly</noscript>
  <h1>Dynamic Select Statements</h1>
  <label for="continent">Select Continent</label>
  <select id="continent" onchange="countryChange(this);">
    <option value="empty">Select a Continent</option>
    <option value="North America">North America</option>
    <option value="South America">South America</option>
    <option value="Asia">Asia</option>
    <option value="Europe">Europe</option>
  </select>
  <br/>
  <label for="country">Select a country</label>
  <select id="country">
    <option value="0">Select a country</option>
  </select>
</body>
 </html>

كلمات دليلية:

أعجبني السؤال تابع السؤال شارك السؤال

ساعد بالإجابة

"إن في قضاء حوائج الناس لذة لا يَعرفها إلا من جربها، فافعل الخير مهما استصغرته فإنك لا تدري أي حسنة تدخلك الجنة."

الإجابات (6)

afnan • منذ 7 سنوات


echo json_encode($cities);

ممكن يكون هنا المشكله لابد من إستراجاع الشكل json من هذه الصيغه لصيغة mysql

للاسف انا لا أعرف اتعامل مع هذه الحاله وبحثت كثيرا لان لم اجد السبب

Ali Majrashi • منذ 7 سنوات

عدلت على ملف add.php ليقوم باضافة دولة او مدينة جديدة او حتى اختيار من القائمة وتنفيذ استعلام لجلب بيانات مخزنة بجدول آخر ولكن لست من محبي هذا النوع من العمل حيث عملية الاضافة لاينبغي لها ان تكون بنفس الملف الذي يقوم بعرض البيانات للمستخدم ليسهل صيانة وتطوير الكود بالمستقبل وحاولت ابسط العمل قدر المستطاع ليسهل فهمه ووضعت ملاحظات لكل سطر لفهمه بشكل ممتاز


<?php

// Config for database connection
$username = 'root';
$password = 'root';
$db = '3alampro-help';

$country = $_POST['country'];
$city = $_POST['city'];

// Check connection
try {
    $pdo = new PDO ('mysql:host=localhost;dbname=' . $db, $username, $password); 
    $pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
} catch (PDOException $e) {
    echo $e->getMessage();
    die();
}

if (isset($_POST['new-country']) and !empty($_POST['new-country'])) {
	// query to add new country to DB
	// prepare sql and bind parameters
    $stmt = $pdo->prepare("INSERT INTO countries (name) VALUES (:name)");
    $stmt->bindParam(':name', $name);

    // insert a row
    $name = $_POST['new-country'];
    $stmt->execute();
    $country = $pdo->lastInsertId();
}

if (!empty($country) and !empty($_POST['new-city'])) {
	// query to add new city to DB
	// prepare sql and bind parameters
	$stmt = $pdo->prepare("INSERT INTO cities (name, country_id) VALUES (:name, :country_id)");
    $stmt->bindParam(':name', $name);
    $stmt->bindParam(':country_id', $country_id);

    // insert a row
    $name = $_POST['new-city'];
    $country_id = $country;
    $stmt->execute();
    $city = $pdo->lastInsertId();
}

if (!empty($country) and !empty($city)) {
    //Build our query
    $sql = "SELECT * FROM `DataTable` WHERE `country_id` = :country AND `city_id` = :city";

    //Prepare our SELECT statement.
    $statement = $pdo->prepare($sql);
     
    //Bind our value to the paramater :make.
    $statement->bindValue(':country', $country);
    $statement->bindValue(':city', $city);
     
    //Execute our statement.
    $statement->execute();
     
    //Fetch our rows. Array (empty if no rows). False on failure.
    $rows = $statement->fetchAll(PDO::FETCH_ASSOC);

} else {
    //Build our query
    $sql = "SELECT * FROM `DataTable` WHERE `country_id` = :country";

    //Prepare our SELECT statement.
    $statement = $pdo->prepare($sql);
     
    //Bind our value to the paramater :make.
    $statement->bindValue(':country', $country);
     
    //Execute our statement.
    $statement->execute();
     
    //Fetch our rows. Array (empty if no rows). False on failure.
    $rows = $statement->fetchAll(PDO::FETCH_ASSOC);
}

foreach($rows as $row){
    echo $row['title'] . '<br>';
}

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

afnan • منذ 7 سنوات

هنا هل أسوي عمودين جدد في جدول البيانات country id , city id

لانه القيم المرجعه من القائمة هي ارقام فقط ! حسب ما فهمت

Ali Majrashi • منذ 7 سنوات

داخل جدول DataTable لابد من عمل حقلين واحد يخزن فيه country id والثاني يخزن فيه city id وهو الافضل لربط الدوله والمدينه باي record مخزن داخل هذا الجدول

afnan • منذ 7 سنوات

شكرا لك ضبط معي الحل الاخير لكن فيه مشكله لم أحلها وهي في هذه الحالة ؟


if (!empty($new-country) and!empty($_POST['new-country'])and !empty($_POST['new-city'])) {
	
    // query to add new country to DB
	// prepare sql and bind parameters
    $stmt = $pdo->prepare("INSERT INTO countries (name) VALUES (:name)");
    $stmt->bindParam(':name', $name);

    // insert a row
    $name = $_POST['new-country'];
    $stmt->execute();
    $country = $pdo->lastInsertId();

  // query to add new city to DB
	// prepare sql and bind parameters
	$stmt = $pdo->prepare("INSERT INTO cities (name, country_id) VALUES (:name, :country_id)");
    $stmt->bindParam(':name', $name);
    $stmt->bindParam(':country_id', $country_id);

    // insert a row
    $name = $_POST['new-city'];
    $country_id =  $country;
    $stmt->execute();
    $city = $pdo->lastInsertId();
}

Ali Majrashi • منذ 7 سنوات

ممكن المشكلة ايش بالظبط خطأ او شي معين يواجهك؟

لايوجد لديك حساب في عالم البرمجة؟

تحب تنضم لعالم البرمجة؟ وتنشئ عالمك الخاص، تنشر المقالات، الدورات، تشارك المبرمجين وتساعد الآخرين، اشترك الآن بخطوات يسيرة !

اشترك الآن