Telerik Forums
UI for ASP.NET MVC Forum
3 answers
316 views
Hi All,

I want to create contacts view. My model is:

public class Contact
{
    public Contact()
    {
        Documents = new HashSet<Document>();
    }

    public int Id { get; set; }
    public string FirstName { get; set; }
    public string LastName { get; set; }
    public string ContactNo { get; set; }
    public string EmailId { get; set; }
    public string Address { get; set; }
    public string Notes { get; set; }
    public ICollection<Document> Documents { get; set; }
}

public class Document
{
    public Document() { }

    public int Id { get; set; }
    public int ContactId { get; set; }
    public string DocumentNo { get; set; }
    public string DocumentType { get; set; }
    public byte[] FileContent { get; set; }
    public string FileName { get; set; }
    public int ContentLength { get; set; }
}

I have created view with Contact details and Grid for documents. Actually I am new to MVC so I am searched internet how to achieve this. But I cannot find any workable solution yet. I do not know how to add one or more document and persist document details in grid.  What I am trying to achieve is save contact information with uploaded documents (one or more) while submit the form.


Thanks in advance.
Nikolay Rusev
Telerik team
 answered on 11 Jul 2014
1 answer
230 views
I have a Grid with Server() datasource in an MVC5/EF6 Razor app with your 14.1.528.0 build.   I need to return a couple of model values plus a non-model Guid value from the ViewBag when a user selects a row.  I originally tried using the "onRowSelect" approach, but discovered that the dataItem() array was always null in the onRowSelect method when using a Server() datasource.   So I can get the first model field, the "Id" column, via the DataSource model reference.   But there was no way to obtain the selected row's 2nd model field in the "onRowSelect" method.   (BTW: Please add my vote for a feature other developers have requested: providing some way to access column values in the onRowSelect() when using a Server datasource).

I next tried using a custom Command button in each row.   It was easy to return a Url Action doing "DataRouteValues( route =>Route.Add()" to add the two model values for the selected row.  

But with this approach, I cannot find a syntax to return the non-model Guid value via Route.Add().   I've tried "Route.Add("@ViewBag.MyGuid",".   I've tried setting a JavaScript var equal to the ViewBag value in a page script block and doing "Route.Add(myJsGuidVar,", etc.    But the resulting error message makes it clear that Route.Add() will only accept a model reference.

I'm new to MVC and am assuming I'm making a simply mistake.   I'd rather not have to make a new ViewModel to add this column and take the time to redundantly populate this same Guid into every row.   What am I missing here?  Is there a way to add either a ViewBag property or a non-modal JavaScript Var to the DataRouteValues of the generated call?

Thanks!
-Bob
Petur Subev
Telerik team
 answered on 10 Jul 2014
3 answers
660 views
I am using the MVC extensions to try and accomplish what I am trying to do here. I have been trying to get the Scheduler custom editor to work. I have followed the example provided in the link ?? But still when I call double click the scheduler instead of giving me my custom template it just provides all the properties of the model on a pop-up window. I have included here the method from the controller , as well as my view and the template I am trying to implement,along with the viewmodel being used. I have also provided screen shots of the directory structure and the pop-up. I have not yet created the Appointments_Create, Appointments_Update or Appointments_Destory at this time because I just wanted the pop-up to load correctly.


//*********************************
//*     Controller Method         *
//*********************************
        [Authorize(Roles = "Customer")]  // need to add client role also
        public virtual JsonResult Appointments_Read([DataSourceRequest] DataSourceRequest request)
        {
            var sbasUser = new SBASUser();
            var user = sbasUser.GetSBASUserByEmail(User.Identity.GetUserName());

            var appointments = new Appointment().GetAllCustomerAppointments(user.UserId);
            var t = appointments.ToList().Select(m => new AppointmentModel
            {
                AppointmentId = m.AppointmentId,
                Title = m.Title,
                Start = m.Start,
                End = m.End,
                StartTimezone = m.StartTimezone,
                EndTimezone = m.EndTimezone,
                Description = m.Description,
                IsAllDay = m.IsAllDay,
                RecurrenceID = m.RecurrenceId,
                RecurrenceException = m.RecurrenceException,
                RecurrenceRule = m.RecurrenceRule,
                AddressId = m.AddressId,
                CustomerId = m.CustomerId,
                ClientId = m.ClientId,
                ServiceTypeId = m.ServiceTypeId
            }).AsQueryable();

            return Json(t.ToDataSourceResult(request));
        }
        
//*********************************
//*          Index.cshtml         *
//*********************************
@{
    Layout = "~/Views/Shared/_CustomerLoggedInLayout.cshtml";
}

