Telerik Forums
UI for ASP.NET MVC Forum
1 answer
978 views

Hi

I have a popup edit template and when I close it I want to refresh the grid.

I used the instructions from here http://www.telerik.com/forums/pop-up-editor-events but there is no Edit event. It doesnt find such an event so I used Deactive. I tried almost all events and none of them will fire my javascript function. Even after I get it to fire I wouldnt know what to use to make the grid to refresh.

Can you please help me what should I use to refresh the grid on popup close. I need to do something like rebind because I need to refresh result from another table and maybe run another javascript function to repaint the rows.

Here is my code:

@using PartnerLink.Models
@using Telerik.OpenAccess.SPI
@model Tuple<TBL_ASSIGNMENT, IQueryable<TBL_ASSIGNMENT_EXPENDITURE_VALUE>, IQueryable<TBL_ASSIGNMENT_INCOME_VALUE>, IQueryable<TBL_ASSIGNMENT_VEHICLE>>
 
<div style="height:500px">
    @(Html.Kendo().Grid<AssignmentDocTypesExt>()
        .Name("gridCaseDocuments")
        .Columns(columns =>
        {
            columns.Bound(p => p.ASSIGNMENT_DOCUMENT_TYPE_ID).Hidden(true);
            columns.Bound(p => p.ASSIGNMENT_ID).Hidden(true);
            columns.Bound(p => p.DOCUMENT_TYPE_ID).Hidden(true);
            columns.Bound(p => p.WHICH_APPLICANT).Hidden(true);
            columns.Bound(p => p.DOCUMENT_TYPE_STATUS_ID).Hidden(true);
            columns.Bound(p => p.CREDITOR_ID).Hidden(true);
            columns.Bound(p => p.numOfUploadedFiles).Title("Files").Width(60);
            columns.Bound(p => p.documentDescription).Title("Document").Width(350);
            columns.Bound(p => p.whichApplicant).Title("Applicant").Width(100);
            columns.Bound(p => p.documentTypeStatusDescription).Title("Type Status").Width(200);          
            columns.Bound(p => p.COMPLETE_FLAG).Title("Complete").ClientTemplate("<input type='checkbox' #= COMPLETE_FLAG ? checked='checked' :'' # disabled />").Width(90);
            columns.Bound(p => p.autoCompleteOnUpload).Title("Auto Complete").ClientTemplate("<input type='checkbox' #= autoCompleteOnUpload ? checked='checked' :'' # disabled />").Hidden(true);      
            columns.Command(command => { command.Edit().Text("Upload"); }).Width(230);
        })
        .Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("ClientDocumentUpload").Window(w => w.Events(e => e.Deactivate("onCloseClientDocumentUpload"))))
        .Sortable()
        .Scrollable()
        .ClientDetailTemplateId("gridCaseDocumentsDetails")
        .Pageable(pager => pager.Refresh(true))
        .Resizable(resize => resize.Columns(true))
        .HtmlAttributes(new { style = "height:500px;" })
        .Events(clientEvents => clientEvents.DataBound("onRowDataBoundgridCaseDocuments"))             
        .DataSource(dataSource => dataSource
            .Ajax()
            .PageSize(20)
            .Events(events => events.Error("error_handlerCaseDocuments"))
            .Model(model => model.Id(p => p.ASSIGNMENT_DOCUMENT_TYPE_ID))
            .Read(read => read.Action("CaseDocuments_Read", "Home", new { id = Model.Item1.ASSIGNMENT_ID }))
            .Update(update => update.Action("CaseDocuments_Update", "Home"))           
            )
                       
    )
</div>
 
<script id="gridCaseDocumentsDetails" type="text/kendo-tmpl">
    @(Html.Kendo().Grid<ClientDocumentsExt>()
            .Name("gridCaseDocuments_#=ASSIGNMENT_DOCUMENT_TYPE_ID#")
            .Columns(columns =>
            {
                columns.Bound(m => m.ASSIGNMENT_DOCUMENT_ID).Hidden(true);
                columns.Bound(m => m.FILE_NAME).Title("File Name");
                columns.Bound(m => m.uploadedBy).Title("Uploaded By").Width(210);
                columns.Bound(m => m.DATE_CREATED).Title("Upload Date").Format("{0:dd/MM/yyyy}").Width(110);
                columns.Template(@<text></text>).ClientTemplate("<a class='k-button' href='" +
                                                                        Url.Action("ClientDocs_Download", "Home") +
                                                                        "/\\#= ASSIGNMENT_DOCUMENT_ID \\#'" +
                                                                    ">Download</a>").Width(110);
                columns.Command(c => c.Destroy().Text("Delete")).Width(110);
            })
                    .DataSource(dataSource => dataSource
                        .Ajax()
                        .PageSize(5)
                        .Model(model => model.Id(m => m.ASSIGNMENT_DOCUMENT_ID))
                        .Read(read => read.Action("gridCaseDocumentsDetails_Read", "Home", new { id = "#=ASSIGNMENT_DOCUMENT_TYPE_ID#" }))
                        .Destroy(delete => delete.Action("gridCaseDocumentsDetails_Destroy", "Home"))
 
                    )
                    .Pageable(pager => pager.Refresh(true))
                    .Sortable()
                    .Scrollable()
                    .ToClientTemplate()
    )
