:::

10-2 用物件來做表單

一、為何要用物件來做表單?

  1. 優點
    • 不用自己手動刻表單,方便省事
    • 做修改功能時可省下大量功夫!
    • 未來可無縫轉換BootStrap4
    • 內含驗證及檢查功能
    • 內建編輯器等一些常用外掛
  2. 缺點
    • 版面缺乏彈性
    • 想要套用其他jquery套件會有點麻煩

二、關於PHP-Bootstrap-Form

  1. 官網:http://smarttechdo.com
  2. 安裝:下載 php-bootstrap-form-4.0.zip,並解壓縮至 class 下改名為 php-bootstrap-form

三、使用之產生表單

  1. 建立函數 action_form() 用來產生
  2. 由於內建的月曆實在難用,所以,可以自行套用其他的月曆程式
  3. 在裡面引入"class/php-bootstrap-form/PFBC/Form.php
    function action_form()
    {
        require_once "class/php-bootstrap-form/PFBC/Form.php";
        $values = [];
        ob_start();
        echo '<script type="text/javascript" src="class/My97DatePicker/WdatePicker.js"></script>';
        Form::open("action", $values);
        Form::Hidden("op", 'insert_action');
        Form::Textbox("活動名稱", "title", ['required' => 1]);
        Form::Textbox("活動日期", "action_date", ['required' => 1, 'onClick' => "WdatePicker()"]);
        Form::Textbox("截止日期", "end_date", ['required' => 1, 'onClick' => "WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:00'})"]);
        Form::YesNo("使否啟用", "enable");
        Form::CKEditor("活動內容", "content");
        Form::Button('儲存', 'submit');
        Form::close(false);
        $form = ob_get_contents();
        ob_end_clean();
        return $form;
    }
  4. $values = [];是個個欄位預設值,未來在修改時會用到

  5. 若新增時,想要替某些欄位設定預設值,直接填入 $values 陣列即可(要按照順序),例如:

    $values = [
        'title'       => '活動',
        'action_date' => date("Y-m-d", strtotime("+14 day")),
        'end_date'    => date("Y-m-d H:i:00", strtotime("+10 day")),
        'enable'      => 1,
        'content'     => '活動內容~~~',
    ];
  6. 其中 date() 用來格式化日期,strtotime() 用來產生時間戳記。
  7. 由於該表單物件會直接輸出,故利用 ob_start(); 將其輸出移至緩衝區,再利用 ob_get_contents(); 把輸出的東西取出來並存入 $form,最後用 ob_end_clean(); 釋放掉。

  8. 表單一律從 Form::open() 開始,Form::close() 結束,中間便是表單欄位。

  9. 表單預設的 action 位置就是該檔案本身,method 預設為post

  10. 引入 WdatePicker.js 目的是為了使用 My97DatePicker 小月曆

  11. 詳細表單欄位用法可參考:http://smarttechdo.com/~avb/pfbc/api/

  12. 亦可至 http://smarttechdo.com/~avb/pfbc/example.php 觀看範例。

四、小月曆的常用參數

  1. 其常用的參數如下,更多參數請看:http://www.my97.net/dp/demo/index.htm
  • (1)  民國年:dateFmt:'民國yyy年MM月dd日'
  • (2)  含時間:dateFmt:'yyyy-MM-dd HH:mm:ss'
  • (3)  起始日期:startDate:'1980-05-01' 或 %y-%M-%d %H:%m:%s
  • (4)  星期一為第一天:firstDayOfWeek:1
  • (5)  最小日期:minDate:'2017-10-24' 或 %y-%M-{%d+2}  %H:%m:%s
  • (6)  最大日期:maxDate:'2017-10-25'
  • (7)  週休禁止:disabledDays:[0,6]
  • (8)  顯示週數:isShowWeek:true
  • (9)  日期框唯讀:readOnly: true
  • (10)  取消週末高亮度:highLineWeekDay: false
  • (11)  顯示清空按鈕:isShowClear: false
  • (12)  雙月曆:doubleCalendar:true

:::

書籍目錄

展開 | 闔起

快速登入


https%3A%2F%2Fcampus-xoops.tn.edu.tw%2Fmodules%2Ftad_book3%2Fpage.php%3Ftbdsn%3D729%26tbsn%3D27

計數器

今天: 4599459945994599
昨天: 2489248924892489
總計: 8026581802658180265818026581802658180265818026581