جدول بيانات قابل للتعديل باستخدام جوجل شيت وأب سكريبت

تُعَدُّ جداول البيانات أداة مهمة لتخزين ومعالجة البيانات، وتوفر واجهة سهلة للتحرير والتحديث. يعد استخدام JavaScript مع Google Sheets وApp Script أحد الحلول الفعالة لإنشاء جداول بيانات قابلة للتحرير عبر الإنترنت. في هذا المقال، سنستعرض كيفية إنشاء جدول بيانات يمكن تحريره باستخدام Google Sheets وApp Script، بالإضافة إلى كيفية تحديث البيانات في الوقت الفعلي.

تحديث بيانات جدول البيانات في الوقت الفعلي

تعتبر القدرة على تحديث البيانات في الوقت الفعلي من الميزات الرئيسية التي ينشدها المستخدمون. إذا كان لديك جدول بيانات يتكون من أعمدة متعددة من A إلى Q، ولكنك تريد فقط تحرير بعض الأعمدة، يمكنك تحقيق ذلك بفضل Google Apps Script. يمكنك إعداد الوظيفة getDataTable() لجلب البيانات من جدول البيانات، وتوزيع أعمدة البيانات التي ترغب في عرضها وتعديلها في واجهة HTML.

إليك كيف يبدو الكود الأساسي لجلب البيانات:

function getDataTable() {
  var spreadSheetId = "معرف جدول البيانات"; //تغيير
  var dataRange = "SampleRange!A3:Q"; // تغيير
  var range = Sheets.Spreadsheets.Values.get(spreadSheetId, dataRange);
  var values = range.values;
  return values;
}

تحرير البيانات باستخدام HTML

لبناء واجهة تحرير البيانات، يمكن استخدام HTML وJavaScript لإنشاء نموذج يعرض البيانات المستخرجة من جدول البيانات. سيكون لديك جدول يتيح للمستخدم تعديل البيانات مباشرة في الصفحة. باستخدام تقنيات AJAX، يمكنك إرسال التغييرات إلى Google Sheets بمجرد أن يجري المستخدم تعديلات على المحتوى.

تستطيع استخدام مكتبة مثل jQuery لتسهيل هذا الأمر. هنا مثال على كيفية إرسال البيانات المعدلة:

function updateData(row, column, value) {
  var spreadSheetId = "معرف جدول البيانات"; //تغيير
  var range = 'SampleRange!A' + row + ':Q' + row; //تغيير
  var values = [[value]]; // القيم الجديدة
  var resource = { values: values };
  Sheets.Spreadsheets.Values.update(resource, spreadSheetId, range, { valueInputOption: 'RAW' });
}

تحديث الصفحة تلقائيًا

لجعل العملية أكثر فاعلية، قد ترغب في إضافة ميزة تحديث الصفحة التلقائي. يمكن استخدام وظيفة setInterval في JavaScript لإعادة تحميل البيانات كل ثانيتين. يتيح لك ذلك الاطلاع على أحدث التحديثات في البيانات التي تتم في Google Sheets، مما يجعل تجربة المستخدم أكثر سلاسة.

setInterval(function(){
  // استدعاء الوظيفة لجلب البيانات
  getDataTable();
}, 2000); // كل ثانيتين

كيفية ربط كل شيء معًا

عند ربط الكود مع البنية الأساسية لتطبيقك على الويب، يجب التأكد من أن جميع الأجزاء متوافقة مع بعضها. يتضمن ذلك تأكيد إعداد Google Sheets وApp Script بشكل صحيح، وكذلك التأكد من أن كل العمليات تعمل بسلاسة.

عند الانتهاء من هذا المشروع، ستكون قد أنشأت جداول بيانات قابلة للتحرير باستخدام JavaScript وGoogle Sheets وApp Script، وهو حل مبتكر وفعال يستفيد من الإمكانيات المتقدمة المتاحة في هذه الأدوات.

خاتمة

في الختام، يمكنك رؤية كيف يمكن استخدام JavaScript وGoogle Sheets وApp Script لإنشاء جدول بيانات قابل للتحرير وتحديثه في الوقت الفعلي. هذه الأمور تفتح بابًا واسعًا للابتكار وجعل البيانات أكثر تفاعلية. سواء كنت تستخدمه لأغراض تجارية أو شخصية، فإن هذه الطريقة تقدم حلاً مثاليًا لتسهيل إدارة البيانات.

إن تقنيات JavaScript المستخدمة في هذا السياق لا تقتصر فقط على إنشاء واجهات تفاعلية، بل توفر أيضاً حلاً فعّالاً للتعامل مع البيانات بشكل ديناميكي. يمكنك بدء مشروعك الخاص اليوم واستكشاف هذه الإمكانيات الواسعة.