<div class="row">
    <div class="col-lg-12">
        <h1>Appointments Calendar</h1>
    </div>
</div>
@{
    var startdate = DateTime.Now;
}
<nav class="navbar navbar-default" role="navigation">
    <div class="container-fluid">
        <!-- Brand and toggle get grouped for better mobile display -->
        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav">
                <li class="btn btn-primary" >Submit</li>
            </ul>
        </div><!-- /.navbar-collapse -->
    </div><!-- /.container-fluid -->
</nav>
<div class="row">
    <div class="col-lg-12">
    @(Html.Kendo().Scheduler<SBAS_Web.Models.AppointmentModel>()
    .Name("scheduler")
    .Date(new DateTime(startdate.Year, startdate.Month, startdate.Day))
    .StartTime(new DateTime(startdate.Year, startdate.Month, startdate.Day, 8, 00, 00))
    .Height(500)
    .Views(views =>
    {
        views.DayView(dayView=>dayView.Selected(true));
        views.WeekView();
        views.MonthView();
    })
    .Editable(editable => editable.TemplateName("CustomEditorTemplate"))
    .Timezone("Etc/UTC")
    .DataSource(d => d
        .Model(m =>
        {
            m.Id(f => f.AppointmentId);
            m.Field(f => f.Title).DefaultValue("No title");
            m.RecurrenceId(f => f.RecurrenceID);
        })                     
        .Events(e => e.Error("error_handler"))
        .Read("Appointments_Read", "Appointment")

    )
        )
    </div>
</div>
<div id="map_canvas">

</div>

<script type="text/javascript">
    function error_handler(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);

            var scheduler = $("#scheduler").data("kendoScheduler");
            scheduler.one("dataBinding", function(e) {
                //prevent saving if server error is thrown
                e.preventDefault();
            });
        }
    }
</script>




//*********************************
//*   AppointmentModel class      *
//*********************************

using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Kendo.Mvc.UI;
using SBAS_Core.Common.Attributes;

namespace SBAS_Web.Models
{
    public class AppointmentModel : ISchedulerEvent
    {
        private DateTime _start;
        private DateTime _end;

        public long AppointmentId { get; set; }
        [Required]
        public string Title { get; set; }
        public string Description { get; set; }
        [Required]
        public DateTime Start
        { get  { return _start; }
          set  { _start = value.ToUniversalTime(); }
        }
        [Required]
        [DateGreaterThan(OtherField = "Start")]
        public DateTime End
        { get { return _end; }
          set {  _end = value.ToUniversalTime(); }
        }
        public bool IsAllDay { get; set; }
        public string RecurrenceRule { get; set; }
        public int? RecurrenceID { get; set; }
        public string RecurrenceException { get; set; }
        public string StartTimezone { get; set; }
        public string EndTimezone { get; set; }
        public long CustomerId { get; set; }
        public long ClientId { get; set; }
        public bool UseClientAddress { get; set; }
        public long? AddressId { get; set; }
        //For type of service this appointment is for
        public long ServiceTypeId { get; set; }
        public string AddressLine1 { get; set; }
        public string AddressLine2 { get; set; }
        public long SelectedCityId { get; set; }
        public long SelectedStateId { get; set; }
        [Display(Name = "City")]
        public SelectList CityList { get; set; }
        [Display(Name = "State")]
        public SelectList StateList { get; set; }
        public string ZipCode { get; set; }
        public decimal? Longitude { get; set; }
        public decimal? Latitude { get; set; }
    }
}




//***********************************
//*   CustomEditorTemplate.cshtml   *
//***********************************

@model SBAS_Web.Models.AppointmentModel
@{
    //required in order to render validation attributes
    ViewContext.FormContext = new FormContext();
}

@functions{
    public Dictionary<string, object> generateDatePickerAttributes(
           string elementId,
           string fieldName,
           string dataBindAttribute,
           Dictionary<string, object> additionalAttributes = null)
    {

        Dictionary<string, object> datePickerAttributes = additionalAttributes != null ? new Dictionary<string, object>(additionalAttributes) : new Dictionary<string, object>();

        datePickerAttributes["id"] = elementId;
        datePickerAttributes["name"] = fieldName;
        datePickerAttributes["data-bind"] = dataBindAttribute;
        datePickerAttributes["required"] = "required";
        datePickerAttributes["style"] = "z-index: inherit;";

        return datePickerAttributes;
    }
}

<div class="k-edit-label">
    @(Html.LabelFor(model => model.Title))
</div>
<div data-container-for="title" class="k-edit-field">
    @(Html.TextBoxFor(model => model.Title, new { @class = "k-textbox", data_bind = "value:title" }))
</div>

