Layui數(shù)據(jù)表格判斷編輯輸入的值,是否為我需要的類型詳解
因?yàn)楹芏嗍褂胠ayui插件做的表格都需要用到layui的表格編輯事件，但是編輯事件是可以隨意輸入值的，但是如果當(dāng)我們的字段為數(shù)量的時(shí)候，又需要獲取到數(shù)量傳進(jìn)控制器進(jìn)行數(shù)據(jù)處理的時(shí)候，而控制器接收的數(shù)量為int類型。倘若我輸入的數(shù)量不是整數(shù)類型，那么就無法傳進(jìn)控制器，直接報(bào)404，找不到url中的方法
所有在使用重載前，最好先對用戶輸入的值進(jìn)行一下判斷，判斷是否符合條件，允許傳進(jìn)控制器
比如我項(xiàng)目中的表格
我這個(gè)項(xiàng)目要求是，當(dāng)用戶輸入的數(shù)量大于該商品在該倉庫的庫存時(shí)，就會(huì)提醒用戶，并且將數(shù)量的值，返回為用戶編輯前的值。
那么其中需要獲取到用戶還未編輯時(shí)的值，這個(gè)是最重要的
所以如何獲取到這個(gè)數(shù)據(jù)呢，這里可以使用layui的監(jiān)聽表頭工具事件
oldQuantity就是用戶編輯前的值了，
為什么說他是編輯前的值？？？
因?yàn)檫@個(gè)方法，是在點(diǎn)擊表頭為數(shù)量的單元格時(shí)，就會(huì)觸發(fā)，然后獲取表中的數(shù)據(jù)
而layui的表格編輯事件是當(dāng)用戶寫完后，點(diǎn)擊空白才會(huì)觸發(fā)，就是因?yàn)檫@個(gè)先后的問題，所以使oldoldQuantity就成為了之前的舊的數(shù)據(jù)
那么接下來就是使用layui中的編輯監(jiān)聽事件進(jìn)行對數(shù)據(jù)的處理判斷
我這里有2個(gè)if判斷，第一個(gè)是用于判斷用戶輸入的值是否大于庫存，如果是，則執(zhí)行
第二個(gè)是如果用戶輸入的是字母或者是符號亦或者空（””）則執(zhí)行
Obj.update是個(gè)方法，原來修改該行數(shù)據(jù)中字段的名稱，當(dāng)然只是緩存的數(shù)據(jù)
所以還得使用重載，重新導(dǎo)入一下數(shù)據(jù)，重載中的Data就是重載回調(diào)的數(shù)據(jù)
然后傳進(jìn)去后再傳出來就可以了
當(dāng)然第二個(gè)if判斷中的方法也是一樣的思路
所以再當(dāng)我們?nèi)ポ斎胱帜?、符號的時(shí)候就會(huì)提示你“輸入的數(shù)量只能為整數(shù)”
以上這篇Layui數(shù)據(jù)表格判斷編輯輸入的值,是否為我需要的類型詳解就是小編分享給大家的全部內(nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
- Layui數(shù)據(jù)表格之單元格編輯方式
- Layui彈框中數(shù)據(jù)表格中可雙擊選擇一條數(shù)據(jù)的實(shí)現(xiàn)
- layui table表格數(shù)據(jù)的新增,修改,刪除,查詢,雙擊獲取行數(shù)據(jù)方式
- 解決Layui數(shù)據(jù)表格顯示無數(shù)據(jù)提示的問題
- Layui實(shí)現(xiàn)數(shù)據(jù)表格默認(rèn)全部顯示(不要分頁)
- 在Layui中操作數(shù)據(jù)表格,給指定單元格添加事件示例
- layui+ssm實(shí)現(xiàn)數(shù)據(jù)表格雙擊編輯更新數(shù)據(jù)功能
相關(guān)文章
這篇文章主要給大家介紹了關(guān)于js日期時(shí)間格式化的相關(guān)資料,文中分別介紹了利用原生js以及Moment.js庫處理日期時(shí)間格式化的方法,需要的朋友可以參考下2021-07-07
很多南方的小伙伴可能沒怎么見過或者從來沒見過下雪，這篇文章小編給大家?guī)硪粋€(gè)小Demo，模擬了下雪場景。感興趣的小伙伴快來跟隨小編一起學(xué)習(xí)一下吧2021-12-12
微信小程序?qū)崿F(xiàn)側(cè)邊欄二級聯(lián)動(dòng)
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)側(cè)邊欄二級聯(lián)動(dòng)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-07-07
JavaScript數(shù)據(jù)結(jié)構(gòu)之雙向鏈表定義與使用方法示例
這篇文章主要介紹了JavaScript數(shù)據(jù)結(jié)構(gòu)之雙向鏈表定義與使用方法,簡單介紹了雙向鏈表的原理,并結(jié)合實(shí)例形式分析了雙向鏈表的定義與使用方法,需要的朋友可以參考下2017-10-10
Javascript中從學(xué)習(xí)bind到實(shí)現(xiàn)bind的過程
這篇文章主要介紹了Javascript中從學(xué)習(xí)bind到實(shí)現(xiàn)bind的過程，有興趣的朋友跟著學(xué)習(xí)下吧。2018-01-01
JS動(dòng)態(tài)更改div高度實(shí)現(xiàn)代碼例子
在Web開發(fā)中通過使用JavaScript可以動(dòng)態(tài)地修改HTML元素的屬性和樣式,下面這篇文章主要給大家介紹了關(guān)于JS動(dòng)態(tài)更改div高度實(shí)現(xiàn)的相關(guān)資料,文中給出了詳細(xì)的代碼示例,需要的朋友可以參考下2023-11-11
JavaScript開發(fā)時(shí)的五個(gè)注意事項(xiàng)
JavaScript開發(fā)時(shí)的五個(gè)注意事項(xiàng)講述了表單事件、鏈接、循環(huán)優(yōu)化、匿名函數(shù)、字符串連接等優(yōu)化技巧,需要的朋友可以參考一下2007-12-12
js使用數(shù)組判斷提交數(shù)據(jù)是否存在相同數(shù)據(jù)
判斷提交數(shù)據(jù)是否存在相同數(shù)據(jù)，在本文將為大家介紹使用數(shù)組做到這一點(diǎn)，感興趣的朋友可以參考下2013-11-11
這篇文章主要介紹了通過實(shí)例解析JavaScript常用排序算法,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-09-09
php的派發(fā)機(jī)制實(shí)現(xiàn)方法
PHP是一種動(dòng)態(tài)類型的編程語言,它支持面向?qū)ο缶幊?在PHP中,派發(fā)指在運(yùn)行時(shí)確定要調(diào)用的方法或函數(shù)的過程,派發(fā)機(jī)制允許根據(jù)實(shí)際對象的類型來選擇要執(zhí)行的方法,這種靈活性使得PHP可以實(shí)現(xiàn)多態(tài)性,本文將給大家介紹php的派發(fā)機(jī)制是怎么實(shí)現(xiàn)的,需要的朋友可以參考下2023-10-10