للقيام بإضافة البيانات التي تم استرجاعها من طلب Ajax إلى مصفوفة تسمى locations
بنفس التنسيق المطلوب، يمكنك استخدام دالة push
لإضافة كل نقطة جديدة إلى المصفوفة. في كل دورة each
من البيانات التي تم استرجاعها، ستقوم بإنشاء مصفوفة جديدة تحتوي على اسم الموقع وإحداثياته الجغرافية، ثم تضيف هذه المصفوفة إلى locations
باستخدام push
. الأمر يبدو مثل هذا:
javascript$.ajax({
url: '../get-route/46',
type: 'get',
success: function (data) {
$.each(data.poi, function(key, element) {
var newLocation = [element.name, element.latitud, element.longitud];
locations.push(newLocation);
});
console.log(locations); // للتحقق من البيانات المضافة بشكل صحيح
}
});
هذا الكود يقوم بإضافة كل عنصر من البيانات المسترجعة إلى المصفوفة locations
بتنسيق مماثل لتلك الموجودة بالفعل فيها. بعد الانتهاء من التكرار، يتم طباعة locations
في وحدة التحكم للتحقق من أن البيانات قد تمت إضافتها بشكل صحيح.
المزيد من المعلومات
بالطبع، يمكننا توسيع الشرح لإضافة مزيد من المعلومات والتفاصيل حول كيفية تنفيذ هذا العمل بشكل أكثر تفصيلاً.
عند استدعاء الدالة $.ajax()
، يتم إرسال طلب HTTP GET إلى العنوان URL المحدد في خاصية url
، والذي يبدو أنه ../get-route/46
. يتوقع السيرفر استلام هذا الطلب ويجيب بالبيانات المطلوبة في صيغة معينة، على الأرجح JSON.
عندما يتم استلام البيانات بنجاح، يتم تنفيذ الدالة success
التي تحتوي على الكود المكتوب داخلها. في هذه الحالة، يتم استخدام $.each()
لتكرار كل عنصر في المصفوفة data.poi
التي تحتوي على بيانات نقاط الاهتمام.
في كل تكرار، يتم استخلاص معلومات كل نقطة من الاهتمام، مثل اسمها وإحداثياتها الجغرافية، ثم يتم إنشاء مصفوفة جديدة تحتوي على هذه المعلومات. بعد ذلك، يتم استخدام الدالة push()
لإضافة هذه المصفوفة الجديدة إلى المصفوفة locations
الموجودة بالفعل.
بمجرد الانتهاء من جميع التكرارات، يتم طباعة المصفوفة locations
في وحدة التحكم باستخدام console.log()
للتحقق من أن البيانات تمت إضافتها بشكل صحيح.
هذا النوع من الاقتران بين استجابات Ajax ومعالجتها وتنظيمها داخل هياكل البيانات المحلية مثل المصفوفات يُستخدم بشكل شائع لتحديث واجهات المستخدم بناءً على البيانات الديناميكية التي تم استرجاعها من الخادم.