دکمه‌های ویرایش CMS را با PHP و MySQL مرتبط کنید

شرایط و هدف

شما به یک دسترسی توسعه‌دهنده به CMS bluetronix و صفحه نمونه از آموزش PHP و MySQL نیاز دارید. این آموزش یک رکورد را از جدول MySQL می‌خواند و محتوای آن را از طریق $LayoutHTML در وب‌سایت به نمایش می‌گذارد.

اکنون این رکورد را با دکمه ویرایش مرتبط می‌کنیم. در تصاویر نشان‌داده‌شده، نام جدول Test است و رکورد نمایش‌داده‌شده دارای ID 1 است. ابتدا اسکریپت PHP را تکمیل کنید و سپس کد HTML صفحه نمونه خود را ویرایش کنید.

1. اسکریپت PHP: خواندن رکورد و شناسه

به بخش کد PHP در صفحه نمونه خود بروید. از اسکریپت زیر به عنوان یک مثال کامل SELECT استفاده کنید. اتصال پایگاه داده موجود $mysqli و متغیر CMS $LayoutHTML در دسترس هستند. به تگ‌های PHP اضافی نیاز ندارید.

$ID = 1; // Beispiel: der Datensatz, der auf dieser Seite angezeigt wird

//---- SELECT ----
$stmt = $mysqli->prepare("SELECT ID, `Date`, Title, Description, Image FROM Test WHERE ID = ?");
$stmt->bind_param("i", $ID);
$stmt->execute();
$result = $stmt->get_result();

if($row = $result->fetch_assoc()) {
   $ID = $row["ID"];
   $Date = $row["Date"];
   $Title = $row["Title"];
   $Description = $row["Description"];
   $Image = $row["Image"];

   $LayoutHTML = str_replace("__DB_ID__", $ID, $LayoutHTML);
   $LayoutHTML = str_replace("__DB_Date__", htmlspecialchars($Date, ENT_QUOTES, "UTF-8"), $LayoutHTML);
   $LayoutHTML = str_replace("__DB_Title__", htmlspecialchars($Title, ENT_QUOTES, "UTF-8"), $LayoutHTML);
   $LayoutHTML = str_replace("__DB_Description__", htmlspecialchars($Description, ENT_QUOTES, "UTF-8"), $LayoutHTML);
   $LayoutHTML = str_replace("__DB_Image__", htmlspecialchars($Image, ENT_QUOTES, "UTF-8"), $LayoutHTML);
}

$stmt->close();

استعلام ID، تاریخ، عنوان، توضیحات و تصویر را از جدول آزمایش بارگذاری می‌کند. جدیدترین ویژگی دکمه ویرایش به‌ویژه ID استخراج‌شده است. سپس PHP جایگزین متغیر __DB_ID__ در $LayoutHTML با شناسه واقعی رکورد می‌شود. سایر متغیرها مانند قبل با تاریخ، عنوان، توضیحات و مسیر تصویر پر می‌شوند.

مقادیر تاریخ، عنوان، توضیحات و مسیر تصویر با استفاده از htmlspecialchars() برای نمایش HTML محافظت می‌شوند. $ID = 1 فقط به عنوان شناسه نمونه ثابت است؛ برای رکوردهای دیگر، مقدار مناسب را وارد کنید.

اگر از آموزش قبلی یک مثال UPDATE خودکار وجود دارد، آن را قبل از این آزمایش غیرفعال کنید. در غیر این صورت ممکن است تغییراتی که بعداً از طریق دکمه ویرایش ذخیره می‌کنید، در بارگذاری بعدی صفحه دوباره بازنویسی شود.

2. اسکریپت HTML: افزودن دکمه ویرایش

اکنون کد HTML همان صفحه را باز کنید. مثال زیر بخش کامل صفحه را با تصویر، تاریخ، عنوان و توضیحات نشان می‌دهد. این بخش بر اساس تصویر شما به عنوان یک مثال قابل خواندن HTML ساخته شده است. کلاس‌های CSS موجود و خط تصویر خود را می‌توانید در صفحه خود حفظ کنید.

