bootstrapTable行內動態編輯行中某列欄位資料
今天開發者遇到了一個需求:在一個table資料中,點選某行的某一個列資料就行修改該行該欄位的屬性值(另一篇博文有優化方法)。
前言:在網上搜索了一番,使用x-editable元件去實現這個功能,在下載了一些js檔案後,一番搗鼓搞不定(如需要下面js留下地址送你),後來使用自己的方法搞定;下面是使用x-editable元件出來的效果(效果看起來很不錯);
思路:
在檢視bootstraptable API 後,找到了onclickCell方法,此時我想到之前用過updateRow去更新行資料(前提是在bootstraptable的環境前提下),通過onclickCell獲取屬性,然後通過updateRow去更新這條資料達到動態修改欄位目的。
參考資料:layer Api
onClickCell | click-cell.bs.table | field, value, row, $element | 當單擊某一格,就會觸發該事件,所需引數如下: - field:此格所在列的欄位名 - value:此格的資料 - $element:此行的此列,就是此格(td) |
程式碼:
onClickCell :function(field, value, row, $element){ console.log(value); $("#editId").val(value); var btns = { btn : ["確定","取消"], yes : function(index, layero) {//儲存 var upIndex = $element.data('index'); row.field=$("#editId").val(); $('#cancelBillListTable').bootstrapTable('updateRow', { index: upIndex, row: row }); layer.close(index); }, btn2 : function(index, layero) {//清空 } }; layer.open($.extend({ type : 1, shadeClose : false, area : [ '350px', '200px' ], title : "修改欄位屬性", maxmin: true, cancel : function(){ return true; }, end: function(index){ return true; }, shade : 0.5, scrollbar : false, btnAlign : 'c', // 居中 content : $("#updateDiv") },btns)); },
點選後出來的效果:
輸入你修改後的值,傳遞到 row中,呼叫updataRow方法即可(此處使用的是layer控制元件的彈出層layer.prompt,上述程式碼中的是使用的layer.open);
相關推薦
bootstrapTable行內動態編輯行中某列欄位資料
今天開發者遇到了一個需求:在一個table資料中,點選某行的某一個列資料就行修改該行該欄位的屬性值(另一篇博文有優化方法)。 前言:在網上搜索了一番,使用x-editable元件去實現這個功能,在下載了一些js檔案後,一番搗鼓搞不定(如需要下面js留下地址送你),後來使
mysql把表中某一欄位拆分為多列
一:sql資料庫截圖 二:sql語句 SELECT id, house_no as '總稱',SUBSTR(house_no, 1, 4) AS '小區名稱',SUBSTR(house_n
spring boot mongodb 統計表中某一欄位的所有值,其中aggregate的用法之一
pom.xml 依賴: <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-data-mongodb<
List實體集合更改任意Model中某一個欄位的值,其他Model值也一起變了,引用型別和值型別的問題
工作中遇到這麼一個問題,現在有一個Model,我需要將該Model變為兩個Model並且放入List集合當中去,這兩個Model完全一樣,但是其中某個欄位的值不一樣,經過直接賦值我們發現整個List中所有Model的那個欄位值都變成一樣的了,並沒有修改成功,因此設計到了引用
laravel 中某一欄位自增、自減
increment自增方法有兩個引數:第一個為必填,代表要對資料表的哪個欄位進行自增操作,第二個引數為可選,如果為空則表示每次遞增1,如果填寫了比如3,則表示每次在原有的基礎上遞增3。 DB操作: D
php對二維陣列中某一欄位進行排序
<?php $array = array( array('name'=>'手機','brand'=>'諾基亞','price'=>1050), array('name'=>'膝上型電腦','brand'=>'lenovo','pr
mybatis。插入語句如何插入資料庫中某一欄位最大值(純sql實現)
<insert id="inserts"> <selectKey keyProperty="ID" ORDER="BEFORE" resultType="java.lang.I
Oracle中將一個表中某一欄位的資料更新到另一個表中某一欄位
首先想到的sql:update 表2 set 表2.c=(select val from 表2 where 表1.a=表2.a);但這樣會出現在表1中有的行,如果在表2中沒有對應的行,值被更新為null
Oracle Group by 查詢表中某一個欄位,其哪個值得記錄數最多或最少
select "ReturnId",count("ReturnId") as COUNT_RETURNID from "ECRSums" group by "ReturnId" order by COUNT_RETURNID; 要查詢的欄位名 為 Return_Id ,
物件中某一個欄位的值為空時不進行展示
String index=""; for (int i = 0; i < statEmails.size(); i++) { String string = statEmails
Golang如何優雅地提取JSON資料中需要的欄位資料
JSON資料是我們開發中經常遇到的一種資料格式,一般通用的做法是,我們通過建立實體類,然後利用一些框架將JSON資料轉化為對應的實體類物件,這樣我們就可以方便地訪問JSON資料了。 但是有些時候,一個JSON物件很大,欄位很多,而我們可能只需要其中的幾個欄位值,這在呼叫第三方API時可能經常
oracle中,把一個表中指定的欄位資料更新到另外一張表裡面
一、建立表結構 create table test1( id varchar2(10) , val varchar2(20), name varchar2(20)); create table test2( id varchar2(10), val varchar2(20) ,
GridView控制元件RowDataBound事件中獲取列欄位值的幾種途徑 !!!
protectedvoid GridView1_RowDataBound(object sender, GridViewRowEventArgs e) { if (e.Row.RowType == DataControlRowType.DataRow) {
GridView控制元件RowDataBound事件中獲取列欄位的幾種途徑
GridView是ASP.NET中功能強大的資料顯示控制元件,它的RowDataBound事件為我們提供了方便的控制行、列資料的途徑。要獲取當前行的某個資料列,我在實踐中總結有如下幾種方法:1. Cells[x].Txt。 從列單元格的文字值獲取。這種方法簡單高率,最為
GridView控制元件RowDataBound事件中獲取列欄位的幾種方法
GridView是ASP.NET中功能強大的資料顯示控制元件,它的RowDataBound事件為我們提供了方便的控制行、列資料的途徑。 軟體開發網 www.mscto.com 要獲取當前行的某個資料列,有如下幾種方法: 1. Cells[x].Txt。 從列單元格的文字值獲取。這種方法簡單高率,最為常用
如何獲取DataGridView表格中的某個欄位資料
我們可以通過以下幾個步驟實現,將DataGridView表中的資料賦值到TextBox控制元件中,以便修改或以作他用。 1、拖入DataGridView控制元件後,綁定了資料; 2、雙擊DataGridView控制元件,啟用dataGridView1_CellContent
ExtJs 中Grid根據列表中某列的值,修改整行資料的背景色 ExtJS版本為2.3
這段時間又開始做ExtJS了,需求是要根據列表中某列資料的值,將整行資料的背景色修改掉: 只需要在grid初始化的時候給grid加上一個配置項即可; var gridCfg = { region : 'center', store : store, anchor
datagrid行內新增,行內編輯
實現效果 <div data-options="region:'east',split:true,border:false" title="部門列表" style="width:13%;"> <table id="dept_data
css基礎 display:inline-block 行內元素->行內塊元素
ins 鍛煉 tps strong name htm level 都是 鏈接 禮悟: 公恒學思合行悟,尊師重道存感恩。葉見尋根三返一,江河湖海同一體。 虛懷若谷良心主,願行無悔給最苦。讀書鍛煉養身心,誠勸且行且珍惜。
C# DataTable 去某幾個欄位相等的重複行,給入需要做疊加的欄位名做數值疊加
以下程式碼實現c#語言DataTable去某幾個欄位的重複行, 數值的疊加 filedNames : 去重欄位名 陣列 superFileds: 疊加欄位名 陣列 /// <summary> /// 去重複並且疊加需要疊加的欄位 /// </summar