</script>
 
<script type="text/javascript">
    function error_handlerCaseDocuments(e) {
        if (e.errors) {
            var message = "Errors:\n";
            $.each(e.errors, function (key, value) {
                if ('errors' in value) {
                    $.each(value.errors, function () {
                        message += this + "\n";
                    });
                }
            });
            alert(message);
        }
    }
 
    $("#gridCaseDocuments").find(".k-grid-content").height(421);
 
    function onRowDataBoundgridCaseDocuments(e) {
 
        var grid = $("#gridCaseDocuments").data("kendoGrid");
        var gridData = grid.dataSource.view();
 
        for (var i = 0; i < gridData.length; i++) {
            var currentUid = gridData[i].uid;
            if (gridData[i].COMPLETE_FLAG) {
                var currenRow = grid.table.find("tr[data-uid='" + currentUid + "']");
                $(currenRow).css("background-color", "#40FF00");
            } else if (gridData[i].numOfUploadedFiles > 0) {
                var currenRow = grid.table.find("tr[data-uid='" + currentUid + "']");
                $(currenRow).css("background-color", "rgb(255,191,0)");
            }
        }
    }
    function onCloseClientDocumentUpload()
    {
        alert("onCloseClientDocumentUpload");
    }
</script>

Boyan Dimitrov
Telerik team
 answered on 26 May 2015
2 answers
385 views

Hi,

I having an issue with the Chart control. All series columns in the chart are Black but the Legend shows each series with a different color.