<section class="section py-5 sectionAll">
   <div class="container py-4">
      <div class="row g-5 align-items-center">
         <div class="colAll col-lg-6 wowOff fadeInLeft">
            <div class="ratio ratio-4x3 rounded-4 overflow-hidden">
               <img src="/CMS/cgi-bin/IMG.pl?__DB_Image__=700=500=1=100=1" class="w-100 h-100 object-fit-cover" alt="">
            </div>
         </div>
         <div class="colAll col-lg-6 wowOff fadeInRight">
            <span class="badge text-bg-secondary text-white mb-3">__DB_Date__</span>
            <!--bxEB_DSedit Test __DB_ID__ bxEB_DSedit-->
            <h2>__DB_Title__</h2>
            <p>__DB_Description__</p>
            <a href="#" class="btn btn-primary">Mehr erfahren</a>
         </div>
      </div>
   </div>
</section>

خط جدید حیاتی درست در پشت تاریخ قرار دارد: دکمه ویرایش به عنوان نظر HTML. این شامل نوع دکمه bxEB_DSedit، نام جدول آزمایش و متغیر __DB_ID__ است. CMS bluetronix این نظر را پردازش کرده و در حالت ویرایش، قلم ویرایش مناسب را نمایش می‌دهد.

خط دکمه ویرایش را به همراه نشانه‌های نظر دقیقاً کپی کنید. نام جدول و شناسه باید با اسکریپت PHP مطابقت داشته باشد. اگر جدول خود نام دیگری دارد، Test را هم در پرس و جو SELECT و هم در دکمه ویرایش جایگزین کنید.

3. نحوه همکاری PHP و HTML

هنگام بارگذاری صفحه، PHP ابتدا رکورد را از آزمایش خوانده و سپس متغیرهای __DB_ID__، __DB_Date__، __DB_Title__، __DB_Description__ و __DB_Image__ را در HTML جایگزین می‌کند. از خط دکمه ویرایش با __DB_ID__ در مثال ما، ارتباط با جدول آزمایش و شناسه رکورد 1 برقرار می‌شود.

به این ترتیب، صفحه همچنان تصویر و متون موجود در پایگاه داده را نمایش می‌دهد. علاوه بر این، دکمه ویرایش می‌داند که کدام رکورد را باز کند. مشتری نهایی نیازی به ویرایش PHP یا HTML ندارد.

4. نتیجه: ویرایش رکورد به‌طور مستقیم در وب‌سایت

ابتدا کد PHP و HTML را ذخیره کن. صفحه نمونه را دوباره در حالت ویرایش بارگذاری کن. اکنون در کنار تاریخ، قلم ویرایش ظاهر می‌شود، همان‌طور که در اولین اسکرین شات مشاهده می‌شود.

بر روی قلم ویرایش ضربه بزن. CMS ماسک ویرایش را برای تست – شناسه: 1 باز می‌کند. در آنجا می‌توانی تاریخ، عنوان، توضیحات و تصویر را تغییر دهی. برای تصویر، دکمه BX-Image موجود در دسترس است.

بر روی ذخیره کلیک کن و صفحه وب را دوباره بارگذاری کن. PHP مقادیر به‌روزرسانی‌شده را از MySQL خوانده و آن‌ها را در همان جاهای خالی HTML قرار می‌دهد. طرح کلی بدون تغییر باقی می‌ماند؛ تنها محتوای ویرایش‌شده به‌روز می‌شود.

خلاصه

برای اتصال به دکمه ویرایش، شما باید استعلام SELECT موجود خود را با ID تکمیل کرده و آن را با $LayoutHTML به __DB_ID__ منتقل کنید و علامت دکمه ویرایش را در HTML در کنار محتوای مورد نظر قرار دهید. پس از آن، رکورد مرتبط می‌تواند مستقیماً از طریق وب‌سایت ویرایش شود.