اعرض القائمة صفحةً صفحة

الهدف

اعرض جدولًا عشرين صفًّا في كل مرة، ودَع الناس يبحثون فيه، وضع تحته السابق والتالي يعرفان متى يتوقّفان.

لماذا هذا موجود

القائمة المرسومة تُحمِّل ما تطلبه منها. اطلب كل شيء فيصلك جدول من تسعمئة صف في استجابة واحدة يتمرّر بلا نهاية؛ اطلب عشرين فلا شيء على الشاشة يستطيع أن يقول أهذه العشرون آخر عشرين أم أول عشرين من تسعمئة.

فنما الاستعلام بشيئين: صفحة (skip)، ومكان لـالعدّ (countInto).

استعلام واحد يفعل ذلك كلّه

loadRecords("par_case", "cases", {
  top: num(getState("pageSize")),
  skip: getState("page") * num(getState("pageSize")),
  contains: { par_name: getState("query") },
  orderBy: "par_name",
  countInto: "caseTotal"
});

num(…) موجودة لأنّ حجم الصفحة يأتي من قائمة منسدلة، وكل عنصر تحكّم يعرض خيارًا يعيد الكلمات لا الرقم — انظر «حجم الصفحة» أدناه.

الجزء	المعنى
top	كم صفًّا تحمل هذه الصفحة
skip	كم صفًّا يتخطّى أوّلًا — صفوف لا صفحات
where	أزواج حقل/قيمة يجب أن تتطابق تمامًا، كلّها معًا
contains	أزواج حقل/جزء نص — ما يحتاجه صندوق البحث
orderBy / descending	الترتيب
countInto	حقل حالة لـعدد الصفوف المطابقة كلّها، بصرف النظر عن الصفحة

skip صفوف لا رقم صفحة، لأن top صفوف أصلًا. الشاشة التي تحمل الاثنين عليها أن تُبقيهما متّسقين، وفشل ذلك صامت: يغيّر أحدهم حجم الصفحة، وينسى تصفير رقمها، فيقع على الصفحة ٧ من قائمة صار لها ٣ صفحات.

القيمة الفارغة في contains لا تضيف شرطًا، فيمكنك تمرير صندوق البحث كما هو. صندوق لم يكتب فيه أحد شيئًا يعني كل شيء، لا الصفوف التي تحتوي النص الفارغ.

countInto مجّاني. استعلام المنصة يعدّ على أي حال، فطلب العدّ لا يكلّف طلبًا ثانيًا. والشاشة التي لا زرّ تالٍ فيها تتركه ولا تدفع شيئًا.

الخطوات

1. أعلِن الحالة التي تحتاجها القائمة: cases ([])، وcaseTotal (0)، وpage (0)، وpageSize ("20" — قيمة القائمة المنسدلة نفسها، فهي كلمات)، وquery ("").

2. ضع الاستعلام أعلاه في معالج التحميل للشاشة.

3. ارسم السابق والتالي، واربط التفعيل فيهما:

   • السابق — state.page > 0
   • التالي — (state.page + 1) * num(state.pageSize) < state.caseTotal

4. معالجاهما ينقلان الصفحة ويعيدان تشغيل الاستعلام:

   setState("page", getState("page") + 1);
   loadRecords( … الاستعلام نفسه … );

5. ارسم النص. لا يمكن جمع رقم مع جملة مباشرة — يرفض BS Lang خلط نص برقم ويقول Only number or string — فلُفّه:

   "Showing " + text(state.cases.length()) + " of " + text(state.caseTotal)

6. ارسم صندوق البحث صندوق نص مربوطًا بـstate.query، وأعطه معالج تغيير يعود إلى الصفحة صفر ويعيد تشغيل الاستعلام. صندوق النص يُثبِّت قيمته حين تتركه أو تضغط Enter، فهذا استعلام لكل بحث لا لكل حرف.

حجم الصفحة

قائمة منسدلة واحدة، في الطرف المقابل من الصف، تعرض ١٠ و٢٠ و٣٠ و٤٠ و٥٠ و١٠٠ و٢٠٠:

• ارسم صندوقًا، واجعله عنصر تحكّم قائمة منسدلة، واكتب الأحجام في قائمة خياراته.
• اربط القيمة بـstate.pageSize — مسار حالة بسيط، فيُكتب ما يختاره أحدهم قبل أن يعمل أي شيء آخر.
• أعطه معالج تغيير يصفّر الصفحة ويعيد تشغيل الاستعلام.
• ضع كلمتَي حجم الصفحة داخل الصندوق لا بجانبه. ما ترسمه داخل عنصر تحكّم يصير نصه النائب والاسم الذي ينطقه قارئ الشاشة؛ وأي عنوان أمامه يكرّر ما تقوله القائمة المغلقة أصلًا.

تعيد الكلمات لا الرقم. كل عنصر تحكّم يعرض خيارًا يفعل ذلك — فـstate.pageSize يحمل "20"، واستعماله في الحساب يحتاج num(…):

num(state.pageSize) * state.page

بدونها ترفض BS Lang هذا الجمع وتقول Only number or string، وهي القاعدة نفسها التي تجعل النص يحتاج text(…) — والاثنتان اتجاهان لتحويل واحد. وnum(…) تجيب ٠ لكل ما ليس رقمًا، فلا يستطيع منتقٍ لم يمسسه أحد أن يكسر الشاشة.

عُد دائمًا إلى الصفحة صفر حين يتغيّر شكل القائمة — حجم جديد، بحث جديد. القائمة المفلترة الباقية على الصفحة سبعة لا تعرض شيئًا، وتُقرأ كبحث معطّل.

البحث في منتقٍ

الشيء نفسه، contains، هو ما يجعل الـlookup صالحًا للاستعمال. في نموذج مكتب الدعم لبطاقة منتقي جهة الاتصال صندوق نصّ خاص بها، ومعالج تغييره يعيد تشغيل:

loadRecords("contact", "contacts", { top: 8, orderBy: "fullname",
  contains: { fullname: getState("contactQuery") } });

هذه إجابة البيئة، لا تصفية للصفوف الثمانية الموجودة في البطاقة — وهذا هو الفرق بين منتقٍ ومنتقٍ لا يجد إلا ما جلبه من قبل.

ما ليس هنا

لا يوجد أو. يأخذ contains عدّة حقول ويجمعها بـ«و»، وهذا ليس معنى البحث في ثلاثة أعمدة. البحث في أيٍّ من عدّة حقول هو حيث يكفّ المرشّح عن كونه سطرًا في معالج ويصير مصمّم الاستعلام الذي تملكه المنصة أصلًا.

حل المشكلات

• النص يقول Only number or string. — يُجمَع رقم مع جملة. لُفّه بـtext(…). والرسالة نفسها في عملية حسابية هي المشكلة المعكوسة: كلمات عنصر تحكّم تُستعمل كرقم، فلُفّها بـnum(…).
• حجم الصفحة لا يفعل شيئًا، أو تفرغ القائمة عند تغييره. — state.pageSize يحمل كلمات القائمة المنسدلة. يحتاج top وskip إلى num(…) حولها.
• التالي لا يتعطّل أبدًا. — لا شيء يكتب العدّ. أضِف countInto إلى الاستعلام.
• البحث لا يجد شيئًا بعد الصفحة الأولى. — معالج البحث لا يصفّر page.
• القائمة تعيد الاستعلام مع كل ضغطة. — المعالج على شيء يعمل مع كل حرف. ضعه على تغيير الصندوق، الذي يعمل عند تركه.

سيناريوهات ذات صلة

• اجعل الشاشة تتفاعل.
• ارسم شاشة استوديو.