<div class="k-edit-label">
    @(Html.LabelFor(model => model.Start))
</div>
<div data-container-for="start" class="k-edit-field">

    @(Html.Kendo().DateTimePickerFor(model => model.Start)
        .HtmlAttributes(generateDatePickerAttributes("startDateTime", "start", "value:start,invisible:isAllDay")))

    @(Html.Kendo().DatePickerFor(model => model.Start)
        .HtmlAttributes(generateDatePickerAttributes("startDate", "start", "value:start,visible:isAllDay")))

    <span data-bind="text: startTimezone"></span>
    <span data-for="start" class="k-invalid-msg"></span>
</div>

<div class="k-edit-label">
    @(Html.LabelFor(model => model.End))
</div>
<div data-container-for="end" class="k-edit-field">

    @(Html.Kendo().DateTimePickerFor(model => model.End)
        .HtmlAttributes(generateDatePickerAttributes(
            "endDateTime",
            "end",
            "value:end,invisible:isAllDay",
            new Dictionary<string, object>() {{"data-dateCompare-msg", "End date should be greater than or equal to the start date"}})))
        
    @(Html.Kendo().DatePickerFor(model => model.End)
        .HtmlAttributes(generateDatePickerAttributes(
            "endDate",
            "end",
            "value:end,visible:isAllDay",
            new Dictionary<string, object>() {{"data-dateCompare-msg", "End date should be greater than or equal to the start date"}})))

    <span data-bind="text: endTimezone"></span>
    <span data-for="end" class="k-invalid-msg"></span>
</div>

<div class="k-edit-label">
    @(Html.LabelFor(model => model.IsAllDay))
</div>
<div data-container-for="isAllDay" class="k-edit-field">
    <input data-bind="checked: isAllDay" data-val="true" id="IsAllDay" name="IsAllDay" type="checkbox" />
</div>

<div class="endTimezoneRow">
    <div class="k-edit-label"></div>
    <div class="k-edit-field">
        <label class="k-check">
            <input checked="checked" class="k-timezone-toggle" type="checkbox" value="true" />
            Use separate start and end time zones
        </label>
    </div>
</div>
<script>
    $(".k-timezone-toggle").on("click", function () {
        var isVisible = $(this).is(":checked");
        var container = $(this).closest(".k-popup-edit-form");

        var endTimezoneRow = container.find("label[for='EndTimezone']").parent().add(container.find("div[data-container-for='endTimezone']"));
        endTimezoneRow.toggle(isVisible);

        if (!isVisible) {
            var uid = container.attr("data-uid");
            var scheduler = $("\#scheduler").data("kendoScheduler");
            var model = scheduler.dataSource.getByUid(uid);
            model.set("endTimezone", null);
        }
    });

    var endTimezone = '${data.endTimezone}';

    if (!endTimezone || endTimezone == "null") {
        $(".k-timezone-toggle").trigger('click');
    }
</script>

<div class="k-edit-label">
    @(Html.LabelFor(model => model.StartTimezone))
</div>
<div data-container-for="startTimezone" class="k-edit-field">
    @(Html.Kendo().TimezoneEditorFor(model => model.StartTimezone)
        .HtmlAttributes(new { data_bind = "value:startTimezone" }))
</div>

<div class="k-edit-label">
    @(Html.LabelFor(model => model.EndTimezone))
</div>
<div data-container-for="endTimezone" class="k-edit-field">
    @(Html.Kendo().TimezoneEditorFor(model => model.EndTimezone)
        .HtmlAttributes(new { data_bind = "value:endTimezone" }))
</div>

<div class="k-edit-label">
    @(Html.LabelFor(model => model.RecurrenceRule))
</div>
<div data-container-for="recurrenceRule" class="k-edit-field">
    @(Html.Kendo().RecurrenceEditorFor(model => model.RecurrenceRule)
        .HtmlAttributes(new { data_bind = "value:recurrenceRule" }))
</div>

<div class="k-edit-label">
    @(Html.LabelFor(model => model.Description))
</div>
<div data-container-for="description" class="k-edit-field">
    @(Html.TextAreaFor(model => model.Description, new { @class = "k-textbox", data_bind = "value:description" }))
</div>

@{
    ViewContext.FormContext = null;
}
Vladimir Iliev
Telerik team
 answered on 10 Jul 2014
1 answer
108 views
Dear Telerik Team!
When I delete more than one record in a grid without delay, Firefox (and also Chrome I believe) displays "prevent this page from creating additional dialogs" and offers the user to prevent futher confirmation dialogs. Unfortunately this means, that no more records can be deleted in this session if the the user checks this box.
Is there a way to change/customize the request behavior of the grid so that the security feature of Firefox will not be applied?
E.g. implementing a delay for some browsers or using modal html box?

