We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

TreeView working With ModelView

Thread ID:





143893 Apr 9,2019 03:13 PM UTC Apr 10,2019 01:25 PM UTC ASP.NET Core - EJ 2 1
Tags: TreeView
Maria Sandoval
Asked On April 9, 2019 03:13 PM UTC

I wonder if Razor TreeVew can Work with ModelView to pass data to control without AJAX POST only with form ajax Submit or maybe

Example I got from your Help

function getCheckedNodes() {
            //create an instance from an existing TreeView.
            // only after control creation you can get treeObj otherwise it throws exception.
            var tree = $("#treeView").data('ejTreeView');
            var obj = $("#treeView").ejTreeView('instance');
            //to get TreeView data
            var data = obj.getTreeData();
            //to get checkednodes
            var checkedNodes = obj.getCheckedNodes();
                url: "@Url.Action("GetCheckedNodes", "Home", null)",
                data: JSON.stringify( { data: checkedNodes }),
                type: "POST",
                contentType: "application/json; charset=utf-8",
                dataType: "json"

How I'm Working with MVC and ViewModels :

<form id="frmUsuario" class="form-horizontal" asp-controller="Usuario" asp-action="Post" autocomplete="off" data-ajax="true" data-ajax-method="POST"
                      data-ajax-success="fnSuccess(data)" data-ajax-failure="fnFailure()">
                      <div class="col-xs-4 col-sm-4 col-lg-4 col-md-4">
                                    <div class="e-input-group">
                                        <input class="e-input" id="nombre_usuario" asp-for="nombre_usuario" placeholder="Nombre Usuario" type="text">

Thanks in advance for your help I hope there is a way to interact with the Model and the controller, cause I would like to use that with the Grid Too.
waiting for your comments, regards.

Christopher Issac Sunder K [Syncfusion]
Replied On April 10, 2019 01:25 PM UTC

Hi Maria, 

Thank you for contacting Syncfusion support. 

You can pass data to control without AJAX POST, but only with form ajax Submit. We have prepared a sample for your reference. 

// View part 
<form id="frmUsuario" class="form-horizontal" asp-controller="MyCal" asp-action="GetValues" autocomplete="off" data-ajax="true" data-ajax-method="POST" 
      data-ajax-success="fnSuccess(data)" data-ajax-failure="fnFailure()"> 
    <ejs-treeview id="treedata" name="treedata" showCheckBox="true" loadOnDemand="false"> 
        <e-treeview-fields dataSource="Model.DataSource" id="Id" parentId="PId" text="Name" hasChildren="HasChild" expanded="expanded"></e-treeview-fields> 
    <br /> 
    <label for="art"> Enter the node id to be checked: </label> 
    <input id="art" class="e-input" type="text" name="art" /> 
    <br /> 
    <input type="submit" id="button" value="Submit" /> 

// Controller part 
public IActionResult GetValues() 
    string value = HttpContext.Request.Form["art"]; 
    ViewBag.Result = value; 
    return Json(value); 

// After ajax succeeded 
function fnSuccess(data) { 
    data = data.split(",") 
    var treeView = document.getElementById('treedata').ej2_instances[0]; 

In the sample, the node id entered in the textbox will get checked after form submit. 
Note: To view the demo List.cshtml file type in URL ‘http://localhost‌‌‌:[Your Port]/MyCal/Lists’ 

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



This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon