Firing cancel on client side

1 posts, 0 answers
  1. Diego
    Diego avatar
    7 posts
    Member since:
    Mar 2008

    Posted 02 May 2018 Link to this post

    Hi telerik team:

    I want to cancel editing on client side without running "OnCommand" event, because NeedDataSource rebind current grid data.

    How can I acomplish that functionality?

    Attached is the issue I'm seeing. How could I run "Cancel" editing grid on client side, outside "OnCommand" event?

     
                    <telerik:RadGrid RenderMode="Lightweight" ID="grdPTOPlanItemRates" GridLines="None" runat="server" AllowAutomaticDeletes="false" OnNeedDataSource="grdPTOPlanItemRates_NeedDataSource"
                        AllowAutomaticInserts="false" PageSize="10" Skin="Outlook"
                        AllowAutomaticUpdates="false" AllowPaging="True"
                        AutoGenerateColumns="False">
                        <MasterTableView CommandItemDisplay="Top" DataKeyNames="PTOPlanItemRateId" ClientDataKeyNames="PTOPlanItemRateId" NoDetailRecordsText="No PTO Plan Item Rates Records to display"
                            NoMasterRecordsText="No PTO Plan Item rates records were found" CommandItemSettings-AddNewRecordText="Add New" CommandItemSettings-ShowSaveChangesButton="false" CommandItemSettings-ShowCancelChangesButton="false" CommandItemSettings-ShowRefreshButton="false"
                            HorizontalAlign="NotSet" EditMode="Batch" AutoGenerateColumns="False">
                            <BatchEditingSettings EditType="Row" />
                            <Columns>
                                  <telerik:GridButtonColumn ConfirmText="Delete this row?" ConfirmDialogType="RadWindow"
                                    ConfirmTitle="Delete" HeaderText="" HeaderStyle-Width="50px"
                                    CommandName="Delete" Text="Delete" UniqueName="DeleteColumn">
                                </telerik:GridButtonColumn>
                                <telerik:GridBoundColumn UniqueName="PTOPlanItemRateId" Visible="false" DataField="PTOPlanItemRateId"></telerik:GridBoundColumn>
                                <telerik:GridBoundColumn DataField="Rate" HeaderStyle-Width="70px" HeaderText="Rate" SortExpression="Rate"
                                    UniqueName="Rate">
                                    <ColumnValidationSettings EnableRequiredFieldValidation="true">
                                        <RequiredFieldValidator ForeColor="Red" Text="*This field is required" Display="Dynamic">
                                        </RequiredFieldValidator>
                                    </ColumnValidationSettings>
                                </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn DataField="StartYear" HeaderStyle-Width="70px" HeaderText="Start Year" SortExpression="StartYear"
                                    UniqueName="StartYear">
                                    <ColumnValidationSettings EnableRequiredFieldValidation="true">
                                        <RequiredFieldValidator ForeColor="Red" Text="*This field is required" Display="Dynamic">
                                        </RequiredFieldValidator>
                                    </ColumnValidationSettings>
                                </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn DataField="EndYear" HeaderStyle-Width="70px" HeaderText="End Year" SortExpression="EndYear"
                                    UniqueName="EndYear">
                                    <ColumnValidationSettings EnableRequiredFieldValidation="true">
                                        <RequiredFieldValidator ForeColor="Red" Text="*This field is required" Display="Dynamic">
                                        </RequiredFieldValidator>
                                    </ColumnValidationSettings>
                                </telerik:GridBoundColumn>
                              
                            </Columns>
                        </MasterTableView>
                        <ClientSettings AllowKeyboardNavigation="true">
                            <ClientEvents />

                        </ClientSettings>
                    </telerik:RadGrid>

      <table width="100%" border="0" cellpadding="0" cellspacing="0">
                            <tr>
                                <td>
                                    <a href="#" onclick="javascript: SavePTOPlanItemRates();" class="button primary">Save</a>
                                     <a href="#" onclick="javascript: CancelChanges();" class="button primary">Cancel Changes</a>
                                </td>
                            </tr>
                        </table>

     

    <script>

    function OpenPTOPlanItemRates(payTypeId) {
        var exitFlag = false;
        currentPayTypeId = payTypeId;

        $.ajax({
            type: "POST",
            url: "ConfigurationHandler.ashx?w=getPTOPlanItemRates&PTOPlanId=" + currentPTOPlanId + "&PayTypeId=" + payTypeId,
            async: false,
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                alert('Error:' + textStatus);
                alert('Error:' + errorThrown);
            },
            success: function (data, textStatus, XMLHttpRequest) {
                if (data != 'undefined')
                {
                    if (data.length > 0) {
                        if (data == "logout") {
                            exitFlag = true;
                        }
                        else {
                            $("#divPTOPlanItemRates").dialog({
                                autoOpen: true,
                                title: "Add/Edit PTO Plan Item Rates",
                                width: "600px",
                                modal: true
                            });
                            updateGridPTOPlanItemRates(data);
                        }
                    }
                    else {
                        //
                        alert("No data");
                    }
                }
             
            }
        });

        if (exitFlag) {
            parent.location = "Login.aspx";
            return false;
        }   
    }

    function updateGridPTOPlanItemRates(data) {
        //var data = [{ "ID": "1", "Rate": "1", "StartYear": "1998", "EndYear": "1999" }, { "ID": "2", "Rate": "2", "StartYear": "2005", "EndYear": "20018" }];
        var masterTableView = $find("<%= grdPTOPlanItemRates.ClientID %>").get_masterTableView();
        if (data != null) {
            var list = JSON.parse(data);
            masterTableView.set_dataSource(list.PTOPlanItemRatesList);
            masterTableView.dataBind();
        }
        else {
            //rebind with no data
            masterTableView.set_dataSource([]);
            masterTableView.dataBind();
        }
    }


            function CancelChanges()
            {
                OpenPTOPlanItemRates(currentPayTypeId);
            }

        function SavePTOPlanItemRates()
        {
              var grid = $find('<%=grdPTOPlanItemRates.ClientID%>');
                var masterView = grid.get_masterTableView();
                var jsonArr = [];
                var row = null;
                var recordsCount = masterView.get_dataItems().length;
                for (var i = 0; i < recordsCount; i++) {
                    row = masterView.get_dataItems()[i];
                    jsonArr.push({
                        rate: row.get_cell('Rate').innerText,
                        startYear: row.get_cell('StartYear').innerText,
                        endYear: row.get_cell('EndYear').innerText,

                    });
                }
                SavePTOIRChangesAjaxCall(jsonArr, recordsCount);
        }

        function SavePTOIRChangesAjaxCall(oData, recordsCount)
        {
            var exitFlag = false;
            var saved = false;

                $.ajax({
                    type: "POST",
                    url: "ConfigurationHandler.ashx?w=SavePTOItemRates&PTOPlanId=" + currentPTOPlanId + "&PayTypeId=" + currentPayTypeId + "&RecordsCount=" + recordsCount,
                    async: false,
                    data: "data=" + JSON.stringify(oData),
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        alert('' + textStatus);
                        alert('' + errorThrown);
                    },
                    success: function (data, textStatus, XMLHttpRequest) {
                        //$("#status img").hide();
                        if (data.length > 0) {
                            if (data == "logout") {
                                exitFlag = true;
                            }
                            else {
                                   saved = true;
                            }
                        }                   
                    }
                });
                
                if (exitFlag) {
                    parent.location = "Login.aspx";
                    return false;
                }

                if (saved)
                {
                    alert('PTO Plan Item Rates were succesfully saved.');
                }
        }
    </script>

     

     

Back to Top