Grid cancel deletes row, and update sends every row to controller

3 posts, 0 answers
  1. Austin
    Austin avatar
    4 posts
    Member since:
    Feb 2018

    Posted 25 Apr Link to this post

    I have two issues.
    The first is, when I am using the 'inline' or 'popup' editing, the row I am editing gets deleted on cancel click. I know I need to add an "Id" to the Model in my schema but I'm not sure how to do that using remote data. The data coming over does not have any unique identifiers unless you use and AccountNumber and FeeTypeID together.
    Second is I am trying to have the UpdateFunction to just do an AJAX call to send the 4 variables to my controller as JSON. I searched and searched but I cannot edit the Update functionality to only send the current editing row to the controller. It sends every row. 
    Here is my Schema,
    schema: {
                    model: {
                        fields: {
                            AccountNumber: { type: "string", nullable: false, editable: false },
                            Description: { defaultValue: { ID: 1, Description: "Recurring Annual Unified Plan Fee" } },
                            FeeTypeID: { type: "number", editable: false },
                            FeeValue: { type: "string", validation: { required: true } }
                        }
                    }
                }

    and here is the update click function
    function updateCustomFee(e) {
            e.preventDefault();
            var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
            var AccountNumber = dataItem.AccountNumber;
            var Description = dataItem.Description;
            var FeeTypeID = dataItem.FeeTypeID;
            var FeeValue = dataItem.FeeValue;
            alert(AccountNumber);
            $.ajax({
                type: 'POST',
                url: '/Four08b2/EditCustomFeeList',
                data: { "accountNumber": AccountNumber, "description": Description, "feeTypeID": FeeTypeID, "feeValue": FeeValue },
                dataType: 'json',
                success: function (result) {
                    alert(result);
                }
            });
        }
  2. Georgi
    Admin
    Georgi avatar
    250 posts

    Posted 27 Apr Link to this post

    Hi Austin,

    Straight to your questions.

    1. It is necessary to specify which field of the model is its id since the dataSource tracks its state by the id (whether it is modified, selected when persist selection is enabled, etc...). Since the dataSource supports only a single field identifiers it is possible within the schema.parse handler to add a field to the model which is a combination of FeeTypeID and AccountNumber.

    e.g.
    schema: {
      parse: function(response) {
        response = response.map(function(x){       
          x.Id  = x.FeeTypeID + x.AccountNumber;
          return x;
        })
        return response;
      }
    }

    Then specify the new field as an id of the model.

    e.g.

                  model: {
    id: "Id"
    }

    2. The sync method of the dataSource updates all untracked changes. When the Id of the model is not specified the dataSource cannot track the items and therefore treats all of them as newly inserted items. That is why all the rows are sent when the update button is pressed.


    Regards,
    Georgi
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Austin
    Austin avatar
    4 posts
    Member since:
    Feb 2018

    Posted 27 Apr Link to this post

    Georgi,

    Thank you for your quick response! I have updated my code accordingly and it works like a charm. I temporarily fixed the problem by setting the ID to just the FeeTypeID and it worked, but I was afraid something may get overwritten as the FeeTypeID in my data is not unique. Thanks so much!

    -Austin

Back to Top