Layuiテーブルは指定された行のラジオボタンを選択し、その行の実装コードまでスクロールします。

Layuiテーブルは指定された行のラジオボタンを選択し、その行の実装コードまでスクロールします。

layui テーブルには複数行のデータがあります。外部入力コンテンツを通じて、指定された行を見つけ、変更する行を選択し、行に対して操作を実行する必要があります。

結果:

HTMLコード:

<本文>
      <div class="layui-fluid">
         <input type="text" id="txt_id" />
          <table class="layui-hide" id="test" lay-filter="test"></table>
          <script type="text/html" id="toolbarDemo">
              <div class="layui-btn-container">
                  <button class="layui-btn layui-btn-sm" lay-event="getCheckData">選択した行データを取得します</button>
                 <button class="layui-btn layui-btn-sm" lay-event="SetChecked">選択した行を設定します</button>
             </div>
         </スクリプト>
  
     </div>
     <script src="lib/jquery-1.9.1.min.js"></script>
     <script src="layui/layui.all.js"></script>
     <script src="lib/AjaxCommon.js"></script>
     <スクリプト>
         layui.use('テーブル'、関数() {
             : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : :

背景コード:

 パブリッククラス LayUITableEntity
  { 
   公開文字列コード
  { 
  得る; 
  セット; 
  }
  公開文字列メッセージ
  { 
  得る; 
  セット; 
  } 
   公開文字列カウント 
   {
   得る; 
   セット;
   } 
    パブリックオブジェクトデータ 
    { 
    得る;
    セット;
    } 
    }
    パブリッククラス TestEntity 
    {
   /// <要約>
  /// このフィールドはラジオが選択されているかどうかを示すために使用されます。 /// </summary>
   パブリックブール LAY_CHECKED 
    { 
    取得する; 設定する;
    } 
    = 偽; 
    パブリック文字列ID
    {
    得る;
    セット; 
    } 
    パブリック文字列名
    { 
    取得する; 設定する;
    } 
    }
    [ルート("/api/test")]
    パブリック クラス TestController: ServiceController
    { 
    [RouteHttpGet("こんにちは")] 
    パブリックFormiumResponse HelloNanUI(FormiumRequest リクエスト) 
    { 
     リスト<TestEntity> teList = 新しいリスト<TestEntity>(); 
     (int i = 1; i <= 30; i++) の場合 
    {
   TestEntity te = 新しい TestEntity() 
    { 
     //初回読み込み時に、ID 3 のレイヤーが選択されます LAY_CHECKED = i == 3 ? true : false,
     Id = i.ToString()、
     名前 = "名前" + i.ToString() 32 
    }; 
    teList.Add(te);
    } 
 LayUITableEntity layUITableEntity = 新しい LayUITableEntity() 
    {
    コード = "0"、
    カウント = teList.Count().ToString(),
    メッセージ = "", 
    データ = teList
    }; 
    Json(layUITableEntity) を返します。 
    } 
    }

Layuiテーブルの指定行のラジオボタンを選択し、その行までスクロールする実装コードについてはこれで終了です。Layuiテーブルのラジオボタン選択スクロールに関するより関連性の高いコンテンツについては、123WORDPRESS.COMの過去の記事を検索するか、以下の関連記事を引き続き閲覧してください。今後とも123WORDPRESS.COMをよろしくお願いいたします。

<<:  フロントエンドブラウザのフォントサイズが12px未満のソリューション

>>:  Vue elementUI フォームのネストされたテーブルと各行の検証の詳細な説明

推薦する

HTML 名 ID とクラスの違い_PowerNode Java アカデミー

名前タグの名前を指定します。形式 <input type="text" n...

HTMLは実際にはいくつかの重要なタグを学ぶアプリケーションです

「これは革命になるだろう」という記事が出たあと。業界の皆様に認知され、もちろん内外からの評価もいただ...

Win10 + Ubuntu 16.04 デュアルシステム 完璧なインストールチュートリアル [詳細]

必ずデータをバックアップすることを忘れないでください。データは貴重なものです! ! !コンピュータモ...

Dockerfile ビルド中に発生する「/bin/sh: pip: コマンドが見つかりません」という問題の解決方法

記述した Dockerfile の内容は次のとおりです。 Python:3.6.8 から pip i...

Vue ElementUI フォームのフォーム検証

フォーム検証は、フロントエンド開発プロセスで最もよく使用される機能の 1 つです。私の個人的な仕事経...

CentOS8でyumソースを変更した後にウェアハウスキャッシュの同期に失敗する問題の詳細な説明

問題の原因: 最初は CentOS 8 のデフォルトの yum ソースを正常に使用できますが、次のコ...

Docker で Kong API Gateway をインストールして使用する詳細なチュートリアル

1 はじめにKong は単純な製品ではありません。この記事で言及されている Kong は主に Kon...

Centos6.5 の rpm パッケージから mysql5.7 をインストールするときに発生する初期化エラーの解決策

1. rzをサーバーにアップロードして解凍する rz [root@mini2 アップロード]# ta...

WindowsにOpenSSLをインストールし、OpenSSLを使用して公開鍵と秘密鍵を生成します。

1. OpenSSL公式サイト公式ダウンロードアドレス: https://www.openssl....

MySQL 8 の新機能: 非表示のインデックス

背景インデックスは諸刃の剣です。クエリ速度は向上しますが、DML 操作も遅くなります。結局のところ、...

CentOS7 デプロイメント Flask (Apache、mod_wsgi、Python36、venv)

1. Apacheをインストールする # yum インストール -y httpd httpd-de...

ボタンをクリックして画像を切り替える JavaScript

この記事の例では、ボタンをクリックすることで画像を切り替えることを実現するJavaScriptの具体...

Reactは一般的なスケルトン画面コンポーネントの例を実装します

目次スケルトンスクリーンとは何ですか?デモデザインのアイデア具体的な実装スケルトンスクリーンとは何で...

ネイティブ JS 音楽プレーヤー

この記事の例では、音楽プレーヤーを実装するためのJSの具体的なコードを参考までに共有しています。具体...

Linux でのマルチスレッドにおけるフォークの紹介

目次質問:ケース(1)子スレッドを作成する前にフォークするケース(2)子スレッドを作成した後にフォー...