第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機(jī)立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

使用 json 源中的數(shù)據(jù)填充 Bootstrap 表

使用 json 源中的數(shù)據(jù)填充 Bootstrap 表

慕哥6287543 2023-07-14 15:32:02
我是使用 bootstrap 和 json 文件的新手,我遇到了以下問題:我有以下代碼:<div class="container">  <h1 class="text text-success text-center ">Kontoauszug</h1>  <table id="table" data-toggle="table" data-url="/json/data.json">    <thead>    <tr>      <th data-field="auszug.betrag">ID</th>      <th data-field="auszug.unix">Item Name</th>      <th data-field="auszug.transaktionsart">Item Price</th>    </tr>    </thead>  </table></div><script src="https://code.jquery.com/jquery-3.3.1.min.js"></script><script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script><script src="https://unpkg.com/bootstrap-table@1.16.0/dist/bootstrap-table.min.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script><link rel="stylesheet" href = "https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"><link rel="stylesheet" href= "https://unpkg.com/bootstrap-table@1.16.0/dist/bootstrap-table.min.css"><link rel="stylesheet" href="https://unpkg.com/bootstrap-table@1.18.0/dist/bootstrap-table.min.css">我正在使用的 json 具有以下結(jié)構(gòu):{  "auszug": {    "1604400036082-3450": {      "betrag": -367.5,      "von/an_uuid": "Test1",      "von/an": "Test1",      "autorisiert-durch": "SYSTEM",      "unix": 1604400036,      "transaktionsart": "Lohnzahlung"    },    "1604406781759-8437": {      "betrag": 85.17,      "von/an": "Test2",      "autorisiert-durch": "SYSTEM",      "unix": 1604406782,      "transaktionsart": "überweisung"    },    "1604395596115-5983": {      "betrag": 1226.48,      "von/an": "Test3",      "autorisiert-durch": "SYSTEM",      "unix": 1604395596,      "transaktionsart": "überweisung"    }  },  "kontonummer": "DEF05487151498683",  "kontostand": 44641548.66,  "success": true}但是當(dāng)我嘗試運行代碼時,我得到“找不到匹配的記錄”。如何將這樣的 json 數(shù)據(jù)獲取到表中?
查看完整描述

1 回答

?
jeck貓

TA貢獻(xiàn)1909條經(jīng)驗 獲得超7個贊

可以觀察到的是,您不知道密鑰,因為它是動態(tài)的。您可以做的是進(jìn)行 ajax 調(diào)用并獲取變量中的數(shù)據(jù)。現(xiàn)在您必須平坦響應(yīng),以便可以將平坦數(shù)組傳遞到 Bootstrap 表。您不使用data-url屬性,而是遵循 fiddle 中給出的過程


我添加了一個小提琴,您可以將其用作示例。我還添加了適當(dāng)?shù)脑u論。


超文本標(biāo)記語言


<link href="https://unpkg.com/bootstrap-table@1.18.0/dist/bootstrap-table.min.css" rel="stylesheet">


<script src="https://unpkg.com/bootstrap-table@1.18.0/dist/bootstrap-table.min.js"></script>


<table id="table">

  <thead>

    <tr>

      <th data-field="betrag">betrag</th>

      <th data-field="autorisiert-durch">autorisiert-durch</th>

      <th data-field="unix">unix</th>

    </tr>

  </thead>

</table>

你的腳本應(yīng)該是


<script>

var $table = $('#table')


  $(function() {

  

  // do an ajax call here to get the response. your response should be like responseData

  

  var responseData = {

    "1604400036082-3450": {

        "betrag": -367.5,

        "von/an_uuid": "asdqwe2413",

        "von/an": "Test1",

        "autorisiert-durch": "SYSTEM",

        "unix": 1604400036,

        "transaktionsart": "überweisung"

        },

    "1604406781759-8437": {

        "betrag": 85.17,

        "von/an": "Test2",

        "autorisiert-durch": "SYSTEM",

        "unix": 1604406782,

        "transaktionsart": "überweisung"

        },

    };

  

  var data = [];

  

  // Here you have to flat the array

  Object.keys(responseData).forEach(function(key){ 

  

  var value = responseData[key]; 

  data.push(value);

  })

    $table.bootstrapTable({data: data})

  })

  

  </script>

如果您需要此代碼的 ajax 版本,請告訴我。

小提琴http://jsfiddle.net/8ngoh4y1/


查看完整回答
反對 回復(fù) 2023-07-14
  • 1 回答
  • 0 關(guān)注
  • 208 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號