Custom Popup editor with Javascript or AngularJs

5 posts, 1 answers
  1. Steve
    Steve avatar
    53 posts
    Member since:
    Jul 2010

    Posted 26 Feb Link to this post

    Hi,

         I read many threads about configuring custom popup editor in KendoUI Grid like this one.

    http://www.telerik.com/forums/custom-popup-editor-with-additional-fields

    I also found how to use a separate html file and use it as a template.  However, I didn't find how to use javascript to access model inside this template.  The answer il always to implement edit event to access model and change behavior.  In my case, fields shown changes depending on many criterias like:  Field 1 ID is 1 or 2 and Field 2 ID is 4 for example.

    If it is possible to use AngularJs, it is better :-)

     

    Thank you

     

  2. Answer
    Alexander Popov
    Admin
    Alexander Popov avatar
    1416 posts

    Posted 02 Mar Link to this post

    Hi Steve,

    Have you checked the following examples: 

    Regards,
    Alexander Popov
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. UI for ASP.NET MVC is VS 2017 Ready
  4. Steve
    Steve avatar
    53 posts
    Member since:
    Jul 2010

    Posted 06 Mar in reply to Alexander Popov Link to this post

    Hi,

        I didn't see those examples and I will try this.  It seems to be exactly what I'm trying to do.

    Thank you for your help

  5. Steve
    Steve avatar
    53 posts
    Member since:
    Jul 2010

    Posted 07 Mar in reply to Alexander Popov Link to this post

    Hi,

       I have some problems with dropdownlist.  In the template, I have:

    <div class="k-edit-field"><input name="AssignmentType" data-value-field="AssignmentTypeId" data-text-field="Description" data-source="assignmentTypeDataSource" data-bind="value: AssignmentType" kendo-dropdownlist data-role="dropdownlist" /></div>

    In angular, I have:

            $scope.assignmentTypeDataSource = new kendo.data.DataSource({
                data: [
                    { AssignmentTypeId: 1, Description: "Instructor" },
                    { AssignmentTypeId: 2, Description: "Assistant Professor" }
                ]
            });

     

    If I remove data-value-field and data-text-field, dropdownlist is filled with 2 lines [object Object]

    When I does not remove these attributes, the dropdown is not filled (show no entry).

     

    Note: my model column is AssignmentType (object like assignmentTypeDataSource containing AssignmenTypeId and Description).  I tried before with binding to remote data, but I tried this binding only to simplify the code and find the problem...

     

    Thank you

     

  6. Steve
    Steve avatar
    53 posts
    Member since:
    Jul 2010

    Posted 09 Mar in reply to Steve Link to this post

    Hi,

     

       I found the problem.  I was using 

    data-text-field and data-value-field instead of 

    k-data-text-field and k-data-value-field.

     

    Thank you

Back to Top
UI for ASP.NET MVC is VS 2017 Ready