@(Html.Kendo().Chart<ViolationsChartModel>()
.Name("ViolationsChart")
.Title("Inspection Results By Year")
.DataSource(ds => ds
.Read(read => read.Action("ViolationsReportChart", "Violations"))
.Group(g => g.Add(v => v.InspectionYear))
.Sort(s => s.Add(v => v.Question))
)
.Legend(legend => legend
.Position(ChartLegendPosition.Bottom)
)
.Series(series =>
{
series.Column(value => value.InspectionPercent, category => category.Question).Name("${group.value}").CategoryField("Question");
})
.ValueAxis(axis => axis.Numeric()
.Labels(lables => lables.Format("{0:P0}").Visible(true))
)
.CategoryAxis(axis => axis
.Visible(true)
)
.Tooltip(tooltip => tooltip
.Visible(true)
.Format("{0:P0}")
.Template("${series.name} - ${category} - ${value}")
)

If I add .SeriesColors("#cd1533", "#d43851", "#dc5c71", "#e47f8f", "#eba1ad",...) the Legend shows those colors but chart still shows all series as black.

What am I doing wrong?

Thanks,

 

           

Steven
Top achievements
Rank 1
 answered on 26 May 2015
1 answer
111 views

Hi.

I'm wondering how to make the upload file button still being visible after you have successfully uploaded a file.

Select a file. -> upload button is visible.
Click on upload button and the file is succefully uploaded -> Upload button hidden.

Is there a way to stop the upload button from hiding or showing it again?

Dimiter Madjarov
Telerik team
 answered on 26 May 2015
2 answers
282 views

Hello.

We have an MVC app with some webapi controllers that use custom security based on a header that the request must include.

How can we modify the controls to make them include the headers when they request the data to the server?

As far as we've been seen, we can put the URL they call, but we don't know how to add custom headers.

Thanks in advance.

Sergi
Top achievements
Rank 1
 answered on 26 May 2015
9 answers
176 views

I just tried the excel export with custom binding, of cause I knew it would not get all data with custom binding, it only gets the current page.

I can get the data myself if I could get the filter info, how to get filter info when using excel export?
Thanks

Alan Mosley
Top achievements
Rank 1
 answered on 26 May 2015
11 answers
1.0K+ views

I have a Kendo Grid with dropdownlist for inline Batch updte.When i change the Dropdown list thevalue changes and when it loses the focus , the value of the selected item is displayed in the grid instead of the TextField to be displayed in the grid's dropdownlist. I am using EditorTemplateName for displaying the dropdownlist in the grid.Can you please help me what is wrong and help me correct this issue. I have searched Telerik forum but still couldnt find any help.

 

 

EditorTemplate:
 
@using System.Collections
 
@(Html.Kendo().DropDownList()
    .BindTo((IEnumerable)ViewData["AllTitlesList"])
    .Name("MagTitle")
    .DataValueField("MagDescID")
    .DataTextField("MagTitle")
    .OptionLabel("- Select Title - ")
)
 

Kendo Grid Code: 

 
@(Html.Kendo().Grid<ARMS_WebApi.ViewModel.AncillaryCodes>()
      .Name("grid")
      .Columns(columns =>
      {
          columns.Bound(ac => ac.AncillaryCodeID).Width(75).Title("Id");
          //columns.Bound(ac => ac.MagDescID).Width(150).EditorTemplateName("MagazineTitleTemplate").Title("Title").ClientTemplate("#:MagTitle#");
       
          columns.ForeignKey(ac => ac.MagTitle, (IEnumerable)ViewData["AllTitlesList"], "MagDescID", "MagTitle").ClientTemplate("#:MagTitle#").
             EditorTemplateName("_AllTitlesKendoComboBoxTemplate").Title("Title").Width(100);
          columns.Bound(ac => ac.AncillaryCode).Width(75).Title("Ancillary Code");
          columns.Bound(ac => ac.AncillaryCodeDescription).Width(150).Title("Ancillary Code Description");
          columns.Command(commands =>
          {
              commands.Destroy();
          }).Width(50);
      })
      .ToolBar(toolbar =>
      {
          toolbar.Create();
          toolbar.Save();
          toolbar.Custom().Text("Delete selection")
                   .HtmlAttributes(new { onclick = "deleteSelection(event)" });
      })
              .Editable(editable => editable.Mode(GridEditMode.InCell).CreateAt(GridInsertRowPosition.Top))
                  .Pageable()
                            .Sortable()
                            .Scrollable(scr => scr.Height(300))
                     .Filterable(
                     filterable => filterable
                  .Extra(false)
                   .Operators(operators => operators
                    .ForString(str => str.Clear()
                    .StartsWith("Starts with")
                    .IsEqualTo("Is equal to")
                  .IsNotEqualTo("Is not equal to")
                  .Contains("Contains")
         )))
            .Resizable(resize => resize.Columns(true))
            .Reorderable(reorder => reorder.Columns(true))
              .DataSource(dataSource =>
          dataSource.Ajax()
            .Batch(true)
            .Model(model =>
            {
                model.Id(ac => ac.AncillaryCodeID);
                model.Field(ac => ac.AncillaryCodeID).Editable(false);
            })
                     .Create(create => create.Action("AncillaryCode_Create", "AncillaryCode"))
                     .Read(read => read.Action("AncillaryCode_Read", "AncillaryCode"))
                     .Update(update => update.Action("AncillaryCode_Update", "AncillaryCode"))
                     .Destroy(destroy => destroy.Action("AncillaryCode_Destroy", "AncillaryCode"))
      ))

 

 

 

    

I have a Kendo Grid with dropdownlist for inline Batch updte.When i change the Dropdown list thevalue changes and when it loses the focus , the value of the selected item is displayed in the grid instead of the TextField to be displayed in the grid's dropdownlist. I am using EditorTemplateName for displaying the dropdownlist in the grid.

Can you please help me what is wrong and help me correct this issue. I have searched Telerik forum but still couldnt find any help.

I have a Kendo Grid with dropdownlist for inline Batch updte.When i change the Dropdown list thevalue changes and when it loses the focus , the value of the selected item is displayed in the grid instead of the TextField to be displayed in the grid's dropdownlist. I am using EditorTemplateName for displaying the dropdownlist in the grid.

Can you please help me what is wrong and help me correct this issue. I have searched Telerik forum but still couldnt find any help.

Harish
Top achievements
Rank 1
 answered on 25 May 2015
1 answer
115 views

I have followed the tutorials and have confirmed that I have the latest version on UI for ASP.NET MVC installed, but I still can't get the Marker Click Event to fire on the Map feature. Below is the code I am using, any thoughts?

 

@(Html.Kendo().Map()
                .Name("map")
                .Center(45.5095528, -91.9996693)
                .Zoom(7)
                .Layers(layers =>
                {
                    layers.Add()
                        .Type(MapLayerType.Tile)
                        .UrlTemplate("http://tile2.opencyclemap.org/transport/#= zoom #/#= x #/#= y #.png")
                        .Subdomains("a", "b", "c")
                        .Attribution("&copy; <a href='http://osm.org/copyright'>OpenStreetMap contributors</a>." +
                                     "Tiles courtesy of <a href='http://www.opencyclemap.org/'>Andy Allan</a>");

                    layers.Add()
                        .Type(MapLayerType.Shape)
                        .DataSource(dataSource => dataSource
                            .Read(read => read.Action("HospitalLocations", "Home"))
                            )
                            .LocationField("Location")
                            .Shape(.Pin)
                            .TitleField("Title")
                            .ValueField("ID");
                })
                .Events(events => events.MarkerClick("onClick")))

Alexander Popov
Telerik team
 answered on 25 May 2015
2 answers
655 views

Hi

I used this code to hide Edit and Delete button if a column in the grid has value of 1

function onDataBoundgridCreditors(e) {
 
    var grid = $("#gridCreditors").data("kendoGrid");
    var gridData = grid.dataSource.view();
 
    for (var i = 0; i < gridData.length; i++) {
        var currentUid = gridData[i].uid;
        if (gridData[i].CREDITOR_SOURCE_ID == 1) {
            var currenRow = grid.table.find("tr[data-uid='" + currentUid + "']");
            var editButton = $(currenRow).find(".k-grid-edit");
            editButton.hide();
            var deleteButton = $(currenRow).find(".k-grid-delete");
            deleteButton.hide();
        }
    }
}

I added a group and now gridData[i].CREDITOR_SOURCE_ID  from the function above is not recognize.

What should I use to hide the buttons in the group?

Here is the grid:

@(Html.Kendo().Grid<ShowCreditCheck>()
    .Name("gridCreditors")
.Columns(columns =>
{
    columns.Bound(c => c.CREDITOR_ID).Hidden(true);
    columns.Bound(c => c.ASSIGNMENT_ID).Hidden(true);
    columns.Bound(c => c.ACCOUNT_REFERENCE).Title("Ref#").Width(70).HtmlAttributes(new { title = " #= ACCOUNT_REFERENCE # " });
    columns.Bound(c => c.CREDITOR_TYPE).Title("Type").Width(90);
    columns.Bound(c => c.creditorClass).Title("Class").Width(70);
    columns.Bound(c => c.CREDITOR_NAME).Title("Creditor").Width(110);
    columns.Bound(c => c.CREDITOR_SOURCE).Title("Source").Width(80);
    columns.Bound(c => c.applicantNumber).Title("Applicant").Width(60);
    columns.Bound(c => c.CREDIT_CHECK_CURRENT_BALANCE).Title("Balance").Width(60).Format("{0:#,##}").HtmlAttributes(new { style = "text-align:right" })
                        .ClientFooterTemplate("<div style='text-align:right'>#= kendo.format('{0:0,00}', sum)#</div>")
                        .ClientGroupFooterTemplate("<div style='text-align:right'>#= kendo.format('{0:0,00}', sum)#</div>");
    columns.Bound(c => c.DATE_CREATED).Title("Checked").Width(75).Format("{0:dd/MM/yyyy}");
    columns.Bound(c => c.CREDITOR_SOURCE_ID).Hidden(true);
    columns.Bound(c => c.OWNER_ID).Hidden(true);
    columns.Bound(c => c.CREDIT_STATUS_ID).Hidden(true);
    columns.Command(command => { command.Edit(); command.Destroy(); }).Width(70);
})
.ToolBar(toolbar => toolbar.Create().Text("Add Creditor"))
.Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("ProvidedCreditCheckTemplate"))
.Pageable(pager => pager.Refresh(true))
.Sortable()
.Scrollable()
.Resizable(resize => resize.Columns(true))
.HtmlAttributes(new { style = "height:420px;" })
.Events(e => e.DataBound("onDataBoundgridCreditors"))
.Groupable()
.DataSource(dataSource => dataSource
    .Ajax()
    .PageSize(20)
    .Group(group => group.Add(p => p.creditorClass))
    .ServerOperation(false)
    .Aggregates(aggregates =>
    {
        aggregates.Add(p => p.CREDIT_CHECK_CURRENT_BALANCE).Sum();
    })
    .Events(events => events.Error("error_handlerCreditorProvided"))
    .Model(model => model.Id(p => p.CREDITOR_ID))
    .Create(update => update.Action("GridCreditCheck_Create", "Home", new { id = Model.Item1.ASSIGNMENT_ID }))
    .Read(read => read.Action("GridCreditCheck_Read", "Home", new { id = Model.Item1.ASSIGNMENT_ID }))
    .Update(update => update.Action("GridCreditCheck_Update", "Home"))
    .Destroy(update => update.Action("GridCreditCheck_Destroy", "Home"))
)
 
)

