Как добавить функцию для столбца в событии клика syncfuison ejgrid? - PullRequest
0 голосов
/ 26 июня 2019

Я использую сетку syncfusion в своем проекте angular js, где я хочу разместить событие щелчка для запуска функции.

Я пробовал решение, указанное в этой ссылке https://www.syncfusion.com/kb/3767/how-to-place-hyperlink-in-grid-column

Мой фрагмент HTML-кода

<div id="OverAllOverDueDoc" ej-grid e-datasource="OverAllOverDueDocList"
                 e-allowfiltering="true"  e-allowpaging ="true"
                 e-filtersettings-filterType="excel">
    <div e-columns>
        <div e-column e-field="CompanyName" e-headertext="Company" e-tooltip="Company" e-width="80"></div>
        <div e-column e-field="PlantName" e-headertext="Plant" e-width="80"></div>
        <div e-column e-field="" e-headertext="Candidate Id" e-width="80"></div>
        <div e-column e-field="EmployeeCode" e-headertext="Employee Code" e-width="80"></div>
        <div e-column e-field="BudgetCode" e-headertext="Budget Code" e-width="80"></div>
        <div e-column e-field="EmployeeName" e-headertext="Employee Name" e-width="80"></div>
        <div e-column e-field="EmployeeCategory" e-headertext="Emp Category" e-tooltip="Employee Category" e-width="80"></div>
        <div e-column e-field="Designation" e-headertext="Designation" e-width="80"></div>
        <div e-column e-field="DOJ" e-headertext="DOJ" e-width="80" e-tooltip="Date of Join"></div>
        <div e-column e-field="TotalOverDueMandatory" e-headertext="Mandtatory" e-tooltip="Mandatory Document" e-width="80"></div>
        <div e-column e-field="TotalOverDueOptional" e-headertext="Optional" e-tooltip="Optional Document" e-width="80"></div>

    </div>
</div>

на рисунке выделены две колонки, каждая ячейка будет кликабельной

enter image description here

1 Ответ

0 голосов
/ 27 июня 2019

Поздравления от службы поддержки Syncfusion.

Запрос: я использую сетку syncfusion в своем угловом проекте js, где я хочу разместить событие щелчка для запуска функции.

Мы можем выполнить ваши требования, используя функцию шаблона столбца ejGrid.А с помощью события create ejGrid свяжите событие click для столбца гиперссылки.Пожалуйста, обратитесь к примеру кода ниже,

<script type="text/x-jsrender" id="columnTemplate">
    <a href="https://www.syncfusion.com">{{:EmployeeID}}</a>
</script>

<script>

    function onGridCreate(args) {
        this.element.find(".e-gridcontent").on("click", "a", function (e) {
            alert("hit"); // do your stuff here.
        });
    }
</script>
  
<div ng-app="employeeView">
    <div ng-controller="GridCtrl">
        <div id="Grid" ej-grid e-datasource="data"
             e-allowfiltering="true" e-allowpaging="true"
             e-filtersettings-filterType="excel" e-create="onGridCreate">
            <div e-columns>
                <div e-column e-field="CustomerID" e-headertext="Company" e-tooltip="Company" e-width="80"></div>
                <div e-column e-field="ShipCity" e-headertext="Plant" e-width="80"></div>
                <div e-column e-headerText="Manage Records" e-template="#columnTemplate"></div>
            </div>
        </div>
    </div>
</div>

Вывод: см. Вывод

Пожалуйста, свяжитесь с нами, если вам нужнодальнейшая помощь.Мы будем рады помочь вам.

С уважением,

Маниваннан Падманабан.

...