表在特定列（MVC）中未正確排序

Question

快速問題：

我使用了一些JavaScript，通過單擊它們的表頭對所有表進行排序，在大多數情況下，這絕對可以正常工作。 正確標記了字符串，整型等所有內容后，整頁都可以正確排序。

            function sortTable(n) {

        var table, rows, switching, i, x, y, shouldSwitch, dir, switchcount = 0; //declares necessary variables

        table = document.getElementById("toSortTable"); 

        switching = true; 

        dir = "asc"; 

        while (switching) { 

            switching = false; 
            rows = table.getElementsByTagName("tr"); 

            for (i = 1; i < (rows.length - 1) ; i++) { 

                shouldSwitch = false; 

                x = rows[i].getElementsByTagName("td")[n]; 
                y = rows[i + 1].getElementsByTagName("td")[n]; 

                if (dir == "asc") { 

                    if (x.innerHTML.toLowerCase() > y.innerHTML.toLowerCase()) { //compares the 2 values
                        shouldSwitch = true; /
                        break;
                    }

                } else if (dir == "desc") {
                    if (x.innerHTML.toLowerCase() < y.innerHTML.toLowerCase()) { 
                        shouldSwitch = true; 
                        break;
                    }
                }
            }
            if (shouldSwitch) { 
                rows[i].parentNode.insertBefore(rows[i + 1], rows[i]);
                switching = true;
                switchcount++; 
            } else {
                if (switchcount == 0 && dir == "asc") {
                    dir = "desc";
                    switching = true;
                }
            }
        }
    }

如前所述，這個JS似乎可以在我為其分配的大多數頁面上運行，但是在一張表中卻給了我一些問題。 在我的一張桌子上，排序根本無法提供正確的順序。

https://imgur.com/a/7EZ5y （不知道如何嵌入）

已按總帳單費用在兩個圖片中點擊（即排序）了表格。 我讀到，當其中一個值包含空格時，可能會發生拙劣排序，因此該字段將被識別為字符串而不是dec / int，但這在DB中不是這種情況，並且在中間，而不是在其余int / decs之前/之后。

我唯一能想到的就是關閉填充我的VM的控制器：

            public ActionResult Index()
    {
        List<InvoiceVM> listOfInvoices = new List<InvoiceVM>();
        var iNVOICES = db.INVOICES.Include(i => i.INVOICES_TO_CREDIT);



        foreach (var entry in iNVOICES)
        {
            bool check = false;
            foreach (var checkDupe in listOfInvoices)
            {
                if (checkDupe.invoiceNo == entry.INV_NO)
                {
                    check = true;
                }
            }
            if (check == true)
            {
                check = false;
            }
            else
            {
                InvoiceVM toAdd = new InvoiceVM();
                toAdd.account = entry.ACCOUNT;
                toAdd.subDate = entry.SUB_DATE;
                toAdd.cc = entry.CC;
                toAdd.reference = entry.SOLUTION_OWNER;
                toAdd.invoiceNo = entry.INV_NO;
                toAdd.project = entry.PROJECT_ID;
                toAdd.ikeaProject = entry.SLTN_NAME;
                toAdd.invoiceNo = entry.INV_NO;
                toAdd.autoNo = Convert.ToInt32(entry.AUTO_ID);

                foreach (var invoice in iNVOICES)
                {
                    if (invoice.INV_NO == toAdd.invoiceNo)
                    {
                        toAdd.totalCost += Convert.ToInt32(invoice.EMP_TOTAL_COST);
                    }
                }

                listOfInvoices.Add(toAdd);

            }

        }
        return View(listOfInvoices);

    }

（我知道可以通過一些超級簡單的GroupBy + Sum使此代碼看起來超級垃圾來解決，如果有人願意加入此建議，我們很樂意接受）。

無論如何，由於上面圖片中顯示的值是實際“發票”表中值的正確總和，因此這會正確填充。 同樣，“總成本”上的單個值對於42k高於11k（在排序使用原始值而不是總和的情況下）。 這兩個值已在控制器中與其他值組合在一起，但是一旦將這些值傳遞給VM，就感覺不相關。

我會尋找更多答案，而且我確定錯誤是在控制器中的某個地方，但我根本不知道要尋找什么。 除了“總成本”之外，對於所有列，該排序在所有其他表中均能很好地工作，甚至在同一頁的該表中也能很好地工作。 任何幫助，將不勝感激。

非常感謝！

Answer 1

您是否絕對可以確定此腳本在其他表中正確地對數值進行了排序？ 您確實提到只要適當地“標記”了所有內容，但這意味着什么？ 您是否能夠以某種方式指定特定的表格數據單元僅是數字？

至於控制器中有什么問題，我懷疑情況就是這樣。 控制器確實向視圖提供數據，但排序完全取決於javascript。

當然可以在控制器中進行排序，您可以在此處查看示例。

現在開始討論，這里您的腳本從指定的表格單元中檢索值：

x = rows[i].getElementsByTagName("td")[n]; 
y = rows[i + 1].getElementsByTagName("td")[n]; 

這是比較之一：

x.innerHTML.toLowerCase() > y.innerHTML.toLowerCase()

我不認為檢索innerHTML並將其更改為小寫字母能夠分辨出數字和字符串之間的區別。 我可能是錯的，但我確實做了一些簡單的測試，因此可以很好地應對字母排序。 但是，例如使用數字，它認為1002小於14。

您可以嘗試添加更多條件檢查，以檢查x和y變量是數字還是字符串，然后將它們保存到新的數字變量中，然后進行排序。

或者，您可以嘗試使用其他排序解決方案： DataTables 。 盡管是基於jQuery的，但它是一個非常漂亮的軟件包。 （不以任何方式隸屬於他們，我就是我自己）。