Derek
Top achievements
Rank 1
 answered on 25 May 2015
3 answers
749 views
Hi Team,

I wish to display statistical data for multiple countries in my grid. The way I retrieve data from the database, my grid would show data a bit like the following:

Country    Area(km^2)    Population        GDP($ trn)    GDP Growth (%)    Inflation (%)
India          3288000         1220200000       1.848             6.8                           7.9
USA          9827000          314686189         15.09            1.7                            2.0
.
.

But instead of the format above, I wish it show like the following:

Country                    India                USA                .
Area (km^2)             3288000          9827000         .
Population               1220200000    314686189     .
GDP ($ trn)              1.848               15.09              .
GDP Growth (%)      6.8                  1.7                   .
Inflation (%)              7.9                  2.0                  .

Please let me know how I could achieve this transposition.
Vladimir Iliev
Telerik team
 answered on 25 May 2015
7 answers
166 views
I am using cascading with a combo box and a multi select
box. You first choose a server in the combo box which gives you a list of users
from that server for the Multi select box. Previous to my upgrading to
2015.1.408 you were able to select multiple servers and multiple users and the
Multi select retained all the previously selected users. With the upgrade to
2015.1.408 the Multi select box is cleared on every read/cascade from the combo
box. We have been using this functionality for over a year now is this a bug or
functionality that you no longer support? Here’s my code.

 <div class="form-group">

                    <h5>Select Server: @Html.Raw(ViewBag.SERVER) </h5>

                    @(Html.Kendo().DropDownList()

                          .Name("ServerID")

                          .OptionLabel(Resources.Select_Server)

                          .DataTextField("ServerName")

                          .DataValueField("ServerID")

                          .HtmlAttributes(new { required = "required",
validationMessage = "Please select a
Server" })

                          .DataSource(source
=>

                          {

                              source.Read(read
=>

                              {

                                  read.Action("GetServers", "DropdownMenus", new { area = "Shared" });

                              });

                          }).Events(e =>
e.Change("onServerChange"))

                          )

                </div>

                <span class="form-group
divider" style="width:400px;">

                    <h5>Select Agent: @Html.Raw(ViewBag.AGENT)</h5>

                    @(Html.Kendo()

                          .MultiSelect()

                          .Name("AgentID")

                          .Placeholder("Select multiple Agents...")

                          .Value(Model.USER_ID)

                          .DataTextField("UserName")

                          .DataValueField("UserID")

                          .HtmlAttributes(new { required = "required",
validationMessage = "Please select some
Agents" })

                          .Events(events => events.Change("agentChange"))

                          .DataSource(source
=>

                          {

                              source.Read(read
=>

                              {

                                  read.Action("GetAgentAndServer", "DropdownMenus", new { area = "Shared" })

                                      .Data("filterServers");

                              })

                                 
.ServerFiltering(true);

                          })

                          .AutoBind(false)

                          .Enable(false)

                          )

                    <input type="hidden" name="serverUsersCache" id="serverUsersCache"  />

                </span>

function onServerChange(e) {

 

        var lineMultiSelect = $('#AgentID').data('kendoMultiSelect');

        lineMultiSelect.enable(true);

        lineMultiSelect.dataSource.read();

    };

function filterServers() {

        return {

            Servers: $("#ServerID").val()

        };

    }
Kiril Nikolov
Telerik team
 answered on 25 May 2015
Narrow your results
Selected tags
Tags
+? more
Top users last month
Will
Top achievements
Rank 2
Iron
Motti
Top achievements
Rank 1
Iron
Hester
Top achievements
Rank 1
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Thomas
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Will
Top achievements
Rank 2
Iron
Motti
Top achievements
Rank 1
Iron
Hester
Top achievements
Rank 1
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Thomas
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?