Добавление столбца, содержащего гиперссылку для каждой строки в элементе управления kendoui grid в ASP.NET MVC


Вот мое мнение, что содержит KendoUI управления сетки : Я хочу добавить новый столбец, содержащий гиперссылку до даты создания столбца .

@using Kendo.Mvc.UI 
@model IEnumerable<ExamplekendoDropdown.Models.FacilityGroup>



@{
    ViewBag.Title = "Grid";
}



<table width="700">
<tr>
<td align="center">


<table width="1000">
<tr>
<td align="left">
@using (Html.BeginForm("Grid", "Grid", FormMethod.Get))

{
    <table>
    <tr>
    <td>
    <span>Facility Group Name</span>
    </td>
    <td>
    @(Html.Kendo().AutoComplete()
                   .Name("FacilityGroupName")
                   .Value("")
                   .Enable(true)
                ) 
    @Html.Hidden("FacilityGroupName")
    </td>
    </tr>
    <tr>
    <td>
    <input id="Submit1" type="submit" value="Search" />
    </td>
    </tr>
    </table>
}

</td>
</tr>
<tr>
<td align="center" >
@(Html.Kendo().Grid(Model)
    .Name("Grid")

    .Columns(columns =>
        {
                columns.Bound(p => p.FacilityGroupId);

                    //columns.Bound(@Html.ActionLink("Create Facility", "Facility"));


                columns.Bound(p =>p.FaclityGroupName);
                columns.Bound(p => p.status).Width(80);
                columns.Bound(p => p.CreationDate);
                columns.Command(command => { command.Edit();  });
        })

        //.ToolBar(toolbar =>toolbar.Create())
        //.Editable(editable => editable.Mode(GridEditMode.PopUp))

        .Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("EditUserPopupTemplate")
            .Window(w => w.Title("Facility").Name("editWindow").Width(300).Height(300)))
        .Pageable()
        .Sortable()
        .Scrollable()
        .DataSource(datasource => datasource
            .Server()
            .Model(model => model.Id(p => p.FacilityGroupId ))
            .Read("Grid", "Grid")
            .Update("Update", "Grid")

            //.Create("Create","Grid")
            //.Destroy("Destroy","Grid")
            )
                )

<script type="text/javascript">
    $(document).ready(function () {
        $("form.k-edit-form").kendoValidator();
    });

</script>

</td>
</tr>
</table>


 </td>
</tr>
</table>

Теперь мне нужно добавить еще один столбец перед столбцом "дата создания", который содержит гиперссылку. Пожалуйста, поделитесь своими вводами Спасибо

6 5

6 ответов:

Но почему бы и нет, если вы используете ajax

Ajax().ClientTemplate("<a href='" + Url.Action("YourAction", "YourController") +"/#= Id #'" +">#=FileName#</a>");

if server()
columns.Bound(p => p.ProductID).Template(@<text>
                 @Html.ActionLink("Show Product Details", "ProductDetails", new { id = @item.ProductID } )>
                 </text>);

Этот пример

columns.Template(@<text></text>).ClientTemplate(
    @Html.ActionLink("Send Reset Email", "Login", new { loginButton = "reset",activate=true,fromAdmin=true,rowField="#=rowField#" }).ToHtmlString()
);
Это сработало для меня.

Вы можете использовать шаблон и ClientTemplate, чтобы получить столбец с гиперссылкой.

columns.Bound(p => p.CreationDate)
    .Template(@<text><a href="">@item.CreationDate</a></text>)
    .ClientTemplate("<a href=''>#CreationDate<a/>").Title("Link");
columns.Bound(p => p.CreationDate);

Вам нужно только использовать Метод Template для привязки сервера. (ClientTemplate предназначен для привязки Ajax). Вам не нужно привязывать его к определенному свойству, если вы не хотите связать заголовок столбца с фильтром / сортировкой / группой по этому свойству.

columns.Template(@<text>@Html.ActionLink("Create Facility", "Facility")</text>)
columns.Template(@<text></text>)
       .ClientTemplate("<a href='" + Url.Action("Index", "Home") + "'>Create Facility</a>")
       .HtmlAttributes(new { style = "text-align: left;" })
       .Width(60);

Это сработало для меня

Если ваша сетка имеет привязку к серверу, используйте следующее:

  columns.Bound(x => x.ProjectCode)
          .Template(items => Html.ActionLink(items.ProjectCode, "Manage", "Project", new {projectId = items.ProjectId}, null));