webix datatable列賢明な行に賢明

Question

私は行方向に表示したいが、私はその方法でそれを表示する方法を見つけることができませんwebixで問題に直面している私は列の賢明なデータベースデータはjson形式に変換されました。ここでは、コードsnipetがある、plsは私にいくつかの提案

<script type="text/javascript"> 
 
     webix.ajax("datacon.php", function(text, incomingData){ 
 
      //text = '{ some :"abc"}' 
 
      var data=incomingData.json(); 
 

 

 

 
      webix.ui({ 
 
       container: "box", 
 
       rows:[ 
 
        {view:"template", type:"header", template: "some text"}, 
 
        {view: "datatable", data: data, height: 300, 
 
         columns:[ 
 
          {id:"date", header:"Date"}, 
 
          {id:"ob", header:"OB"}, 
 
          {id:"ore", header:"ORE"}, 
 
          {id:"stratio", header:"Stripping Ratio"} 
 
         ] 
 
        } 
 

 
       ] 
 
      });

Answer 1

を与える実際にあなたのコードは正常に動作していません。スニペットのエラーを確認してください。

また、上記のコードでは、 "view：datatable/list/tree"またはこれらのいずれかのビュータイプについて言及する必要があります。変更を加えて元に戻ります。

webix DataTableでは、1行を追加することはできません。印刷パターンに従ってデータを書き込む必要があります。

は、ここであなただけのそれぞれのデータタグを使用して "ID" と一致する必要がwebix

<script src="https://cdn.webix.com/edge/webix.js"></script> 
 
<link rel="stylesheet" type="text/css" href="https://cdn.webix.com/edge/webix.css"> 
 

 
<script> 
 
var datatable = webix.ui({ 
 
    view:"datatable", 
 
    columns:[ 
 
     { id:"rank", header:"",    width:50}, 
 
     { id:"title", header:"Film title", width:200}, 
 
     { id:"year", header:"Released",  width:80}, 
 
     { id:"votes", header:"Votes",   width:100} 
 
    ], 
 
    data: [ 
 
     { id:1, title:"The Shawshank Redemption", year:1994, votes:678790, rank:1}, 
 
     { id:2, title:"The Godfather", year:1972, votes:511495, rank:2} 
 
    ] 
 
}); 
 
</script>

からのDataTableの簡単な例です。列の節に記載されているIDは、データファイルの「キー」と同じである必要があります。また、列のタイトルは、 "header"パラメータを使用して設定されます。

これらは、webixを使用した高速開発に役立つツールの一部です。

1. https://webix.com/skin-builder/?utm_source=newsletter&utm_medium=email&utm_campaign=3_free_tools_to_create_awesome_apps&utm_term=2017-09-26

2. https://webix.com/form-builder/?utm_source=newsletter&utm_medium=email&utm_campaign=3_free_tools_to_create_awesome_apps&utm_term=2017-09-25