DataSource Component

[Mark]

Is it possible to access the data client side for this control? 

 

https://demos.telerik.com/aspnet-mvc/datasource

 

The example code has a call to dataSource1.fetch();

I am trying to figure out how this works as datasource1 is declared using the razor syntax and isnt actually available in the script block (at least I can't get it to work)

Can someone help me figure this out or point me to an example that I can use for this that uses a datasource that isnt declared and accessed in the same block.

 

Thank for any help you guys can provide.

[Mark]

Here is an except from what I am trying to do.

 

<div class="col-6 k-content" id="regionData">
            <div id="regions">

            </div>
        </div>
        <script>
            function regionChange() {
                $("#regions").html(kendo.render(template, this.view())); // populate the table
            }
        </script>
        @(Html.Kendo().DataSource<RegionIndicationModel>()
              .Name("regionDataSource")
              .Ajax(datasource => datasource
                  .PageSize(15)
                  .Events(ev => ev.Change("regionChange"))
                  .Read(read => read.Action("GetRegionData", "Dashboard"))))
    </div>

 

<script id="template" type="text/x-kendo-template">
    <div class="row">
        <div class="col-3">#:RegionName#</div>
    </div>
</script>

 

and here is the onload function from my other script block that I can't figure out how they set the datasort.

window.onload = function () {
        var template = kendo.template($("#template").html());
        var dataSource = $("#regionDataSource");
        console.log("test");
        //console.log(dataSource);
        //console.log(template);
    }

 

 

 

 

 

[Konstantin Dikov]

Hello Mark,

The DataSource helper is using the Name property to create a variable in the global scope with that name, so in the context of your configuration, you can access the DataSource API directly with "regionDataSource":

window.onload = function () {
        var template = kendo.template($("#template").html());
        regionDataSource.fetch();

Note that with the other widgets, there is a DOM element used for getting reference to the API, but since the DataSource does not have such element, the approach differs. 

Hope this helps.


Regards,
Konstantin Dikov
Progress Telerik