In Custom popup editor, Update button always trigger 'create' event

12 posts, 0 answers
  1. Paddy
    Paddy avatar
    12 posts
    Member since:
    Aug 2015

    Posted 23 Nov 2015 Link to this post

    The attached picture1 is what I want to achieve. In the grid there is a list for students and their favorite fruits. The favorite fruits list only for text, in database they are saved as comma seperated numbers such as 1,2,3, and in the data source schema, there is a column for it named fids. And for the fruits, there is a table in database, and an additional odata source for it.
     In the popup editor, I only want to change their favorites not others, and the popup editor is implemented as checkboxes list, just like attachment picture2. The checkboxes list is initialized in the edit event of the gird. In the grid edit event, I have the following code:


      edit: function (e) {
            $("#fruitLists").css({ 'overflow-y': 'scroll', 'width': '280px', 'height': '170px' });

            var checkboxes = '';
            var fruitArray = e.model.fids.split(",");
            var data = that.fruitDataSource.data();
            for (var i = 0; i < data.length; i++) { //generate checkboxes list
                var checked = fruitArray.indexOf(data[i].id + '') > -1 ? "checked" : "";
                checkboxes += "<input type=\"checkbox\" name=\"fruitIdent\" value=\"" + data[i].id + "\" " + checked + " />" + data[i].name + "<br />\n";
            }
            $("#fruitLists").html(checkboxes);

            e.container.find(".k-button.k-button-icontext.k-primary.k-grid-update").click(function () {
                var checkedItems = [];
                $("input[name='fruitIdent']:checked").each(function () { checkedItems.push($(this).val()); });
                e.model.fids = checkedItems.join();

                //update favorite fruits...

                $("#grid").data("kendoGrid").saveRow();           
            });        
        },

    My template for popup editor:
    <div class="k-edit-form-container" id="popEditor">
        <script id="popup_editor" type="text/x-kendo-template">
            <div id="fruitLists" style="margin-left:35px">

            </div>
    </script>
    </div>


    And the schema for students list:
        model: {
            id: "id",
            fields: {
                id: { type: "number", nullable: false, editable: false },   //headmap
                name: { type: "string", nullable: true },
                favorits: { type: "string", nullable: true },
                fids: { type: "string", nullable: true },
            },
        },

    The curious is that, each time I click the Update button, it always trigger data source - transport's create event, not update event. Why? I searched this forum, many guys says that it is because the schema has no id or the popup UI has no id, but even I added the id field, only create event is fired with a null model. 

    Why my approach does not work? Is there any solution? Thansk.


  2. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2895 posts

    Posted 25 Nov 2015 Link to this post

    Hello Paddy,

    The create transport of the DataSource will trigger when the saved record does not have an ID. I see that you have defined the ID in the schema configuration, but could you please confirm that each of the dataItems in the dataSource has an "id" field with unique value different from null or undefined?

    Regards,
    Alexander Valchev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Paddy
    Paddy avatar
    12 posts
    Member since:
    Aug 2015

    Posted 25 Nov 2015 Link to this post

    Hi Alexander, thank you for your reply. You say "please confirm that each of the dataItems in the dataSource has an "id" field with unique value different from null or undefined", what do you mean the dataitems? The data listed in the grid? I'm very sure that each row does contain a unique id.Or how can I find there are invalid IDs? In the edit event of grid, I can see the id of the current row to be edited and it is a valid one. What to check next? Is there a way to change the event? Or change the model before saving? I'm looking forward to your reply... Thanks!
  4. Paddy
    Paddy avatar
    12 posts
    Member since:
    Aug 2015

    Posted 25 Nov 2015 Link to this post

    Hi Alexander, if the row being edited does contain a valid id, then how could the id get lost while saving? Is it a reason that my popup editor does not contain it. You can see from the attachment that my popup does not need ids and other fields to be shown, what I need is only a checkbox list. Is that a reason causing the model to lose id? Can I preserve id in the popup without showing them? 
  5. Paddy
    Paddy avatar
    12 posts
    Member since:
    Aug 2015

    Posted 25 Nov 2015 Link to this post

    What I'm confused is that, even after I added the id field in the popup template:

            <div class="k-edit-label">
                <label for="id">id</label>
            </div>
            <div class="k-edit-field">
                <input type="text" class="k-input k-textbox" name="id" data-bind="value:id" />
            </div>

    When I click the Update button and it only trigger create event. 

  6. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2895 posts

    Posted 27 Nov 2015 Link to this post

    Hi Paddy,

    If the create transport fires that means that according to the DataSource the record is considered as newly created. This will happen when the record does not have a unique ID.

    According to your reply each record has unique ID. We can verify this by hooking up to the save event of the Grid and execute the following code:

    editable: "popup",
    save: function(e) {
          console.log(e.model.isNew());
    }

    What is the console.log output in your case?
    Looking forward to your reply.

    Regards,
    Alexander Valchev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  7. Paddy
    Paddy avatar
    12 posts
    Member since:
    Aug 2015

    Posted 29 Nov 2015 in reply to Alexander Valchev Link to this post

    Hi Alexander,

    The output for my case is false.  Is that weird?

     

  8. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2895 posts

    Posted 02 Dec 2015 Link to this post

    Hello Paddy,

    Yes this is unusual. Is it possible for you to provide a Kendo Dojo or sample project with mock data that isolates the issue? In this way I will be able to reproduce it locally and examine what exactly is going wrong.

    Regards,
    Alexander Valchev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  9. Lorenzo
    Lorenzo avatar
    42 posts
    Member since:
    Jul 2009

    Posted 21 Apr 2016 in reply to Alexander Valchev Link to this post

    Hi, I'm experiencing the exact same situation. Do you have any update on this ?

    Lorenzo

  10. Lorenzo
    Lorenzo avatar
    42 posts
    Member since:
    Jul 2009

    Posted 21 Apr 2016 in reply to Lorenzo Link to this post

    Hi, after some try I kind of figured out a workaround. The problem in my case seems the fact that the ID i a number. If i replace the key with a dummy ToString() of my Int32 key it works.

     

  11. Lorenzo
    Lorenzo avatar
    42 posts
    Member since:
    Jul 2009

    Posted 21 Apr 2016 in reply to Lorenzo Link to this post

    UPDATE

    I figured out that if the ID is a number (in my case lineNum) and it is defined both as ID and in the fields the strange behavior occurs:for each update also a create is triggered.

    If the ID is a string putting it both in ID and in the fields doesn't make any difference.

    Now lineNum is only the ID and it works.

    Lorenzo

     

  12. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2895 posts

    Posted 26 Apr 2016 Link to this post

    Hello Lorenzo,

    Please provide a sample project where we can observe the behaviour. In this way we will be able to examine it in details and assist you further.

    Regards,
    Alexander Valchev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
Back to Top