javascript - 如何在向函数发送参数时删除单击的行？昏死

Question

我在删除服务时遇到了一些问题。我有删除服务器上服务的功能，但我必须重新加载页面以更新表。我找到了如何通过单击绑定(bind)删除行的方法，但存在问题，因为我只能删除行或从服务器获取用于删除服务的 ID，而不是两者。 :/

This is example of code that removes service on the server but doesn't remove table row.

HTML:

<table id="serviceView" class="fixed_header" border: 1>
            <thead>
                <tr>
                    <th>Name</th>
                    <th>Adress</th>
                    <th>Notification</th>
                </tr>
            </thead>
            <tbody  data-bind="foreach: services">
                <tr>
                    <td data-bind="text: name"></td>
                    <td data-bind="text: address"></td>
                    <td data-bind="text: serviceId"></td>
                    <td ><button data-bind="click: $parent.DeleteService.bind(this, serviceId)">Remove</button></td> 
                </tr>
            </tbody>

        </table>

JS:

self.services = ko.observableArray([]); 
    self.lastCheck = ko.observable();
    $.getJSON("http://localhost:55972/api/status", function (data) {
        self.services(data.services);
        self.lastCheck = data.lastCheck;
    });    //////This is loading data to the table from server

    self.DeleteService = function (serviceId) {
        $.ajax({
            type: "GET",
            url: "http://localhost:55972/api/services/remove/" + serviceId,
        }).done(function () {
            self.services.remove(serviceId)
        })

    };  

This is example of code that removes table row

当我像这样使用点击绑定(bind)时:

<button data-bind="click: $parent.DeleteService">Remove</button>

并将删除功能更改为:

self.DeleteService = function (serviceId) {
        self.services.remove(serviceId)
        $.ajax({
            type: "GET",
            url: "http://localhost:55972/api/services/remove/" + serviceId,
        }).done(function () {
            // here I want to remove row but i doesnt goes here without service ID.
        })

    };

它删除了 row 但取而代之的是 serviceId 我在 URL 中得到了 [object, object]。

你能帮我吗？我想到了使用 jquery 来更新表格，但是当我可以使用 knockout 时，这对我来说似乎不必要地复杂。

我知道解决方案并不难，但我就是无法解决它..... -_-

我很抱歉花时间讲这些废话，但这是我的第一个真正的项目，此时我非常绝望，因为我有很多事情要做，而且我一直坚持这一点。

Answer 1

在你的Js代码中，你可以试试这个:

self.services = ko.observableArray([]); 
    self.lastCheck = ko.observable();
    $.getJSON("http://localhost:55972/api/status", function (data) {
        self.services(data.services);
        self.lastCheck = data.lastCheck;
    });    //////This is loading data to the table from server
var serviceIdRemoved; 
    self.DeleteService = function (serviceId) {
serviceIdRemoved = serviceId; // now you can do whatever you need more with this value
        $.ajax({
            type: "GET",
            url: "http://localhost:55972/api/services/remove/" + serviceId,
        }).done(function () {
            self.services.remove(serviceId)
        })

    }; 

通过这种工作方式，您可以使用变量的内容并且不会丢失它。此外，如果您获得 [Object, Object]，您可以:

console.log(serviceId) // to see the content in the console.

JSON.stringify(data) //to see the content in html

This source could help you更好地理解它。