快捷導(dǎo)航

asp.net core使用DevExtreme20將int列轉(zhuǎn)為checkbox方法示例

更新時(shí)間：2023年08月16日 11:46:55 作者：Chobits

這篇文章主要為大家介紹了asp.net core使用DevExtreme20將int列轉(zhuǎn)為checkbox方法示例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪

后端設(shè)置擴(kuò)展方法

public static void SetNumCheckBox<T>(this DataGridColumnBuilder<T> builder)
{
    _ = builder.CellTemplate(new JS("CheckBoxCellTemplate"))
        .EditCellTemplate(new JS("CheckBoxEditorTemplate"))
        .Lookup(lookup => lookup.DataSource(new object[] {
                new {
                    label = "是",
                    value = 1,
                },
                new {
                    label = "否",
                    value = 0,
                },
    }).DisplayExpr("label").ValueExpr("value"));
}

前端添加單元格和編輯代碼

const getNewDomId = (function () {
  let id = 1;
  return function () {
    return id++;
  };
})();
function CheckBoxEditorTemplate(el, e) {
  var domId = 'grid_cell_' + getNewDomId();
  el.html(`<div id="${domId}"></div>`);
  new Vue({
    el: '#' + domId,
    template: `<el-checkbox v-model="state" v-on:change="onChange" />`,
    data: {
      state: e.value === 1,
    },
    methods: {
      onChange(value) {
        e.setValue(value ? 1 : 0);
      },
    },
  });
}
function CheckBoxCellTemplate(container, options) {
  container.html(
    `<div class="dx-checkbox-container ${
      options.value === 1 ? 'dx-checkbox-checked' : ''
    }"><span class="dx-checkbox-icon"></span></div>`
  );
}

以上就是asp.net core使用DevExtreme20將int列轉(zhuǎn)為checkbox方法示例的詳細(xì)內(nèi)容，更多關(guān)于asp.net core將int列轉(zhuǎn)為checkbox的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章！

您可能感興趣的文章:

相關(guān)文章

設(shè)計(jì)windows phone頁(yè)面主題
這篇文章主要介紹了設(shè)計(jì)windows phone頁(yè)面主題,需要的朋友可以參考下
2015-07-07
.Net 6中的PeriodTimer介紹
這篇文章主要介紹了.Net 6中的PeriodTimer，.net 6中新增了一個(gè)異步計(jì)時(shí)器PeroidTimer，相對(duì)普通Timer的回調(diào)，它的模型更簡(jiǎn)單，下面一起來(lái)看看具體詳情吧
2022-01-01
.NET新能源汽車鋰電池檢測(cè)程序UI掛死問(wèn)題分析
這篇文章主要為大家介紹了.NET新能源汽車鋰電池檢測(cè)程序UI掛死問(wèn)題分析?，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
2022-11-11
ASP.NET通過(guò)Web.config實(shí)現(xiàn)驗(yàn)證賬號(hào)密碼是否正確進(jìn)行登錄
本文是通過(guò)authentication（認(rèn)證訪問(wèn)者）和 authorization（訪問(wèn)權(quán)限），來(lái)實(shí)現(xiàn)一個(gè)簡(jiǎn)單的判斷用戶賬號(hào)密碼是否正確，需要的朋友可以參考下
2021-09-09
.NET 6 中的隱式命名空間引用
這篇文章小編主要向大家介紹的是介紹了.NET 6 中的隱式命名空間引用，其正式版發(fā)布之前會(huì)專注于各種測(cè)試和 BUG 修復(fù)，下面就由小編來(lái)詳細(xì)介紹吧，感興趣的小伙伴可以參考下文
2021-09-09
ASP.NET Core Web API 教程Project Configuration
本文將介紹 Startup 類中的配置方法以及如何通過(guò)這些方法來(lái)設(shè)置應(yīng)用程序。除此之外，還將介紹如何注冊(cè)服務(wù)以及如何通過(guò)擴(kuò)展方法來(lái)實(shí)現(xiàn)注冊(cè),需要的朋友可以參考下面文章內(nèi)容
2021-09-09
ASP.NET?Core?6最小API中使用日志和DI示例詳解
這篇文章主要為大家介紹了ASP.NET?Core?6最小API中使用日志和DI示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
2022-08-08
Oracle中TO_DATE格式介紹
Oracle中TO_DATE格式介紹;可供需求的朋友參考
2012-11-11
.NET?Core?中對(duì)象池?Object?Pool的使用
這篇文章主要介紹了?.NET?Core?中對(duì)象池?Object?Pool的使用，對(duì)象池簡(jiǎn)單來(lái)說(shuō)就是一種為對(duì)象提供可復(fù)用能力的軟件設(shè)計(jì)思路，對(duì)象池最常用的場(chǎng)景是游戲設(shè)計(jì)，因?yàn)樵谟螒蛑写罅看嬖谥蓮?fù)用的對(duì)象，源源不斷的子彈出現(xiàn)并不是循環(huán)再生的，下面一起進(jìn)入文章了解具體內(nèi)容吧
2021-11-11
ASP.NET?Core使用功能開(kāi)關(guān)控制路由訪問(wèn)操作
這篇文章主要介紹了ASP.NET?Core使用功能開(kāi)關(guān)控制路由訪問(wèn)操作,而對(duì)于一些試驗(yàn)性的功能，我們并不希望用密碼去控制是否允許訪問(wèn)，而是想用一種開(kāi)關(guān)的方式開(kāi)放,下面文章我們就來(lái)試著實(shí)現(xiàn)這個(gè)功能，需要的小伙伴可以參考一下
2022-02-02