TreeView (Checkbox) not showing any data

Thread ID:	Created:	Updated:	Platform:	Replies:
146642	Aug 12,2019 01:42 PM UTC	Aug 13,2019 11:50 AM UTC	ASP.NET MVC - EJ 2	1

Subscribe to this post

Tags: Treeview

Craig Morgan

Asked On August 12, 2019 01:42 PM UTC

Hi, this is my first attempt at using a Syncfusion control and so far I am failing.

I am trying to use a TreeView control with Checkboxes.

I am passing an object of type TreeViewFieldsSettings to the view (based on the example project) which contains a list of objects (the DataSource) with my data.

I can see during debug that the data is getting to the view, but no data is being displayed.

Here is my partial view :-

@using Syncfusion.EJ2.Navigations

@using Syncfusion.EJ2

@model TreeViewFieldsSettings

Layout = "~/Areas/MNT/Views/Shared/_Layout.cshtml";

}

@Html.EJS().TreeView("CheckBox").ShowCheckBox(true).Fields(ViewBag.CheckBoxModel).Render()

</div>

<tbody>

<tr>

@Html.EJS().CheckBox("select").Checked(true).Label("Auto Check").Change("onChange").Render()

</div>

</td>

</tr>

</tbody>

</table>

</div>

@*custom code start*@

<style>

.control_wrapper {

max-width: 500px;

margin: auto;

border: 1px solid #dddddd;

border-radius: 3px;

}

@@media screen and (max-width: 768px) {

.treeview-control-section {

margin: 0;

}

</style>

@*custom code end*@

Here is the code from the controller where I am setting the TreeViewFieldsSettings object.

public ActionResult Index()

{

TreeViewFieldsSettings CheckBoxModel = new TreeViewFieldsSettings();

// set up a list of sites

List<naSite> sites = new List<naSite>();

sites = GetSites(sites).OrderBy(x => x.SiteName).ToList();

// Use the sites to build a list of type TreeviewModel and use as the DataSource

CheckBoxModel.DataSource = BuildTreeview(sites);

CheckBoxModel.HasChildren = "HasChild";

CheckBoxModel.Expanded = "Expanded";

CheckBoxModel.Id = "Id";

CheckBoxModel.ParentID = "PId";

CheckBoxModel.Text = "Name";

return View("index", CheckBoxModel);

}

When I run the project I just get a single text box on the page.

Hoping you can see where I am going wrong. Thanks.

Reply | Reply with quote

Ashokkumar Balasubramanian [Syncfusion]

Replied On August 13, 2019 11:50 AM UTC

Hi Craig Morgan,

Good day to you.

We have checked your code snippet and prepared a sample based on the requirement. If you are rendering any Syncfusion components via partial view, you need to include @Html.EJS().ScriptManager() in your partial view page. We have rendered TreeView in partial view using the following code snippet.

@Html.Action("DisplayOpenResults1", "Home")

</div>

public ActionResult DisplayOpenResults1()

{

var tree = treedata.GetTree();

checkboxfields.DataSource = tree;

checkboxfields.HasChildren = "HasChild";

checkboxfields.Expanded = "Expanded";

checkboxfields.Id = "Id";

checkboxfields.ParentID = "PId";

checkboxfields.Text = "Name";

ViewBag.checkboxfields = checkboxfields;

return PartialView("PartialPage");

}

@Html.EJS().TreeView("checkbox").ShowCheckBox(true).Fields(ViewBag.checkboxfields).Render()

</div>

<tbody>

<tr>

@Html.EJS().CheckBox("select").Checked(true).Label("Auto Check").Change("onChange").Render()

</div>

</td>

</tr>

</tbody>

</table>

</div>

function onChange(args) {

var treeObj = document.getElementById('checkbox').ej2_instances[0];

treeObj.autoCheck = args.checked;

}

</script>

@Html.EJS().ScriptManager()

Note: Kindly ensure whether you have mapped TreeView fields properly

Sample:

https://www.syncfusion.com/downloads/support/forum/146642/ze/PartialTree625065695 

Please check the above sample and get back to us if you need any further assistance.

Regards,

Ashokkumar B.

Reply | Reply with quote

TreeView (Checkbox) not showing any data

Thread ID:

Created:

Updated:

Platform:

Replies:

Please sign in to access our forum

CONTACT US