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.
Unfortunately, activation email could not send to your email. Please try again.

TreeGrid Refresh.

Thread ID:

Created:

Updated:

Platform:

Replies:

118206 Feb 11,2015 05:43 AM Aug 19,2015 05:48 AM ASP.NET MVC 5
loading
Tags: TreeGrid
Andrea Perazzolo
Asked On February 11, 2015 05:43 AM

Hi,
I am in need to reload data on a TreeGrid after a Post Operation based on a parameter.
I tried with this code, that is on the Change Enevt of a DropdonList

function onCustomerChange(args) {
    var ddlCustomer = $("#IdCustomer").data("ejDropDownList");
    var curCutomerId = ddlCustomer.getSelectedValue();
 
    var objData = { idCustomer: curCutomerId };
    var str = JSON.stringify(objData);
    $.ajax({
        type: "POST",
        contentType: "application/json",
        url: "@Url.Action("GetCustomerProjects""Customer")",
        data: str
    })
.done(function (data) {
    alert(data.success);
    var grid = $("#TreeGridContainer").data("ejTreeGrid");
    grid.dataSource = data.data;
 
    //onClose();
})
.fail(function (data) {
    alert("error");
})
.always(function () {
    //alert("finished");
});
 
 
}
I noticed that there is no methods like "refreshCOntent" as in the Grid.
How can I perform this operation?

    Thanks in advance


   Andrea Perazzolo

P.S. I am using the Unobtrusive Support.


John Rajaram [Syncfusion]
Replied On February 12, 2015 07:05 AM

Hi Andrea,

Thanks for using Syncfusion products.

We have referred your code snippets. We request you to assign the values for data source as like as following code snippets, instead of “grid.dataSource = data.data;” to reload the data on the TreeGrid.

Code snippets:

//...

treeObject = $("#Tree").data("ejTreeGrid");

//...

treeObject.setModel({ dataSource: projectData });

Please refer the following code snippets for more details.

Code snippets:

<body style="position: static; margin: 0px; padding: 2px">

    <div class="ctrllabel">

        Datasource

    </div>

    <br />

    @(Html.EJ().DropDownList("Datasource").TargetID("dataList").Value("DataSource 1").Width("150px").ClientSideEvents(e => e.Change("onChange")))

    <div id="dataList">

        <ul>

            <li>DataSource 1</li>

            <li>DataSource 2</li>

        </ul>

    </div>

    <br />

    @(Html.EJ().TreeGrid("Tree")

       //...

     .Datasource((System.Collections.IEnumerable)ViewBag.datasource)

       )

    @(Html.EJ().ScriptManager())

    <script>

    //...

         function onChange(args) {

            treeObject = $("#Tree").data("ejTreeGrid");

            if (args.text === "DataSource 1") {

              

                treeObject.setModel({ dataSource: projectData });

            }

            if (args.text === "DataSource 2") {

              

                treeObject.setModel({ dataSource: datas });

            }

        }

    </script>

</body>

We have prepared a sample for reloading the data source. Please find the sample in the following location.

Sample: http://www.syncfusion.com/downloads/support/directtrac/118206/TreeGridSampleMVC_ReloadDatasource114115127.zip

Please let us know if you need more information on this.

Regards,
John. R



Pankaj Chatterjee
Replied On August 18, 2015 12:24 AM

Hi I am trying the sample provided. It works find when the data is created as an JS array at the client side, however when I  try and go the server side, I am not getting desired result

The server side I am using to return as JsonConvert.SerializeObject(myarray) to convert the List<T> to a Json string and return to the client. The string being returned is in the format 
"[{"FkId":4,"PkId":2,"Name":"NIT Documents"},{"FkId":4,"PkId":3,"Name":"RFP"}]"

But I cannot bind this to the TreeGrid.

Can you tell me why?

regards
Pankaj


Mahalakshmi Karthikeyan [Syncfusion]
Replied On August 18, 2015 08:09 AM

Hi Pankaj,

Thanks for using Syncfusion product,

For your kind information, we were unable to reproduce the issue you have reported. We can able to serialize the data in server side and also we can populate those data to the TreeGrid. Please refer the below code snippet to achieve this.

[CS]

namespace TreeGridSample.Controllers {

    public class TreeGridController: Controller {

        //…

        [HttpPost()]

        public string CustomerData() {

            var DataSource = TreeGridDefaultData.GetMethodData();

            var datasource = JsonConvert.SerializeObject(DataSource);

            return datasource;

        }

        public class TreeGridDefaultData {

            public static List < DefaultData > GetMethodData() {

                //…

            }

        }

    }

}


[CSHTML]

<button id="loadDataSource"> New Data Source</button>

    @(Html.EJ().TreeGrid("TreeGridContainer"). //… )

    <script type="text/javascript">

        $("#loadDataSource").click(function () {

            $.ajax({

                type: "POST",

                url: "/TreeGrid/CustomerData",

                dataType: "json"

            }).done(function (data) {

                var grid = $("#TreeGridContainer").data("ejTreeGrid");

                grid.setModel({dataSource: data});

            })

        });

    </script>

  </body>

Here we have changed the TreeGrid data source in the button click event which was serialized and returned from the server using AJAX post method.

We have also prepared a sample based on this and you find the sample under the following location.

Sample: http://www.syncfusion.com/downloads/support/forum/118206/ze/Serialize906535915

Is this your requirement or else please get back us by modifying this sample along with the replication procedure.

And please let us know if you need further assistance on this.

Regards,

Mahalakshmi K.


Pankaj Chatterjee
Replied On August 18, 2015 12:06 PM

Hi Mahalakshmi,

Thanks for the update. Actually the problem was on my end. I was returning a JsonResult and within the function serialising the object, which is not required...

        [HttpPost]

        public JsonResult CustomerData()

        {

            var DataSource = TreeGridDefaultData.GetMethodData();

            //var datasource = JsonConvert.SerializeObject(DataSource);

            return Json(DataSource, JsonRequestBehavior.DenyGet);


        }


If I return the Array object directly without serialisation, then the method works fine.

Thanks for the help.

Pankaj 
 


Mahalakshmi Karthikeyan [Syncfusion]
Replied On August 19, 2015 05:48 AM

Hi Pankaj,

Thanks for the update.

We glad to know that your issue has been resolved.

Please let us know if you need further assistance on this.

Regards,

Mahalakshmi K.


CONFIRMATION

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.

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.

;