[精讚] [會員登入]
53

Yii2 使用 MODAL class 呈現內容時,如何防止滑鼠失焦導致頁面自動關閉

Yii2 使用 MODAL class 呈現內容時,如何防止滑鼠失焦導致頁面自動關閉

此文完整連結 http://n.sfs.tw/11018

複製連結 Yii2 使用 MODAL class 呈現內容時,如何防止滑鼠失焦導致頁面自動關閉@杜子的網管筆記
(文章歡迎轉載,務必尊重版權註明連結來源)
2017-04-25 14:00:48 最後編修
2017-04-25 13:53:28 By 杜子
 

 

Yii2 的 Gii 程式產生器是一個功能非常強大的模組,

能夠在彈指之間產生 CRUD 四個常用功能的 web 頁面

CRUD 即新增、瀏覽、修改、刪除,有在用的人就會知道,這裡不多做解釋。

 

除了傳統的 CRUD ,如果裝了 ajaxCRUD ,還可以產生具有 popup 頁面效果的 CRUD,如下圖

 

編輯頁面是一個彈出視窗,感覺很不賴!

 

現在問題來了,如果在編輯過程中,不小心多按了 [ESC]鍵,或是滑鼠失焦,

也就是點選了 popup 頁面以外的區域,整個頁面就自動關閉,所有你剛剛鍵入的內容就付諸流水了。

 

如何防止這個問題發生呢?可以修改觸發 popup 頁面的那個 view ,打開後找到以下內容,紅字部分請自行參考:

<?php Modal::begin([
    "id"=>"ajaxCrudModal",
    "size"=>Modal::SIZE_LARGE,        <==加入這個參數,可以改變 popup 出來的視窗大小,有 SIZE_DEFAULT、 SIZE_LARGE 、 SIZE_SMALL 三種
    "closeButton"=>["label"=>"close"],   <==這個參數,可以修改右上角那個 x ,改為 close 字樣

    "footer"=>"",// always need it for jquery plugin    
    "clientOptions"=> [                          <== 這個 array ,就是取消誤按 ESC鍵及滑鼠失焦即關閉的功能
           'backdrop' => 'static',
           'keyboard' => false,
    ],

])?>
<?php Modal::end(); ?>

 

你可能感興趣的文章

Yii2 使用 MODAL class 呈現內容時,如何防止滑鼠失焦導致頁面自動關閉 Yii2 使用 MODAL class 呈現內容時,如何防止滑鼠失焦導致頁面自動關閉

利用 Composer 建立 Yii2 專案 最近由於學校的網路架構調整及更新所有的個人電腦作業系統為 Win 10 , 讓我忙得不可開交, 偏偏 sfs3 此時在台

Yii2 中使用 CKeditor 的檔案上傳功能 在 Yii2 的設計經驗中, 常常會使用 CKediotr 做為 textarea 的編輯器, 但是插圖或檔案上傳需要另

我有話要說


限制:留言最高字數1000字,超過部分會被截掉。請注意:留言不可帶有網址,會被濾掉。 限制:未登入訪客,每則留言間隔需超過10分鐘,每日最多5則留言。

訪客留言

[無留言]

隨機好文

Yii2 使用 MODAL class 呈現內容時,如何防止滑鼠失焦導致頁面自動關閉 Yii2 使用 MODAL class 呈現內容時,如何防止滑鼠失焦導致頁面自動關閉

SFS3U 的安裝與更新 「SFS3-Unicode補完計劃」已屆完工,除了支援 108課綱,也一併解決多年來 Big-5字碼問題,新版本的 SFS3 簡稱 SFS3U。