EasyUI在Panel上動態添加LinkButton按鈕

来源:http://www.cnblogs.com/caicaikaijiang/archive/2017/08/11/easyui.html
-Advertisement-
Play Games

在最近做的一個將原來的舊系統翻新改造的項目中,為了在個別展示位置與原系統一直,研究了一下Easyui的panel面板,在panel的面板中動態添加Linkbuton按鈕的編輯方法,在這裡做個記錄免得自己以後忘了,也為有需求的人指明一條道,代碼比較亂,還請大家多多見諒,能實現就行啦,要求不高喲。 言歸 ...


在最近做的一個將原來的舊系統翻新改造的項目中,為了在個別展示位置與原系統一直,研究了一下Easyui的panel面板,在panel的面板中動態添加Linkbuton按鈕的編輯方法,在這裡做個記錄免得自己以後忘了,也為有需求的人指明一條道,代碼比較亂,還請大家多多見諒,能實現就行啦,要求不高喲。

言歸正傳,需求如下圖。

看似簡單,往panel的title中迴圈添加linkbutton標簽不就得了,其實還有很多問題需要處理,簡單描述一下我的思路和步驟。

1、panel的title屬性接收類型為字元串類型,所以我想到了在後臺獲取數據後拼接成字元串然後為title賦值,

2、當我通過非同步的方式獲取到數據後想講獲取到的值取出來然後在另外的在後續的方法中使用時,發現獲取不到數據;問題節點,非同步;變更為同步獲取數,問題解決;

3、將獲取到的數據動態添加到panel的title中後,檢查發現數據已經添加上去了,但是沒有效果;問題點:渲染問題,解決方法,panel中只是定義<a>標簽,不附加easyui效果,

單獨添加easyui效果。ok,此時問題解決了。

好了看似簡單其中包含了我在實現前大量的調試與檢查操作,還請能夠看到的高人可以的話,多給小弟寫指點,不多說,Show Code Time

//頁面載入時onload事件
$(function () {
            //開發方式為Asp.net MVC 利用訪問頁面獲取訪問控制器名稱
            var controllerName = "@ViewContext.RouteData.Values["controller"].ToString().ToLower()";
            LoadDataAndColumnsName(controllerName);
            LoadButtonInfo(controllerName);          
            
        })        
        var toolbar = [];     
        //獲取標題數據
        function LoadDataAndColumnsName(cname) {
            $.ajax({
                type: "post",
                url: '/' + cname.toString() + '/GetCommand',
                contentType: "application/json;charset=utf-8",
                dataType: "json",
                async: false,
                success: function (data) {
                    Callback(data);
                }, error: function (data) {
                    alert("error");
                }
            })
        }
        //將回調函數中的數據放到Panel的title中
        function Callback(json) {
            var data = json;
            toolbar = data.toolbar;
            
            var buttons = "<span class='splitcss'>|</span><span class='desc'>Sim卡設置</span><span class='splitcss'>|</span>";
            $.each(data.toolbar, function (i, item) {
                buttons += "<a class='panel_" + item.btnName + "' id='" + item.btnName + "' style='margin-top:-5px;' onclick='OperAction(" + item.btnName + ");'></a>";
            })
            //載入Panel
            $("#contentDiv").panel({
                title: buttons,
                height: $(window).height()
            })
        }
        //在Panel的title屬性中渲染linkbutton按鈕
        function LoadButtonInfo(cname) {
            $.each(toolbar, function (i, item) {
          //這樣載入按鈕的方案來自網路,找不到連接了,在此註明感謝下 $(
"#contentDiv").panel('header').find('a.panel_' + item.btnName + '').linkbutton({ iconCls: 'icon-' + item.btnIcon + '', text: item.btnCaption, plain: 'true' }) $('#' + item.btnName + '').bind('click', function () { OperAction(item.btnName, cname); }) }) }

好了,這樣應該就可以顯示了,我這裡是可以了,結實下OperAction函數是處理linkbutton點擊時觸發的函數去完成相應操作的。就到這裡了,不喜勿噴,求高人簡化指點。


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 1 、rsync介紹 rsync是實現全量及增量的本地或遠程數據鏡像同步備份的工具 rsync常用命令參數 2、rsync特性 ①支持拷貝特殊文件如軟鏈接,設備等 ②排除指定文件或目錄同步的功能,相當於打包命令tar排除功能 ③ 保持原文件或目錄的許可權、時間、硬鏈接、屬主、組等屬性不改變 ④實現增量 ...
  • 輸出重定向 重定向一般通過在命令間插入特定的符號來實現。特別的,這些符號的語法如下所示 command1 > file1 上面這個命令執行command1然後將輸出的內容存入file1。 註意任何file1內的已經存在的內容將被新內容替代。如果要將新內容添加在文件末尾,請使用>>操作符。 實例 執行 ...
  • 1. 引言 由於實習生轉正,公司給配了一臺新電腦,配置不用多說,16G記憶體,i7 7700的CPU,128SSD的系統盤,1T的機械硬碟,雖然只有一個破核顯。對於我個人而言,最重要的是系統從Windows7企業版升級到Windows10企業版,成為公司第一批使用Windows10的員工。 2. 在B ...
  • 一、直接使用C#操作資料庫的類庫ADO.NETADO.NET使用Connection對象來連接資料庫,使用Command或DataAdapter 對象來執行SQL語句,並將執行的結果返回給DataReader或DataAdapter,然後 再使用取得的DataReader或者DataAdapter對 ...
  • Entity Framework使用Code First方式時,實體之間已經配置好關係,根據實際情況某些情況下需要同時獲取導航屬性,比如獲取商品的同時需要獲取分類屬性(導航屬性),或者基於優化方面考慮等,下麵來看一個例子 例子中有會員實體類(Member)與角色實體類(Role),Role與Memb ...
  • 目前每日全網下發的推送消息大概是120億條,這些消息主要在Android設備上,平均每個Android用戶每天會收到30條以上的消息, 為什麼呢,主要是因為Android手機生態的原因,關閉消息太難. 所以Android設備的用戶每天生活在消息的轟炸之中,從業內的一些數據來看,現在Android的一... ...
  • “其實我們可以為治理霧霾做點什麼的。”在香港出生、美國上學、北京工作的伍毅恆一字一句地用普通話表達出了自己的願望。這天早上7點,北京市剛剛正式啟動了首次“霧霾紅色預警”。“這座大樓里,有我們最新的物聯網解決方案,供暖系統、空氣凈化和空調系統的所有數據我們都有,它們在雲端被處理,在我的圖表裡可以清楚看... ...
  • 第一次開發微信版網頁,對最重要的獲取微信OpenId,特此記錄下來 1.首先得有appid和appsecret 1 1. public class WeiXin { 2 3 public static string appid { 4 get { 5 string _appid = "wx3xxxx ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...