How to give user defined alerts in controller if no record is selected

[Gomtesh]

I have used syncfusion grid using angularJS
But if i not selected any record and click on delete button of grid then alert is fired like
"No record is selected for delete operation" which is present in 'ej.web.all.min.js'
I have to remove this alert and want to define my own message in controller so is this possible???

[Prasanna Kumar Viswanathan]

Hi Gomtesh,

Thanks for contacting Syncfusion support.

Yes, it is possible. We have to display custom dialog by defining args.cancel as true in toolbarClick event of ejGrid . ToolbarClick event triggered when the toolbar item is clicked in Grid. In this event, we checked the condition that if the record is unselected and we used Ajax post and in success method we open the default alert box

Default alert from Syncfusion can be avoided by defining args.cancel as true.

Please refer to the following UG Documentation for toolbarClick event,

http://help.syncfusion.com/js/api/ejgrid#events:toolbarclick

Please find the following code example and sample,

<div ng-app="employeeView">

    <div ng-controller="GridCtrl">

        <div ej-grid id="Grid" e-width="500px" e-datasource="data" e-allowsorting="true" e-allowpaging="true" e-toolbarsettings-showtoolbar="true" e-toolbarsettings-toolbaritems="tools" e-editsettings-allowdeleting=' true' e-editsettings-allowediting='true' e-editsettings-allowadding='true' e-toolbarclick="toolbar">

            <div e-columns>

                <div e-column e-field="EmployeeID" e-headertext="Employee ID" e-isprimarykey="true" e-textalign="right"></div>

                <div e-column e-field="LastName" e-headertext="Last Name" e-textalign="right"></div>

                <div e-column e-field="FirstName" e-headertext="First Name" e-textalign="right"></div>

                <div e-column e-field="Title" e-headertext="Title" e-textalign="right"></div>

                <div e-column e-field="City" e-headertext="City" e-textalign="right"></div>

                <div e-column e-field="Country" e-headertext="Country" e-textalign="right"></div>

            </div>

        </div>

    </div>

</div>

<script>

    var obj = [

                  { "EmployeeID": 1, "LastName": "Davolio", "FirstName": "Nancy", "Title": "Sales Representative", "City": "Seattle", "Country": "USA" },

                  { "EmployeeID": 2, "LastName": "Fuller", "FirstName": "Andrew", "Title": "Vice President, Sales", "City": "Tacoma", "Country": "USA" },

                  { "EmployeeID": 3, "LastName": "Leverling", "FirstName": "Janet", "Title": "Sales Representative", "City": "Kirkland", "Country": "USA" },

                  { "EmployeeID": 4, "LastName": "Peacock", "FirstName": "Margaret", "Title": "Sales Representative", "City": "Redmond", "Country": "USA" },

                  { "EmployeeID": 5, "LastName": "Buchanan", "FirstName": "Steven", "Title": "Sales Manager", "City": "London", "Country": "UK" },

                  { "EmployeeID": 6, "LastName": "Suyama", "FirstName": "Michael", "Title": "Sales Representative", "City": "London", "Country": "UK" },

                  { "EmployeeID": 7, "LastName": "King", "FirstName": "Robert", "Title": "Sales Representative", "City": "London", "Country": "UK" },

                  { "EmployeeID": 8, "LastName": "Callahan", "FirstName": "Laura", "Title": "Inside Sales Coordinator", "City": "Seattle", "Country": "USA" },

                  { "EmployeeID": 9, "LastName": "Dodsworth", "FirstName": "Anne", "Title": "Sales Representative", "City": "London", "Country": "UK" },

                  { "EmployeeID": 10, "LastName": "Peacock", "FirstName": "Margaret", "Title": "Sales Representative", "City": "Redmond", "Country": "USA" },

                  { "EmployeeID": 11, "LastName": "Buchanan", "FirstName": "Steven", "Title": "Sales Manager", "City": "London", "Country": "UK" },

                  { "EmployeeID": 12, "LastName": "Suyama", "FirstName": "Michael", "Title": "Sales Representative", "City": "London", "Country": "UK" },

                  { "EmployeeID": 13, "LastName": "King", "FirstName": "Robert", "Title": "Sales Representative", "City": "London", "Country": "UK" },

                  { "EmployeeID": 14, "LastName": "Callahan", "FirstName": "Laura", "Title": "Inside Sales Coordinator", "City": "Seattle", "Country": "USA" },

                  { "EmployeeID": 15, "LastName": "Dodsworth", "FirstName": "Anne", "Title": "Sales Representative", "City": "London", "Country": "UK" },

                  { "EmployeeID": 16, "LastName": "Andreas", "FirstName": "James", "Title": "Sales Representative", "City": "Tacoma", "Country": "USA" }

    ];

    angular.module('employeeView', ['ejangular'])

        .controller('GridCtrl', function ($scope) {

            $scope.tools = ["add", "edit", "delete", "update", "cancel"];

            $scope.page = 2;

            $scope.data = obj;

            $scope.toolbar = function (args) {

               if (args.itemName == "Delete" && this.model.selectedRowIndex == -1){

                    args.cancel = true;

                    $.ajax({

                        type: 'GET',

                        url: '/Grid/Order',  

                        success: function (data) {

                            alert(data);

                        }

                    });

                }

        });

---------------------------------------------------------------------------------------------------------------------------

public string Order()

        {

            var data = "No records are selected";

            return data;

        }

 
Sample Link: http://www.syncfusion.com/downloads/support/forum/120756/ze/Sample14210395931016

Regards,
Prasanna Kumar N.S.V

[Gomtesh]

Hi Prasanna,
Thanks for replying your solution has been worked correctly.

[Prasanna Kumar Viswanathan]

Hi Gomtesh,
 
We are happy that the provided solution working fine at your end.
 
Regards,
Prasanna Kumar N.S.V