在Kendo弹出窗口中更改按钮文本

时间:2014-01-07 08:30:01

标签: asp.net asp.net-mvc kendo-ui kendo-grid

我正在为我的Application使用KendoUI工具。我正在使用一个Kendo Grid,其中有一个工具栏点击它向我显示一个弹出窗口,其中两个按钮是“更新”和“取消”并且想要将文本更新更改为“保存”。我正在使用MVC创建我的应用程序。 我的代码如下:

@(Html.Kendo().Grid<Invoice.Models.ViewModels.DossierViewModel>()
    .Name("Dossier")
    .Columns(columns =>
    {

        columns.Bound(p => p.DisplayID).ClientTemplate("<a href=" + @Url.Content("~/Document/DocumentList/#= data.DossierID#") + ">#=data.DisplayID#</a>").Title("Dossier").Width(80);

        columns.Bound(p => p.CustomerName).Title("Customer").Width(150);

        columns.Bound(p => p.InvoiceNumber).Title("INV no.").Width(100).ClientTemplate("<a href=" + @Url.Content("~/Home/PrintInvoice/#= data.InvoiceNumber#") + " target='_blank'>#=data.InvoiceNumber#</a>");

        columns.Bound(p => p.Status).ClientTemplate("#=data.Status#");


    })
    .ToolBar(toolbar =>
    {
        toolbar.Create().Text("Add New Dossier");
        toolbar.Custom().Text("Search").Action("AdvanceSearch", "Dossier");
    })

    .Pageable()

    .Sortable()
    .Scrollable()
    .Filterable()
    .Editable(ed => ed.Mode(GridEditMode.PopUp).TemplateName("New_Dossier"))                    //Having Different Template for New Dossier
    .DataSource(dataSource => dataSource
            .Ajax()
            .PageSize(15)
            .Model(model => { model.Id(p => p.DossierID); })
            .Read(read => read.Action("Dossier_Read", "Dossier"))
            .Create(create => create.Action("Dossier_Create", "Dossier", new { @CompanyID = ViewBag.CompanyID }))

     )
)

在这里你可以看到我正在使用我自己的模板“New_Dossier”用于Window Popup,而我的New_Dossier页面看起来像:

<div class="form-group">
        <div class="control-group">
            <label class="control-label">Name</label>
            <div class="controls">
                @(Html.Kendo().AutoComplete()
                      .Name("Customers")
                      .DataTextField("CustomerShortName")
                      .Filter("contains")
                      .MinLength(3)
                      .Events(events => events.Select("CustomerSelect"))
                      .HtmlAttributes(new { style = "width:250px" })
                      .DataSource(source =>
                      { 
                          source.Read(read =>
                          {
                              read.Action("GetCustomers", "GetData");

                              //.Data("onAdditionalData");
                          })
                          .ServerFiltering(true);
                      })
                )
            </div>
        </div>
    </div>

请建议我。

1 个答案:

答案 0 :(得分:6)

在网格定义中:

.Events(events => events.Edit("insertPopupCaption"))

在JavaScript中:

function insertPopupCaption(e) {
    $('.k-window-title').text("[PopupEditCaption]");
    $('.k-grid-update').text("[UpdateButtonText]");
    $('.k-grid-cancel').text("[CancelButtonText]");
}

这样,按钮图标也会被替换 - 如果不是这样,请调整JavaScript。