Set authorization for client side databinding

4 posts, 0 answers
  1. Nick
    Nick avatar
    1 posts
    Member since:
    Feb 2017

    Posted 20 Feb 2018 Link to this post

    Is there a way to submit an authorization header with the ajax request on the client data bind? I cant seem to find anything that would allow me to do something like this

     

     
     
     <script type="text/javascript">
                        //<![CDATA[
                        function ParameterMap(sender, args) {
                            //If you want to send a parameter to the select call you can modify the if
                            //statement to check whether the request type is 'read':
                            //if (args.get_type() == "read" && args.get_data()) {
                            if (args.get_type() != "read" && args.get_data()) {
                                args.set_parameterFormat({ customersJSON: kendo.stringify(args.get_data().models) });
                            }
                        }
     
                        function Parse(sender, args) {
                            var response = args.get_response().d;
                            if (response) {
                                args.set_parsedData(response.Data);
                            }
                        }
     
                        function UserAction(sender, args) {
                            if (sender.get_batchEditingManager().hasChanges(sender.get_masterTableView()) &&
                                !confirm("Any changes will be cleared. Are you sure you want to perform this action?")) {
                                args.set_cancel(true);
                            }
                        }
        //]]>
    </script>
    <telerik:RadFormDecorator RenderMode="Lightweight" runat="server" DecorationZoneID="grid" DecoratedControls="All" EnableRoundedCorners="false" />
              <telerik:RadGrid RenderMode="Lightweight" ID="RadGrid1" runat="server" ClientDataSourceID="RadClientDataSource1" AllowPaging="true" AllowSorting="true" >
                <MasterTableView ClientDataKeyNames="CustomerID" CommandItemDisplay="Top" BatchEditingSettings-HighlightDeletedRows="true">
                    <CommandItemSettings ShowAddNewRecordButton="false" />
                    <Columns>
                        <telerik:GridBoundColumn DataField="Datetime" HeaderText="Customer ID" ReadOnly="true">
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="PlantName" HeaderText="Company Name" ColumnEditorID="GridTextBoxEditor">
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="MachinName" HeaderText="Contact Name" ColumnEditorID="GridTextBoxEditor">
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn DataField="MachineID" HeaderText="Contact Title" ColumnEditorID="GridTextBoxEditor">
                        </telerik:GridBoundColumn>
     
                    </Columns>
                </MasterTableView>
                <ClientSettings>
                <DataBinding Location="http://localhost:2036/api/sample/" SelectMethod="100TEST" SortParameterType="Linq" FilterParameterType="Linq">
                </DataBinding>
                    <ClientEvents OnUserAction="UserAction" />
                </ClientSettings>
            </telerik:RadGrid>
        </div>
        <telerik:GridTextBoxColumnEditor ID="GridTextBoxEditor" runat="server" TextBoxStyle-Width="230px"></telerik:GridTextBoxColumnEditor>
        <telerik:RadClientDataSource ID="RadClientDataSource1" runat="server" AllowBatchOperations="true">
            <ClientEvents OnCustomParameter="ParameterMap" OnDataParse="Parse" />
         <%--   <DataSource>
                <WebServiceDataSourceSettings BaseUrl="http://localhost:2036/api/sample/">
                    <Select Url="100TEST" DataType="JSON" />
                    <Update Url="UpdateCustomers" DataType="JSON" />
                    <Insert Url="InsertCustomers" DataType="JSON" />
                    <Delete Url="DeleteCustomers" DataType="JSON" />
                </WebServiceDataSourceSettings>
            </DataSource>--%>
            <Schema>
                <Model ID="CustomerID">
                    <telerik:ClientDataSourceModelField FieldName="Datetime" DataType="String"  />
                    <telerik:ClientDataSourceModelField FieldName="PlantName" DataType="String" />
                    <telerik:ClientDataSourceModelField FieldName="MachinName" DataType="String" />
                    <telerik:ClientDataSourceModelField FieldName="MachineID" DataType="String" />
                </Model>
            </Schema>
        </telerik:RadClientDataSource>
  2. Peter Milchev
    Admin
    Peter Milchev avatar
    858 posts

    Posted 30 May 2018 Link to this post

    Hello Nick,

    The Add authentication request headers with ClientDataSource KB article demonstrates how to add custom headers to the requests from the ClientDataSource. 

    var $ = $ || $telerik.$;
    var old_mapTransport = Telerik.Web.UI.RadClientDataSource.prototype._mapTransport;
     
    Telerik.Web.UI.RadClientDataSource.prototype._mapTransport = function () {
        var transport = old_mapTransport.call(this);
     
        transport.read.beforeSend = beforeSendHandler;
        transport.create.beforeSend = beforeSendHandler;
        transport.update.beforeSend = beforeSendHandler;
        transport.destroy.beforeSend = beforeSendHandler;
     
        return transport;
    }
     
    function beforeSendHandler(xhr) {
        xhr.setRequestHeader('customheader', 'custom header value');
    }

    Regards,
    Peter Milchev
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Stefan
    Stefan avatar
    1 posts
    Member since:
    Aug 2018

    Posted 08 Sep in reply to Peter Milchev Link to this post

    Hi Peter, I am having the same issue but I am using the binding directly in the RadGrid:

    <telerik:RadGrid RenderMode="Lightweight" ID="rgAdvanced" CssClass="grid" runat="server" GridLines="None" Height="300px" AllowAutomaticUpdates="true" 
    ShowHeader="false" AllowMultiRowSelection="true">
    <MasterTableView TableLayout="Fixed" ClientDataKeyNames="ChoiceText" CommandItemDisplay="None" HierarchyDefaultExpanded="true">
    <Columns>
    <telerik:GridBoundColumn DataField="ChoiceText" ></telerik:GridBoundColumn>
    <telerik:GridBoundColumn DataField="ExplanationType" ></telerik:GridBoundColumn>
    <telerik:GridBoundColumn DataField="PromptMessage" ></telerik:GridBoundColumn>
    <telerik:GridCheckBoxColumn DataField="ExplanationMandatory" SortExpression="ExplanationMandatory" UniqueName="ExplanationMandatory" ></telerik:GridCheckBoxColumn>
    <telerik:GridCheckBoxColumn DataField="Attachment" SortExpression="Attachment" UniqueName="Attachment" ></telerik:GridCheckBoxColumn>
    <telerik:GridCheckBoxColumn DataField="AttachmentMandatory" SortExpression="AttachmentMandatory" UniqueName="AttachmentMandatory" ></telerik:GridCheckBoxColumn>
    </Columns>
    </MasterTableView>
    <ClientSettings AllowKeyboardNavigation="true" >
    <Selecting AllowRowSelect="true"></Selecting>
    <DataBinding Location="CorporateReportingContent.aspx" SelectMethod="GetListOfExplanation" EnableCaching="true" />
    <ClientEvents OnDataBinding="onRadGridDataBinding" OnRowSelected="onrgAdvancedRowSelected" OnRowClick="onRgAdvancedRowClick" ></ClientEvents>
    <Scrolling AllowScroll="true" UseStaticHeaders="true"></Scrolling>
    <Resizing AllowColumnResize="true" />
    </ClientSettings>
    </telerik:RadGrid>

     

    So the actual Telerik.Web.UI.RadClientDataSource doesn't exist when the method "OnDataBinding" gets executed.

    In this scenario, how would I set the header?

    Thanks,

     

    Stefan

     

  4. Peter Milchev
    Admin
    Peter Milchev avatar
    858 posts

    Posted 16 Oct Link to this post

    Hello Stefan,

    If Telerik.Web.U.RadClientDataSource does not exist, there is no ClientDataSource used in this scenario.

    With that said, I would suggest using a ClientDataSource instead of the built-in web service settings and then you would be able to leverage the ClientDataSource workaround. Here are some resources on the integration between ClientDataSource and RadGrid:

    Regards,
    Peter Milchev
    Progress Telerik

    Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Back to Top