Webix addRowCSS 实现

Question

我刚开始使用 HTML。我需要将它用于一个项目，而我根本没有接受过这方面的教育。这是我需要做的事情的细分。我需要一个文本框图（我已经为 webix 提供的其中一些添加了一些功能）并且我希望有允许我添加或删除行的按钮。我也在使用 webix datatable。这是我的按钮代码。目前，我只想在图表顶部添加一行。现在我只有添加行按钮。一旦我弄明白了这一点，我就可以轻松地进行删除。

    input type='button' class="sample_button" value='add row' onclick= grida.addRowCss(1, getElementById('grida').style.color = "black");

这是我的数据table代码。

    webix.ready(function(){
                    grida = webix.ui({
                        container:"testA",
                        view:"datatable",
                        columns:[
                        { id:"stage",editor:"text",         header:"Stage", width:150},
                        { id:"component",editor:"text",     header:"Component",width:200},
                        { id:"epic",editor:"text",          header:"Epic" , width:200},
                        { id:"engineering", editor:"text",  header:"Engineering", width:200, suggest:numSuggest},
                        { id:"design",  editor:"text",      header:"Design", width:200, suggest:numSuggest},
                        { id:"research",editor:"text",      header:"Research", width:200, suggest:numSuggest},
                        { id:"notes",   editor:"popup",     header:"Notes", width:200}
                        ],

                        editable:true,
                        autoheight:true,
                        autowidth:true,

                        data: [
                        {id: 1, stage:"Test 1", component:"Strategy", epic:"Design", engineering:2, design:0, research:0, notes: "This is a test"},
                        ]


                    });
                });

除了出现但什么都不做的按钮外，一切都正常。 这是 addRow webix 函数的 link。 http://docs.webix.com/api__ui.datatable_addrowcss.html

感谢任何帮助，尤其是因为我对此完全陌生。 谢谢

编辑 1：

谢谢你的回答。所以现在我像这样制作我的按钮（在脚本之前）

input type="button" value="Add row" onclick= 'add_row()'

table 和以前一样，但是我在 table 结束后包含了 add_row 函数。我将包含上下文

的 table 的最后一位

data: [
                    {id: 1, stage:"Test 1", component:"Strategy", epic:"Design", engineering:2, design:0, research:0, notes: "This is a test"}
                    ]
                });

                function add_row(){
                    grida.add({
                        stage:"Test 2", 
                        component:"Strategy", 
                        epic:"Design", 
                        engineering:2, 
                        design:0, 
                        research:0, 
                        notes: "This is a test"
                    },2)
                }

我也试过了

 

    $$("grida").add(...)

无济于事。该按钮在屏幕上，但不起作用。我想我正在做一些乱七八糟的事情，但我不确定是什么。

Answer 1

您需要使用 add 而不是代码段中的 addRowCss http://docs.webix.com/api__link__ui.datatable_add.html

• add 添加新行

• addRowCss 添加 css class 到行

  grida.add({ 阶段:"Test 2", 组件:"Second Component"})