删除项目实际上并没有删除它

Delete item is not actually removing it

本文关键字:删除 并没有 实际上 删除项目      更新时间:2023-09-26

我有一个编辑表单,显示已添加/存储的项目,并带有删除项目的选项。如果我单击"删除","保存",则会弹出成功消息,但是当我返回列表的显示时,我刚刚"删除"的项目仍然存在。

这是显示项目旁边带有删除按钮的表:

<table id="newPatientForm">
        <tr>
            <th>First Name</th>
            <th>Last Name</th>
            <th></th>
        </tr>
        <tbody data-bind="foreach:Patients">
            <tr>
                <td class="form-group"><input data-bind="value: FirstName, event: {change: flagPatientAsEdited}, hasfocus: true" /></td>
                <td class="form-group"><input data-bind="value: LastName" /></td>
                <td class="form-group"><button data-bind="click: $parent.deletePatient">Delete</button></td>
            </tr>
        </tbody>
    </table>

这是我声明"患者删除"的视图模型

using OnboardingProject.Model;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
namespace OnboardingProject.Web.ViewModels
{
    public class SiteViewModel : IModel
    {
        public SiteViewModel()
        {
            Patients = new List<PatientViewModel>();
            PatientsToDelete = new List<int>();
        }
        public int SiteId { get; set; }
        public string Name { get; set; }
        public string Address { get; set; }
        public string City { get; set; }
        public string State { get; set; }
        public string Zip { get; set; }
        public string CreatedOn { get; set; }
        public string ModifiedOn { get; set; }
        public ObjectState ObjectState { get; set; }
        public string MessageToClient { get; set; } // Message sent to client from server to demonstrate data-flow when property is not in db
        // @TODO: Change to client CompleteAddress
        public string CompleteAddress
        {
            get
            {
                return string.Format("{0} {1}, {2} {3}", this.Address, this.City, this.State, this.Zip);
            }
        }
        public List<PatientViewModel> Patients { get; set; }
        public List<int> PatientsToDelete { get; set; }
    }
}

这是整个 js 文件:

var ObjectState = {
    Unchanged: 0,
    Added: 1,
    Modified: 2,
    Deleted: 3
};
var patientMapping = {
    'Patients': {
        key: function (patient) {
            return ko.utils.unwrapObservable(patient.PatientId);
        },
        create: function (options) {
            return new PatientViewModel(options.data);
        }
    }
};
PatientViewModel = function (data) {
    var self = this;
    ko.mapping.fromJS(data, patientMapping, self);
    self.flagPatientAsEdited = function () {
        if (self.ObjectState() != ObjectState.Added) {
            self.ObjectState(ObjectState.Modified);
        }
        return true;
    },
    self.FullName = ko.computed(function () {
        return (self.FirstName() + " " + self.LastName());
    });
}
SiteViewModel = function (data) {
    var self = this;
    ko.mapping.fromJS(data, patientMapping, self);
    self.save = function () {
        $.ajax({
            url: "/Site/Save/",
            type: "POST",
            data: ko.toJSON(self),
            contentType: "application/json",
            success: function (data) {
                if (data.siteViewModel != null) {
                    alert("Changes were saved successfully.");
                    ko.mapping.fromJS(data.siteViewModel, {}, self);
                }
                if (data.newLocation != null) {
                    window.location = data.newLocation;
                }
            }
        });
    },
    self.flagSiteAsEdited = function () {
        if (self.ObjectState() != ObjectState.Added) {
            self.ObjectState(ObjectState.Modified); // KO observables are functions & !properties 'tf pass value in function
        }
        return true; // Tell KO to allow default action for control that raised this event
    },
    self.addPatient = function () {
        var patient = new PatientViewModel({ SiteId: 0, FirstName: "", LastName: "", ObjectState: ObjectState.Added });
        self.Patients.push(patient);
    },
    self.deletePatient = function (patient) {
        self.Patients.remove(this);
        if (patient.PatientId() > 0 && self.patientsToDelete.indexOf(patient.PatientId()) == -1) {
            self.PatientstoDelete.push(patient.PatientId());
        }
    };
}

更新:经过一些调试,我注意到js文件中的"PatientsToDelete"被列为未定义,即使我在ViewModel中声明了它。js文件中还有我缺少的东西吗?

在这一行中:

self.PatientstoDelete.push(patient.PatientId());

您没有将 T 大写

self.PatientsToDelete.push(patient.PatientId());
//           ^--- Capitalize this T