DataSourceLoadOptionsExtensions.ConvertToGetRequestUri(DataSourceLoadOptionsBase, String) Method

Generates a GET request URI with parameters based on the specified data loading options.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v21.1.dll

Declaration

public static string ConvertToGetRequestUri(
    this DataSourceLoadOptionsBase options,
    string actionPath
)

Parameters

Name Type Description
options DevExtreme.AspNet.Data.DataSourceLoadOptionsBase

A DataSourceLoadOptionsBase object that should be converted to parameters of a GET request URI.

actionPath String

An URI to which a request should be sent.

Returns

Type Description
String

A GET request URI with parameters.

Remarks

The ConvertToGetRequestUri extension method helps you bind DevExpress Blazor components to a Web API service. The following table lists supported components.

Component

Property

DxDataGrid<T>

CustomData

DxComboBox<TData, TValue>

CustomData

DxDataGridComboBoxColumn<T>

CustomData

DxListBox<TData, TValue>

CustomData

Assign the data source type to the component’s T parameter and specify the CustomData property’s delegate that asynchronously loads data from a Web API service. This delegate accepts a DataSourceLoadOptionsBase object as a parameter. Call the ConvertToGetRequestUri extension method to generate a GET request URI with parameters based on the accepted data loading options.

The following example demonstrates how to bind the Data Grid and its combobox columns to a Web API service.

@using DevExtreme.AspNet.Data
@using DevExtreme.AspNet.Data.ResponseModel
@using System.Threading
@using System.Threading.Tasks
@using System.Net.Http
@using System.Text.Json

<DxDataGrid T="@WebApiOrder" CustomData="@LoadOrderData">
    <Columns>
        <DxDataGridComboBoxColumn T="@(WebApiCustomerLookup)" TextFieldName="Text" ValueFieldName="Value"
                                  CustomData="@LoadCustomerData" Field="@nameof(WebApiOrder.CustomerID)" />
        <DxDataGridDateEditColumn Field="@nameof(WebApiOrder.OrderDate)" />
        <DxDataGridSpinEditColumn Field="@nameof(WebApiOrder.Freight)" />
        <DxDataGridColumn Field="@nameof(WebApiOrder.ShipCountry)" />
        <DxDataGridComboBoxColumn T="@(WebApiShipperLookup)" TextFieldName="Text" ValueFieldName="Value"
                                  CustomData="@LoadShipmentData" Field="@nameof(WebApiOrder.ShipVia)" />
    </Columns>
</DxDataGrid>

@code {
    [Inject] protected HttpClient Client { get; set; }

    public class WebApiOrder {
        public string CustomerID { get; set; }
        public DateTime OrderDate { get; set; }
        public decimal Freight { get; set; }
        public string ShipCountry { get; set; }
        public int ShipVia { get; set; }
    }

    public class WebApiCustomerLookup {
        public string Text { get; set; }
        public string Value { get; set; }
    }

    public class WebApiShipperLookup {
        public string Text { get; set; }
        public int Value { get; set; }
    }

    protected async Task<LoadResult> LoadOrderData(DataSourceLoadOptionsBase options, CancellationToken cancellationToken)
    => await LoadCustomData("https://js.devexpress.com/Demos/NetCore/api/DataGridWebApi/Orders", options, cancellationToken);
    protected async Task<LoadResult> LoadCustomerData(DataSourceLoadOptionsBase options, CancellationToken cancellationToken)
        => await LoadCustomData("https://js.devexpress.com/Demos/NetCore/api/DataGridWebApi/CustomersLookup", options, cancellationToken);
    protected async Task<LoadResult> LoadShipmentData(DataSourceLoadOptionsBase options, CancellationToken cancellationToken)
        => await LoadCustomData("https://js.devexpress.com/Demos/NetCore/api/DataGridWebApi/ShippersLookup", options, cancellationToken);

    protected async Task<LoadResult> LoadCustomData(string dataEndpointUri, DataSourceLoadOptionsBase options, CancellationToken cancellationToken) {
        using var response = await Client.GetAsync(options.ConvertToGetRequestUri(dataEndpointUri), cancellationToken);
        response.EnsureSuccessStatusCode();
        using var responseStream = await response.Content.ReadAsStreamAsync();
        return await JsonSerializer.DeserializeAsync<LoadResult>(responseStream, cancellationToken: cancellationToken);
    }
}

LoadOptions GetRequestUri

Online Demo

Data Grid - Custom Data Binding

See Also