Editor template pass the id

11 posts, 0 answers
  1. David
    David avatar
    77 posts
    Member since:
    Nov 2011

    Posted 27 Feb 2019 Link to this post

    How does one pass the id to the template so one can use it basically i want 0 for adding a record then obv the id value for eidting a record how does one acheive this when using a custom command editor for template.
  2. Adam
    Adam avatar
    7 posts
    Member since:
    Aug 2018

    Posted 28 Feb 2019 in reply to David Link to this post

    Hello David,

    Creating a new record will pass an empty instance of your model to the template. When performing an update, an existing instance of your model must be passed to the template. To do this, you can use the following:

    .DataSource(dataSource => dataSource.Model(model => model.Id(m => m.Id)))

    This will use the Id of the record that you are editing to look up the remainder of the missing properties for that instance.

  3. Tsvetomir
    Admin
    Tsvetomir avatar
    830 posts

    Posted 04 Mar 2019 Link to this post

    Hello,

    By default, when a new record in the Kendo UI Grid is created, the ID is populated with the default value of the data type that is used for the field. For instance, if the ID is an integer, then the default value is 0. The record is sent to the server with the empty record. The ID has to be set on the server or by the database. It would not be expected a client-side grid to modify the ID. 

    As per editing functionality of the grid, the ID must be specified in the data source's model beforehand, as shown by Adam's code snippet:

    .DataSource(dataSource => dataSource.Model(model => model.Id(m => m.Id)))

    This is mandatory for the editing of the grid to be working as expected. Also, it will be accessible in the custom template. 


    Best regards,
    Tsvetomir
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  4. David
    David avatar
    77 posts
    Member since:
    Nov 2011

    Posted 04 Mar 2019 Link to this post

    I am having an issue on accessing the activity lines in the razor though how would i do this.
  5. David
    David avatar
    77 posts
    Member since:
    Nov 2011

    Posted 04 Mar 2019 Link to this post

    I am already doing this do you no what i am doing wrong here 

     

    001.@model FuelActivityTrackerDal.ViewModels.ActivityEditViewModal
    002. 
    003. 
    004.<div class="container py-5">
    005.    <div class="row">
    006.        <div class="col-md-10 mx-auto">
    007.            <form>
    008.                <div class="form-group row">
    009.                    <div class="col-sm-9">
    010.                        <label for="inputFirstname">Activty Name</label>
    011.                        <input type="text" class="form-control" id="inputFirstname" placeholder="Activity name">
    012.                    </div>
    013.                </div>
    014.                <div class="form-group row">
    015. 
    016.                    <div class="col-sm-3">
    017.                        <label for="inputLastname" class="form-control">Activity Start Date</label>
    018.                        @Html.Kendo().DateTimePickerFor(model => model.ActivityDate)
    019.                    </div>
    020.                    <div class="col-sm-3">
    021.                        <label for="inputLastname" class="form-control">Activity End Date</label>
    022.                        @Html.Kendo().DateTimePickerFor(model => model.ActivityEndDate)
    023.                    </div>
    024. 
    025.                </div>
    026.                <div class="form-group row">
    027. 
    028.                    <div class="col-sm-3">
    029.                        <label for="inputLastname" class="form-control">Location</label>
    030.                        @foreach (var item in (SelectList)ViewBag.Location)
    031.                        {
    032.                            @Html.RadioButtonFor(model => model.OnSite, item.Value, false)
    033.                            <label class="control-label">@item.Text</label>
    034.                        }
    035.                    </div>
    036. 
    037.                </div>
    038.                <div class="form-group row">
    039.                    <div class="col-md-10">
    040.                        <label for="inputLastname" class="form-control">Description</label>
    041.                        @Html.TextAreaFor(model => model.Description, new { @class = "whatever-class", @cols = 115, @rows = 10 })
    042. 
    043.                    </div>
    044.                </div>
    045.                <div class="form-group row">
    046.                    <div class="col-sm-6">
    047.                        <label for="inputCity">Status </label>
    048.                        <select asp-for="Status"
    049.                                class="form-control"
    050.                                asp-items="@(new SelectList(@ViewBag.ProjectStatusTypes,"LookupCode", "LookupDescription"))"></select>
    051. 
    052. 
    053.                    </div>
    054.                    <div class="col-sm-3">
    055.                        <label for="inputState">ActivityType </label>
    056.                        <select asp-for="ActivityType"
    057.                                class="form-control"
    058.                                asp-items="@(new SelectList(@ViewBag.ProjectTypes,"LookupCode", "LookupDescription"))"></select>
    059. 
    060. 
    061.                    </div>
    062.                </div>
    063. 
    064.                <div class="form-group row">
    065.                    <div class="col-sm-6">
    066.                        <label for="inputCity">Staff </label>
    067.                        <select asp-for="StaffID"
    068.                                class="form-control"
    069.                                asp-items="@(new SelectList(@ViewBag.ListOfStaff,"StaffID", "FirstName"))"></select>
    070. 
    071.                    </div>
    072.                    <div class="col-sm-3">
    073.                        <label for="inputState">Hours Left On Project </label>
    074.                        <label for="inputState"><div class="badge" style="font-size:18px;">26</div> </label>
    075.                        <label for="projecthours">If Porject hours fall below ten Contact Charlie.</label>
    076.                    </div>
    077.                </div>
    078. 
    079. 
    080.                <div class="form-group row">
    081. 
    082.                    <div class="col-sm-12">
    083. 
    084.                        @(Html.Kendo().Grid<FuelActivityTrackerDal.Models.ActivityLines>
    085.    ().Name("activityLines")
    086. 
    087.    .Columns(columns =>
    088.    {
    089.    columns.Bound(p => p.Description).Filterable(false);
    090.    columns.Bound(p => p.StartTime).Filterable(false);
    091.    columns.Bound(p => p.EndTime).Filterable(false);
    092.    columns.Bound(p => p.Status);
    093.    columns.Command(command => command.Custom("ViewDetails").Click("showDetails"));
    094. 
    095.    })
    096.    .DataSource(dataSource => dataSource
    097.    .Ajax()
    098.    .Events(events => events.Error("error_handler"))
    099.    .Model(model => model.Id(p => p.ActivityLineId))
    100.    .Read(read => read.Action("ActivityLines_Read", "Activity"))
    101.   .Update(update => update.Action("ActivityLines_Update", "Activity").Type(HttpVerbs.Post)))
    102. 
    103.    ))
    104.</div>
    105.                </div>
    106. 
    107.                <div class="form-group row">
    108.                    <div class="col-sm-6">
    109. 
    110.                    </div>
    111.                </div>
    112. 
    113. 
    114.                <button type="button" class="btn btn-primary px-4 float-right">Add Work Item</button>
    115.                <button type="button" class="btn btn-primary px-4 float-right">Put Case & Client On Hold</button>
    116.                <button type="button" class="btn btn-primary px-4">Cancel</button>
    117.            </form>
    118.        </div>
    119.    </div>
    120.    @(Html.Kendo().Window().Name("Details")
    121.                    .Title("Activity Details")
    122.                    .Visible(false)
    123.                    .Modal(true)
    124.                    .Draggable(true)
    125.                    .Width(400)
    126.    )
    127.    <script type="text/x-kendo-template" id="template">
    128.        <form method="post" action="@Url.Action("ActivityLines_Update", "Activity")">
    129. 
    130.            <div id="details-container">
    131. 
    132.                ActivitiyHeadId
    133.                <div class="form-group row">
    134.                    <div class="col-sm-9">
    135.                        <label for="inputFirstname">Activty Name</label>
    136.                        <input type="text" class="form-control" id="inputFirstname" placeholder="Activity name">
    137.                    </div>
    138.                </div>
    139.                <div class="form-group row">
    140.                    <div class="col-md-10">
    141.                        <label for="inputLastname" class="form-control">Description</label>
    142.                  
    143.                    </div>
    144.                </div>
    145.                <div class="form-group row">
    146.                    <div class="col-md-6">
    147.                        <label for="inputLastname" class="form-control">Start Time</label>
    148. 
    149. 
    150.                    </div>
    151.                    <div class="col-md-6">
    152.                        <label for="inputLastname" class="form-control">End Time </label>
    153. 
    154. 
    155.                    </div>
    156.                </div>
    157. 
    158.            </div>
    159.            <input type="submit" class="btn btn-file px-4" value="Save Work Item" />
    160. 
    161. 
    162.            <button type="button" class="btn btn-primary px-4">Cancel</button>
    163. 
    164.        </form>
    165.    </script>
    166. 
    167.    <script type="text/javascript">
    168.        var detailsTemplate = kendo.template($("#template").html());
    169. 
    170.        function showDetails(e) {
    171.            e.preventDefault();
    172. 
    173.            var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
    174.            var wnd = $("#Details").data("kendoWindow");
    175. 
    176.            wnd.content(detailsTemplate(dataItem));
    177.            wnd.center().open();
    178.        }
    179.    </script>
    180. 
    181. 
    182.</div>

     

     

    [AcceptVerbs("Post")]
         public bool SaveWorkItem(ActivityLines activityLines)
         {
        
             return _activityRepo.UpdateActivityLines(activityLines);
     
     
         }
     
         [AcceptVerbs("Post")]
         public ActionResult EditingPopup_Update([DataSourceRequest] DataSourceRequest request, ActivityHeader activity)
         {
             if (activity != null)
             {
                 UpdateActivity(activity);
             }
     
             return Json(new[] { activity }.ToDataSourceResult(request, ModelState));
         }
         [AcceptVerbs("Post")]
         public ActionResult ActivityLines_Update([DataSourceRequest] DataSourceRequest request, ActivityLines activityLines)
         {
     
             if (activityLines != null)
             {
                 _activityRepo.UpdateActivityLines(activityLines);
             }
             return Json(new[] { activityLines }.ToDataSourceResult(request, ModelState));
     
     
     
         }
         public ActionResult ActivityLines_Read([DataSourceRequest]DataSourceRequest request)
         {
     
             var result = GetAllActivityLines();
     
             var dsResult = result.ToDataSourceResult(request);
             return Json(dsResult);
     
         }
     
     
     
         public ActionResult Activity_Read([DataSourceRequest]DataSourceRequest request)
         {
             var result = GetAllActivityHeader();
     
             var dsResult = result.ToDataSourceResult(request);
             return Json(dsResult);
         }
  6. David
    David avatar
    77 posts
    Member since:
    Nov 2011

    Posted 04 Mar 2019 in reply to David Link to this post

    If u look through the code for the view details you wil see the issue i am having trouble with. 
  7. David
    David avatar
    77 posts
    Member since:
    Nov 2011

    Posted 05 Mar 2019 Link to this post

    My model is as follows

    public class ActivityHeader
       {
           public int ActivityHeaderId { get; set; } //(int, null)
           public DateTime? ActivityDate { get; set; } //(date, null)
           public string Name { get; set; } //(nvarchar(350), null)
           public DateTime? ActivityEndDate { get; set; } //(datetime, null)
           public string ProblemDescription { get; set; }
           public string Description { get; set; } //(nvarchar(max), null)
     
           public int? ActivityLinesId { get; set; } //(int, null)
           public int? HoursLeftOnProject { get; set; } //(time(7), null)
           public int? Status { get; set; } //(nchar(10), null)
             public DateTime? CreatedDate { get; set; } //(date, null)
           public string CreatedBy { get; set; } //(nvarchar(50), null)
           public bool? isActive { get; set; } //(bit, null)
           public bool? isDeleted { get; set; } //(bit, null)
           public bool? isArchived { get; set; } //(bit, null)
           public int? SOP { get; set; } //(nvarchar(50), null)
           public int? OnSite { get; set; }
           public int? Remote { get; set; }
            
           public int? DepartmentId { get; set; } //(int, null)
           public string EmployeeName { get; set; } //(nvarchar(301), null)
           [ForeignKey("StaffId")]
           public int? StaffId { get; set; }
           public  virtual StaffMembers StaffMembers { get; set; }
        
           public ICollection<ActivityLines> ActivityLines { get; set; }
     
     
       }

     

    Activity Lines

    public class ActivityLines
      {
          [Key]
          public int ActivityLineId { get; set; } //(int, not null)
          public int? ActivityHeaderId { get; set; } //(int, null)
          public string Description { get; set; } //(nvarchar(max), null)
          public string Notes { get; set; } //(nvarchar(max), null)
          public DateTime? StartTime { get; set; } //(time(7), null)
          public DateTime? EndTime { get; set; }
          public DateTime? StartDate { get; set; }
          public DateTime? EndDate { get; set; } //(time(7), null)
          public int? StaffMemeber { get; set; } //(int, null)
          public bool? isActive { get; set; } //(bit, null)
          public bool? isDeleted { get; set; } //(bit, null)
          public string CreatedBy { get; set; } //(nvarchar(50), null)
          public DateTime? CreatedDate { get; set; } //(date, null)
          public int? Status { get; set; } //(int, null)
        
      }

     

    MyContext for upadting the poopup contents its here i need to no the id.

     

    public bool UpdateActivityLines(ActivityLines activityLines)
           {
     
     
               bool retval = false;
     
               _db.Update(activityLines);
               _db.SaveChanges();
     
     
     
               return retval;
           }
     
           public bool UpdateActivityHeader(ActivityHeader activitys)
           {
     
               bool retval = false;
     
               _db.Update(activitys);
               _db.SaveChanges();
     
     
     
               return retval;
     
     
           }

     

     

  8. David
    David avatar
    77 posts
    Member since:
    Nov 2011

    Posted 05 Mar 2019 in reply to David Link to this post

    This is how i get all the activity lines for an acitivy i obv need to find also a way to pass the main id to the actitivy lines function.

     

    public List<ActivityLines> GetActivityLines()
      {
     
          var staffRepo = new StaffRepositry(_db);
     
          List<ActivityLines> _activityLines = new List<ActivityLines>();
          _activityLines = _db.ActivityLines.AsNoTracking().ToList();
          return _activityLines;
     
     
      }
  9. Tsvetomir
    Admin
    Tsvetomir avatar
    830 posts

    Posted 07 Mar 2019 Link to this post

    Hi David,

    I have noticed that the data item is passed to the template:

    167.    <script type="text/javascript">
    168.        var detailsTemplate = kendo.template($("#template").html());
    169.
    170.        function showDetails(e) {
    171.            e.preventDefault();
    172.
    173.            var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
    174.            var wnd = $("#Details").data("kendoWindow");
    175.
    176.            wnd.content(detailsTemplate(dataItem));
    177.            wnd.center().open();
    178.        }
    179.    </script>

    Which means that all of the fields of the model are accessible in the initial template. They can be accessed by using the "#=  #" syntax:

    127.    <script type="text/x-kendo-template" id="template">
                          
    132.                <div>#=ActivitiyHeadId#</div>

    Try the suggestion above and let me know in case the issue persists.


    Best regards,
    Tsvetomir
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  10. David
    David avatar
    77 posts
    Member since:
    Nov 2011

    Posted 07 Mar 2019 in reply to Tsvetomir Link to this post

    I have a ticket that i am using in the support area still having issues the read is no longer reading correctly thanks.
  11. Tsvetomir
    Admin
    Tsvetomir avatar
    830 posts

    Posted 12 Mar 2019 Link to this post

    Hi David,

    Based on the provided information, both here and in the official Support ticket, I assume that you would like firstly to pass the id of the master row to the template. And, secondly, to pass the id to the Read ActionMethod in the Controller, is that correct?

    If so, then the additional parameter can be passed to the controller via the data source. For example:

    .Read(read => read.Action("HierarchyBinding_Orders", "Grid", new { employeeID = "#=EmployeeID#" }))

    And it can be retrieved as follows: 

    public ActionResult HierarchyBinding_Orders(int employeeID, [DataSourceRequest] DataSourceRequest request)
    {
         // logic to load data in the child grid
    }

    This approach has been depicted in our Hierarchy live demo which can be found here:

    https://demos.telerik.com/aspnet-core/grid/hierarchy


    Kind regards,
    Tsvetomir
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top