brgds
Malcolm Howlett
Dimiter Madjarov
Telerik team
 answered on 09 Jul 2014
1 answer
170 views
Hi,
I have a grid with frozen columns and these columns do not list when I access thead or table field of kendo grid. How do I access static column headers? I need it to hide default filter operator menu on one of these fields.

Eg: When I do $("#grid").data('kendoGrid').thead on the following grid, it does not show the static columns:
http://demos.telerik.com/kendo-ui/grid/frozen-columns

Thanks
Dimiter Madjarov
Telerik team
 answered on 09 Jul 2014
1 answer
632 views
Hi Kendo Team,

I'm in the process of creating a page that uses MultiSelect with 5 values inside of it.  My objective is as users select the values a completely different set of checkboxes begin to enable or disable themselves based on the selections in the MS.  Unfortunately, it isn't working and I'm not entirely sure why.

@{
    var funds = new List<SelectListItem> {
        new SelectListItem() {
            Text = "Value 1", Value = "1"
        },
        new SelectListItem() {
            Text = "Value 2", Value = "2"
        },
        new SelectListItem() {
            Text = "Value 3", Value = "3"
        },
        new SelectListItem() {
            Text = "Value 4", Value = "4"
        },
        new SelectListItem() {
            Text = "Value 5", Value = "5"
        }
    };
}

    @(Html.Kendo().MultiSelect()
            .Name("select")
            .DataTextField("Text")
            .DataValueField("Value")
            .BindTo(funds)
            .Placeholder("Select Values ...")  
            .Events ( e =>
                          {
                              .Select("select")
                          }    
    )


    function select(e) {
        var values = this.value();
        if ($.inArray("1", values) != -1) {
            $("group1").removeAttr("disabled");
        }

        else {
            $("group1").attr("disabled", true)
        }
            };
Georgi Krustev
Telerik team
 answered on 09 Jul 2014
2 answers
103 views
Hi,

I wrote some codes like this getting the json data from the controller, which is working correctly:

        var data = new kendo.data.HierarchicalDataSource({
            transport: {
                read: {
                    url: "LoadActivityPermissions",
                    dataType: "json"
                }
            },
            schema: {
                model: {
                    id: "id",
                    children: "items"
                }
            }
        });
        $("#treeview").kendoTreeView({
            dataSource: data,
            dataTextField: "text",
            checkboxes: {
                checkChildren: true
            }
       
But for the checkboxes, the result is

when some of the children nodes' checkboxes are checked, the parent checkbox is still left unchecked (which is blank), but it should be like a " - " in the checkbox, which means some of its children are checked.

This happened only when I get the data from the "url" (controller).
 
In the attached shortcut, the checkbox for "RootActivity" should be filled in a " - ", which means some of its children have been checked.

Could anyone help me with this? It's very urgent for me.

Thanks and regards,

Charles























Blair
Top achievements
Rank 1
 answered on 08 Jul 2014
7 answers
159 views
Hello
I need to make a mouse multi date selection over the calendar and in best case over more then one calendar .
It must be possible  to do something like the image : http://img19.imageshack.us/img19/4718/calendarsp.png
It must be done in one selection by mouse.

1.I now it is not at the moment implemented in calendar , but is there a way to do it using the Drag-Drop functionality by example ..
2.Are there any plans for a multi selection in calendar?
3.How do I remove the functionality of the header ? I don't want to be possible to change the month and year and not by "prevent default" to the events ...
4.Is there a more interesting way to select the month ..currently I use the  .Value(DateTime.Parse("01-01-2013")) to show Jan month. Need something like ShowMonth("jan") or so  , because setting the value place the sellection mark on the specific day , I just need a month displayed with no possibility to change it ..
   
Dimo
Telerik team
 answered on 08 Jul 2014
1 answer
123 views
Hi All

I had some problem when using RadPivotGrid.

How to change those titles with underline?

i got a picture, please link to:
https://www.dropbox.com/s/q1bdw90af7z551i/001.png

Thank you for your help.

BRs
Ricson
ricson
Top achievements
Rank 1
 answered on 08 Jul 2014
5 answers
217 views
Hi there,

I am using the MVC scheduler month view for my project. I wanted to change the color of a day cell if it was a public holiday and am achieving this by using the Slots.each method in Scheduler databound event.

I also need to add a description on the day cell if it is a public holiday, How can i achieve this?

Is there a property that i can access in the slots.each method to set the description or title for the day cell.

Please help.

Cheers,

Chandra
Vladimir Iliev
Telerik team
 answered on 08 Jul 2014
Narrow your results
Selected tags
Tags
+? more
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?