استعمال كوكل شيت API

Roger Iraq · 15 يناير

السلام عليكم اخوتي

احتاج مثال تفصيلي لخزن معلومات موظفين في كوكل شيت بحيث يصبح كقاعدة بيانات

ثم اعمل واجهة ادخال بيانات فورم لكل موظف بحيث يضيف الى معلوماته في الكوكل شيت الخاص بجميع الموظفين

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

ثم كل ذلك ينشر داخل surge.sh

وشكرا اتمنى الحصول على تفاصيل كاملة من الالف للياء

Hikmat Jaafer · 16 يناير

وعليكم السلام ,

لتتمكن من فعل ذلك , أنت بحاجة إلى Google Sheet Api , ومعرفة في لغات html css Js و JQuery .

كخطوات عامة:

أولاً , يجب عليك بناء قالب جديد في google sheet وإنشاء ورقة جديدة , مع إضافة الأعمدة التي تريدها ( مثل الاسم , العمر , راتب الموظف, الوظيفة ... الخ ).

ثانياً , يجب عليك بناء فورم إدخال موظف باستخدام html وcss و js و jquery. وأستعمال google sheet api لتتمكن من إضافة بيانات الى الورقة التي قمت بإنشاءها , وأيضاً أضاف حقل البحث , كما في المثال التالي :

Html File

<!DOCTYPE html>
<html>
<head>
  <title>add employee example</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
  <script src="script.js"></script>
</head>
<body>
  <h2>add new employee</h2>
  <form id="employeeForm">
    <label for="name">name:</label>
    <input type="text" id="name" name="name" required><br>

    <label for="age">age:</label>
    <input type="number" id="age" name="age" required><br>

    <label for="job">job:</label>
    <input type="text" id="job" name="job" required><br>

    <label for="salary">sal:</label>
    <input type="number" id="salary" name="salary" required><br>

    <input type="submit" value="add">
  </form>

  <h2>search</h2>
  <input type="text" id="search" placeholder="search for an employee"><br>
  <button id="searchButton">search</button>

  <div id="results"></div>
</body>
</html>

ملف Js

$(document).ready(function() {
  const sheetId = 'YOUR_GOOGLE_SHEET_ID'; 
  const sheetName = 'Sheet1';
  
  $('#employeeForm').submit(function(e) {
    e.preventDefault();

    const name = $('#name').val();
    const age = $('#age').val();
    const job = $('#job').val();
    const salary = $('#salary').val();

    const url = `https://script.google.com/macros/s/GOOGLE-SHEET-KEY/exec?id=${sheetId}&sheet=${sheetName}&name=${name}&age=${age}&job=${job}&salary=${salary}`;

    $.get(url, function(data) {
      alert('add success!');
    });
  });

  $('#searchButton').click(function() {
    const searchTerm = $('#search').val();
    const url = `https://script.google.com/macros/s/GOOGLE-SHEET-KEY/exec?id=${sheetId}&sheet=${sheetName}&search=${searchTerm}`;

    $.get(url, function(data) {
      $('#results').html(data);
    });
  });
});

لاحظ أنني قمت بتعريف sheetId وهو id الخاص ب google sheet لديك , وتعريف sheetName وهي اسم الورقة الخاص بك .
أيضاً لاحظ طريقة استخدام google sheet api , وكيف نمرر sheet id و sheet name , وباقي الحقول .

استعمال كوكل شيت API

السؤال

Roger Iraq

رابط هذا التعليق

شارك على الشبكات الإجتماعية

1 جواب على هذا السؤال

Recommended Posts

Hikmat Jaafer

رابط هذا التعليق

شارك على الشبكات الإجتماعية

انضم إلى النقاش

إعلانات

تابعنا على

الرئيسية

تابعنا

دروس ومقالات

أسئلة وأجوبة

كتب

دورات

بطاقات هدية