如何在树节点jstree中存储多个值?

时间:2016-02-07 11:26:05

标签: jquery asp.net-mvc asp.net-mvc-4

我将以下属性传递给jstree

public class TVCVM
    {
        public String id { get; set; }
        public string @class { get; set; }
        public string parent { get; set; }
        public string text { get; set; }
        public string value { get; set; }
    }

在Action中假设我创建了以下数据

 [HttpGet]
        public JsonResult GetData()
        {
            var tvdata = new List<TVCVM>();
            tvdata.Add(new TVCVM { id = "n1", parent = "#", text = "Cardiology", value = "10", @class= "parentNode"});
            tvdata.Add(new TVCVM { id = "n2", parent = "#", text = "Physio", value = "11", @class = "parentNode" });
            tvdata.Add(new TVCVM { id = "n3", parent = "n2", text = "hassan", value = "100", @class = "childNode" });
            tvdata.Add(new TVCVM { id = "n4", parent = "n2", text = "Wick", value = "101", @class = "childNode" });

            return Json(tvdata, JsonRequestBehavior.AllowGet);
        }

当我编写js代码来绑定数据时

jstree({
                        "core": {
                            "data": data,
                            "themes": {
                                "url": true,
                                "icons": true,
                                "dots": true
                            },
                            'check_callback': true
                        },
                        "plugins": ["dnd"]
                    });

通过defualt将text属性分配给节点文本,并将值属性shold eb分配给该值。以下代码在js中生成ajax代码:

    $(document).ready(function () {
        $.ajax({
            url: 'Home/GetData',
            method: 'get',
            dataType: 'json',
            success: function (data) {
                $('#Div_jstree').on('select_node.jstree', function (event, data) {
                    console.log( $("#Div_jstree").jstree().get_selected(true)[0].text );
                    console.log(data);
                    var htmlta = '<br><div style="display:inline-block;" ' + 'id=div-' + data.studentid + '>' +
                        '<textarea style=width:100px;height:100px;visibility:visible;' + 'id=' + data.studentid + '>' + $("#Div_jstree").jstree().get_selected(true)[0].text
                         + ':</textarea>' +
                        '<input type="button" class="del" value="Close"' + 'id=' + data.id + ' /></div>';
                    $('#Div_txta').append(htmlta);

                    $(document).on('click', '.del', function () {
                        $(this).closest('div').remove();
                    });
                })
                .jstree({
                    "core": {
                        "data": data,
                        "themes": {
                            "url": true,
                            "icons": true,
                            "dots": true
                        },
                        'check_callback': true
                    },
                    "plugins": ["dnd"]
                });
            },
            error: function (x, y, z) {
                console.log('error');
            }
        });
    });
</script>

$('#Div_jstree').on('select_node.jstree', function (event, data) {...}数据应包含节点数据(即:text / value),但我想存储所有属性值 来自json "id, class, parent, text, value",我如何在节点中存储所有数据

0 个答案:

没有答案