当主动尝试更改数据集值时，可以按数据集对列表进行排序

发布于 2025-01-23 16:22:32 字数 684 浏览 1 评论 0原文

我正在使用CEFSHARP在C＃中编写一个应用程序。我正在为此项目使用C＃，JavaScript和HTML/CSS。

我最近发布了一个问题，内容是根据列表中的上述项目的InnerHTML文本对列表进行排序的问题。我在此方面得到了帮助，但是需求有所改变，我无法在实际文本中拥有索引号。

我设法通过使用HTML中的数据集来解决此问题。我遇到了列表排序的问题，但是我确信它应该在技术上工作，所以我将JSFIDDLE中的所有内容隔离了。一切都很好，所以我决定一次在功能中添加一些元素。

我发现排序停止工作，因为我正在尝试更改数据集的值。数据集的实际值正在成功地发生变化，但是出于某种原因，排序停止工作。如果我不尝试更改数据集的值，则可以完美地工作。这些是相关代码：

winforms函数（已编辑，每1000ms执行一次）：

private async void timer1_Tick(object sender, EventArgs e)
{
   foreach (var order in orderResult.OrderResult.Select((value, i) => (value, i)))
   {
        chromeBrowser.ExecuteScriptAsync("updateOrderQueue", order.i, order.value.Reference, order.value.PickedUpAt == "" ? "

原文

I'm writing an application in C# with Cefsharp. I'm utilizing C#, JavaScript and HTML/CSS for this project.

I recently posted a question about issues with sorting a list based on the innerHTML text of the said item (the text included the index of the list item) in the list. I received help with this, however the demands changed a bit and I can no longer have the index number in the actual text.

I managed to solve this by using datasets in HTML instead. I was having issues making the list sort but I was sure that it technically should work so I isolated everything in jsfiddle. Everything worked perfectly, so I decided to add a few of the elements in my function at a time.

I found out that the sorting stops working because I'm trying to change the values of my datasets. The actual value of the datasets are succesfully changing, however the sorting stops working for some reason. If I'm NOT trying to change the values of the datasets, it works perfectly. These are the relevant codes:

WinForms function (redacted, executed every 1000ms):

private async void timer1_Tick(object sender, EventArgs e)
{
   foreach (var order in orderResult.OrderResult.Select((value, i) => (value, i)))
   {
        chromeBrowser.ExecuteScriptAsync("updateOrderQueue", order.i, order.value.Reference, order.value.PickedUpAt == "" ? "????" : order.value.PickedUpAt,
                            order.value.DeliveredTo == "" ? "????" : order.value.DeliveredTo, order.value.RobotId.Length > 0 ? order.value.RobotId.Remove(0, 4) : order.value.RobotId,
                            order.value.StatusCode, status.GetOrderStatus(order.value.StatusCode));
   }
}

JavaScript functions:

function updateOrderQueue(index, reference, pickedup, deliveredto, robotId, statuscode, statustext) {
    var list = $('ul#orderQueueList');
    var count = $("ul#orderQueueList li").length;
    var item = jQuery("#order" + jq(reference));
    var robotQueue = jQuery("#robotQueue" + jq(reference))

    if (!document.getElementById('order' + reference) && statuscode < 4 && count < 9) {
        var data = $(`<li data-indexn="` + index + `" class="list-group-item list-group-item-secondary d-flex justify-content-between align-items-center border border-dark" id="order` + reference + `">
                        <h3 class="mt-1" id="text`+ reference + `">
                            `+ index + `) ` + pickedup + ` ➔ ` + deliveredto + ` (` + statustext + `)
                        </h3>
                        <small class="badge badge-dark rounded" style="font-size:24px;" id="robotQueue`+ reference + `">` + robotId + `</small>
                    </li>`);
        data.appendTo(list).hide().fadeIn(500);
    } else {
        var locations = jQuery("#text" + jq(reference));
        var assignedrobot = jQuery("#robotQueue" + jq(reference));
        locations.text(index + ') ' + pickedup + ' ➔ ' + deliveredto + ' (' + statustext + ')');
        assignedrobot.text(robotId);
    }

    item.attr("data-indexn", index);
    
    sortList();
}

function sortList() {
    $("#orderQueueList li").sort(function (a, b) {
        return parseInt($(a).data('indexn')) - parseInt($(b).data('indexn'));
    }).appendTo('#orderQueueList');
}

When this code is removed from my JavaScript function, everything works as intended:

item.attr("data-indexn", index);

This is the list in the HTML code:

<ul id="robotQueue">
    <li id="order######" data-indexn="0">
       TEXT
    </li>
</ul>

I've tried to isolate as much as I can to try and find what causes it but I can't figure it out. Sorry if the post is a bit long.

Thanks!

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

呆头 2025-01-30 16:22:32

好吧，所以我不确定这个是否实际上是一个答案。根据我一直在阅读的所有内容，使用 attr（）方法的使用应非常有效，以设置数据集的值（这是我尝试的要做的）。它确实为每个项目提供了成功设置新值，但由于某种原因，它也与排序混乱，使其不再起作用。

找不到有关为什么这不起作用的原因，但是我尝试使用 data（）方法来设置值，以下示例：

function updateDataset() {
   var item = $("#order");
   item.data("indexn", value); // "data-indexn" in HTML would be only "indexn" here
}

这效果很好，并且代码现在没有任何问题。

同样，我不确定为什么 attr（）不起作用，并且这个问题可能会有更好的答案，但是如果其他人有类似的问题，我将在此处发布此信息。

Alright, so I'm not sure if this actually counts as an answer or not. According to everything I've been reading, the use of the attr() method should work perfectly fine to set values for datasets (which is what I tried to do). It does succesfully set new values for each item but it also messes with the sorting for some reason, making it not work anymore.

Couldn't find any reason as to why this would not work however I tried setting the values with the data() method instead, example below:

function updateDataset() {
   var item = $("#order");
   item.data("indexn", value); // "data-indexn" in HTML would be only "indexn" here
}

This worked perfectly fine and the code now runs without any issues.

Again, I'm not sure why attr() did not work and there might be a better answer for this question but I'm posting this here in case someone else has a similar problem.

回复收藏 0 原文

~没有更多了~