Questions on UI for ASP.NET MVC Forum

1 answer

196 views

Export to SVG

Hi I have problem with export diagram to SVG.

I get error message:

This page contains the following errors: error on line 1 at column 3494: EntityRef: expecting ';'
Below is a rendering of the page up to the first error.

I tried kendo version 2015.2.624 and v2015.2.902. The result is the same.

I tried this code:

$("#exportSvg").click(function () {
            var diagram = $("#diagram").getKendoDiagram();
            diagram.exportSVG().done(function (data) {
                kendo.saveAs({
                    dataURI: data,
                    fileName: "diagram.svg"
                });
            });
        });

and this code with proxyURL:

$("#exportSvg").click(function () {
var diagram = $("#diagram").getKendoDiagram();
diagram.exportSVG().done(function (data) {
kendo.saveAs({
dataURI: data,
fileName: "diagram.svg",
proxyURL: "<%= Url.Action("ExportSave", "OrganizacneSchemy") %>"
});
});
});

Where is the problem ?

Thanks

Diagram

answered on 25 Sep 2015

10 answers

463 views

"entry point was not found"--manually adding MVC to legacy webforms

I am adding MVC & Telerik Kendo to legacy webforms application.

I have only just added MVC 5 itself to the project using an MVC area. (see http://www.davepaquette.com/archive/2013/12/30/so-you-inherited-an-asp-net-web-forms-application.aspx).

To add Telerik MVC, I am following the steps here: http://docs.telerik.com/kendo-ui/aspnet-mvc/asp-net-mvc-5

When I get to the step adding @(Html.Kendo().DatePicker().Name("datepicker")) to a "hello world" mvc, and try to access it, I get a "System.EntryPointNotFoundException".

Any ideas what could be wrong?

Additional info:

I made the web.config changes to (and only to) the web.config file in the MVC area.

The "~/Content/kendo/..." and "~/Scripts/kendo/..." are in their standard places, not in the MVC area. Not sure if this matters, but no errors appear to be generated by the telerik bundles in BundleConfig.vb.

Googling I have found mentions of <bindingredirects> in the web.config, but the Telerik instructions I am following to not mention this possibility.

General Discussions

answered on 25 Sep 2015

4 answers

462 views

Dynamic Databinding

Hi,

I need to bind the datasource to ASP.NET MVC Scheduler dynamically. In my scenario, I have 5 dropdownlists. Users will select item from the dropdownlists and then click Search buton and the scheduler will load the result. How can I do that with javascript?

Please see the attached image.

@(Html.Kendo().Scheduler<TaskViewModel>()

.Name("schedulerJob")

.Date(new DateTime(2015, 8, 31))

.StartTime(new DateTime(2015, 8, 31, 7, 00, 00))

.Height(600)

.Views(views =>

{

views.TimelineView();

})

.Timezone("Etc/UTC")

.Group(group => group.Resources("Techs").Orientation(SchedulerGroupOrientation.Vertical))

.Resources(resource =>

{

resource.Add(m => m.TechName)

.Title("Techs")

.Name("Techs")

.DataTextField("emm_code")

.DataValueField("emm_code")

.DataSource(d => d.Read("Techs", "JOBS"));

})

.DataSource(d => d

.Model(m =>

{

m.Id(r => r.emm_code);

})

.Read("JobSchedule_Read", "JOBS")

.Create("JobSchedule_Create", "JOBS")

.Update("JobSchedule_Update", "JOBS")

.Destroy("JobSchedule_Delete", "JOBS")

)

public JsonResult JobSchedule_Read([DataSourceRequest] DataSourceRequest request)

{

DateTime startDateTime;

DateTime endDateTime;

List<JscDet> JscDet = (List<JscDet>)Session["JobScheduleDateTime"];

List<TaskViewModel> tasks = new List<TaskViewModel>();

foreach (var item in JscDet)

{

startDateTime = SchedulerUtility.GetDateTimeFromSeconds(item.jsd_sch_date, item.jsd_sch_start_time);

endDateTime = SchedulerUtility.GetDateTimeFromSeconds(item.jsd_sch_date, item.jsd_sch_end_time);

tasks.Add(new TaskViewModel()

{

TaskID = item.jsd_jobno,

TechName = item.jsd_sch_assto,

emm_code = item.jsd_sch_assto,

Title = "Job Title",

Start = new

DateTime(startDateTime.Year, startDateTime.Month, startDateTime.Day, startDateTime.Hour, startDateTime.Minute, startDateTime.Second),

End = new

DateTime(endDateTime.Year, endDateTime.Month, endDateTime.Day, endDateTime.Hour, endDateTime.Minute, endDateTime.Second),

Description = "Description 101",

IsAllDay = false

});

}

return Json(tasks.ToDataSourceResult(request));

}

Thanks in advance

Scheduler

answered on 24 Sep 2015

2 answers

95 views

Loading data in blocks or alternative

I have this multiselect on my asp.net mvc project

<div class="demo-section user-selection">

<h3 class="title">1. Select one or more Users</h3>

@(Html.Kendo().MultiSelect()

.Name("customers")

.DataTextField("givenName")

.DataValueField("description")

//.Placeholder("No users selected")

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

.DataSource(source =>

{

source.Read(read =>

{

read.Action("GetCustomers", "Home");

});

})

.Height(300)

//.HtmlAttributes(new { style = "width: 400px" })

.HeaderTemplate("<div class=\"dropdown-header dropdown_Users\">" +

"<span class=\"k-widget k-header\">Photo</span>" +

"<span class=\"k-widget k-header\">Contact info</span>" +

"</div>")

.ItemTemplate("<span class=\"k-state-default item-user userPic\"><img

class=\"userPhoto\" src=\"" + @System.Configuration.ConfigurationManager.AppSettings["BaseUrl"] + "user/image?userIid=#:data.IID#\" /></

span>" +

"<span class=\"k-state-default item-user \"><h3>#: data.givenName # #: data.sn #</h3><p>#: data.description #</p></span>")

)

</div>

the data i load is of 2000 users that then appear in the multiselect list with their photo, first and last name and role.

my problem is that the loading takes about 5 or 6 seconds, and when scrolling down the list it sometimes gets a bit "clunky"
.

Is there anyway to improve the loading of data maybe making it load in blocks of 200 users at a time , or another way of improving performance?

MultiSelect

answered on 24 Sep 2015

2 answers

276 views

Detail Grid Date Format is Ignored

I have a hierarchical grid which is rendering fine except that the date formatting for the detail grid is being ignored and a JSON date is being rendered instead. The same formatting works fine in the Master grid. Data for the sub-grid comes from a List collection in the object that populates the master. The data was returned as one List of objects.

The detail grid renders

/Date(-62135568000000)/

instead of something like

01/23/2013 04:43 PM

Here's the code:

@model IEnumerable<KUI_CS_Test1.ROAMHostSvc.BatchHeader>

@{

ViewBag.Title = "Kendo UI for MVC (C#) Test App";

}

<h2>Batch List</h2>

@(Html.Kendo().Grid(Model)

.Name("batchGrid")

.Sortable()

.Pageable()

.Filterable()

.Columns(columns =>

{

columns.Bound(b => b.BatchID)

.Width("200");

columns.Bound(b => b.Transmitted_DateTime)

.Width("15")

.Format("{0:MM/dd/yyyy hh:mm tt}")

.Title("Transmitted");

columns.Bound(b => b.Completed_DateTime)

.Width("15")

.Format("{0:MM/dd/yyyy hh:mm tt}")

.Title("Completed");

columns.Bound(b => b.Created_DTTM)

.Width("15")

.Format("{0:MM/dd/yyyy hh:mm tt}")

.Title("Created");

columns.Bound(b => b.Created_Emp_Name)

.Width("18")

.Title("Created By");

}

)

.ClientDetailTemplateId("transactions")

.Events(e => e.DetailInit("detailInit"))

.DataSource(dataSource => dataSource

.Ajax()

.Read(read => read.Action("FetchBatchList2", "Home"))

)

<script id="transactions" type="text/kendo-tmpl">

@(Html.Kendo().Grid<KUI_CS_Test1.ROAMHostSvc.TransactionBase>()

.Name("Transactions_#=BatchID#")

.Columns( columns =>

{

columns.Bound(t => t.ID)

.Width("200")

.Title("Transaction ID");

columns.Bound(t => t.Version)

.Width("10")

.Title("Version");

columns.Bound(t => t.TranTypeDisplayText)

.Width("15")

.Title("Tran Type");

columns.Bound(t => t.PostingFlagDisplayText)

.Width("15")

.Title("Posting Flag");

columns.Bound(t => t.Posting_DTTM)

.Width("15")

.Format("{0:MM/dd/yyyy hh:mm tt}")

.Title("Posting Date/Time");

columns.Bound(t => t.PostingMessage)

.Width("300")

.Title("Posting Message");

})

.ToClientTemplate()

)

</script>

<script type="text/javascript" language="javascript">

function detailInit(e) {

var grid = $("#Transactions_" + e.data.BatchID).data("kendoGrid");

grid.dataSource.data(e.data.TranCollection);

}

</script>

Grid

answered on 24 Sep 2015

1 answer

392 views

Kendo MVC Grid - Preserve State issue

We are trying to implement kendo grid preserve state functionality. Requirement is a grid state (filter, page etc) is already pre saved in the db and every times page loads, we have to show grid with the pre saved state. We followed the example given in link ( http://www.telerik.com/support/code-library/save-grid-state-in-session-on-server-side ) and able to achieve the requirement in two steps.
Step 1: Load the page with default grid option

@(Html.Kendo().Grid<TelerikMvcApp1.Models.Product>()
      .Name("grid")
      .DataSource(ds => ds.Ajax().Read("Read", "Home"))
      .Pageable()
      .Groupable()
      .Sortable()
      .Reorderable(r => r.Columns(true))
      .Resizable(r => r.Columns(true))
)

and then,
Step 2: on document ready, make an ajax call , get the pre saved grid options , destroy the existing grid and set the grid options

$(document).ready(function ()
{
    var grid = $("#grid").data("kendoGrid");

    var dataSource = grid.dataSource;

    $.ajax({
        url: "/Home/Load",
        success: function(state) {
            state = JSON.parse(state);

            var options = grid.options;

            options.columns = state.columns;

            options.dataSource.page = state.page;
            options.dataSource.pageSize = state.pageSize;
            options.dataSource.sort = state.sort;
            options.dataSource.filter = state.filter;
            options.dataSource.group = state.group;

            grid.destroy();

            $("#grid")
               .empty()
               .kendoGrid(options);
        }
    });
});

Problems with this approach are

- grid’s data read server side method “Read” is hit twice. One for default load and other for state load.
- Grid shows all records first , then truncates and then shows the data with saved grid options. It does not look good.

Is there any way to apply the grid options first time itself, not on document ready. I want to avoid multiple server side calling and grid data reads.

Grid

answered on 24 Sep 2015

2 answers

183 views

Set specifics columns DINAMICALLY in a Kendo Grid helper

Hi,
I implemented Kendo Grid helper in a MVC 4 with WebApi application, but I don't know how can I set de column list to change dinamically the rows that it shows. I don't want put all columns, only a list of columns pre-selects by diferents criterials (user config preferences).

My Helper code:

@(Html.Kendo().Grid<Bitacora.WebUI.Models.WhiteBoard.XXXGridModel>()
.Name("Grid")
.AutoBind(true)
.EnableCustomBinding(true)
//.BindTo(Model.xxxx.YYYList)
.Columns(c =>
{
c.AutoGenerate(column =>
{
//customize autogenereted column's settings
column.Width = "150px";

//column.ClientTemplate = "<input type='checkbox' name='checkbox' />";

});
})
.Scrollable(scrolling => scrolling.Enabled(true).Height("auto"))
.Resizable(x => x.Columns(true))
.Events(events => events.Change("searchCalls"))
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read
.Action("Search", "api/ActionApi")
.Data("getFiltersSelected")
.Type(HttpVerbs.Post))
.ServerOperation(true)) // Paging, sorting, filtering and grouping will be done server-side
//.ColumnMenu()
.Selectable(selectable => selectable
.Mode(GridSelectionMode.Multiple))
.Reorderable(reorder => reorder.Columns(true))
.Groupable(grouping => grouping.Enabled(true))
.Filterable(filterable => {filterable
.Operators(operators =>
{operators.ForString(strFilter => strFilter.Clear().Contains("contains"));
operators.ForNumber(strFilter => strFilter.Clear());
});
filterable.Extra(false);
}) //--> sólo se muestra el contains en las columnas Texto
.Sortable(s=> s
.SortMode(Kendo.Mvc.UI.GridSortMode.MultipleColumn)
.AllowUnsort(true))
.Pageable(pager => pager
.Enabled(true)
.Input(true)
.PageSizes(new [] { 5, 10, 20, 30, 40, 50 })) // MULTIDIOMA RESOURCES

My Model:

public class XXXGridModel
{
[Display(Name = "Id", ResourceType = typeof(WhiteBoardGridVMResource))]
public int Id { get; set; }
[Display(Name = "DateCreated", ResourceType = typeof(WhiteBoardGridVMResource))]
public DateTime DateCreated { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public string CallNumber { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public string FileNumber { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public string DUE { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public int IdBranchOffice { get; set; }
[Display(Name = "BranchOfficeName", ResourceType = typeof(WhiteBoardGridVMResource))]
public string BranchOfficeOfficeName { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public int IdCompany { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public string CompanyCompanyName { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public int IdOffice { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public string OfficeOfficeName { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public int IdShip { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public string ShipShipName { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public int IdPort { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public string PortPortName { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public int IdCallStatus { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public string CallStatusStatusName { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public int? IdOwner { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public string OwnerThirdPartyName { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public int? IdOperator { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public string OperatorThirdPartyName { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public int? IdInductor { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public string InductorThirdPartyName { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public bool IsNominatorOwner { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public bool IsNominatorOperator { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public bool IsNominatorInductor { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public int IdCreatedBy { get; set; }
[Display(Name = "Default", ResourceType = typeof(WhiteBoardGridVMResource))]
public string CreatedByUserName { get; set; }
}

Anyone can Help me?!
Thanks in advance

Grid

answered on 24 Sep 2015

2 answers

191 views

Change event firing off unexpectedly?

I recently came across a strange issue happening with the kendo Scheduler regarding firing off change events.

I have a custom event handler set so that when a user clicks on an item in the Scheduler it opens a link to a separate details page (in a new tab). The problem is that after doing this, other (unrelated) UI elements in the Scheduler will fire off the exact same event when I click on them.

You can actually see this behavior on the Scheduler Events sample page here: http://demos.telerik.com/kendo-ui/scheduler/events

To replicate:
Click on the Month View button.
Click on (highlighting) the item "HR Lecture", on the 06th. This will fire off a Change event.
Now click on the Month View button again. In between the dataBinding and dataBound events, another Change event will fire off for the same time slot. (Prior to clicking on HR Lecture, this is not the case. You'll only see events for navigation, dataBinding, and dataBound events)

This doesn't seem to happen with all events, HR Lecture just appears to be one that *does* trigger the behavior.

Is this expected? If so, is there any way to prevent this from happening?

Scheduler

answered on 23 Sep 2015

4 answers

250 views

Entering date manually in a date filter in the grid

Hello all,

I have a grid with a date filter, if I pick the date from the date picker included in the filter it all works fine.

If I enter the date as 06/17/2013 that works fine, but on the other hand if I enter the date 06/17/13 (2 digit year) I do not get results back.

What can I do to over come this issues.

Grid

answered on 23 Sep 2015

11 answers

1.2K+ views

Kendo grid column names does not scroll horizontally

I want to have a Kendo Grid with several columns. I am able to create a Kendo Grid with several columns and it has horizontal scroll bar. The columns are able to scroll horizontally, But the grid column names (column header names) does NOT scroll horizontally.
I also referred to the link : "http://www.telerik.com/forums/horizontal-scroll-bar-in-grid-but-not-working-for-header-".

I tried several things (like changing jquery version etc) but the problem is NOT resolved.
Can you let us know what am I missing?

The Kendo version we are using is Q1 2014 (2014.1.415).

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

Following is the code snippet from Index.cshtml.

<script src="../../../../Scripts/kendo/2014.1.415/jquery.min.js" type="text/javascript"></script>

<script src="../../../../Scripts/kendo/2014.1.415/kendo.all.min.js" type="text/javascript"></script>

<script src="../../../../Scripts/kendo/2014.1.415/kendo.aspnetmvc.min.js" type="text/javascript"></script>

@(Html.Kendo().Grid((IEnumerable<TelerikMvcApp1.Areas.UIConfig.Models.GenericUIClass>)ViewBag.GridData)

      .Name("grid")
      .Columns(columns =>
      {

          foreach (string key in ViewBag.Columns.Keys)
          {
              List<string> value = ViewBag.Columns[(string)key];

              columns.Bound(genericUI => genericUI.column1).Width(200).Title(key);


          }



      })

       .Scrollable(s => s.Enabled(true))

Grid

answered on 22 Sep 2015