小弟最近剛學習C# MVC
一開始用這網站製作了簡易的table,
https://igouist.github.io/post/2019/12/aspnet-connect-db/
後來參照了 datatables優化表格：
https://datatables.net/
表格可以正常顯示，但是想做到Datatables 的 inline Editor卻無法使用
想要做到下面樣式
https://editor.datatables.net/examples/inline-editing/simple.html
原本的代碼其實是有做出來，但使用上怪怪的，
點一下欄位會變成編輯狀態，
原本是想說編輯狀態下，點兩下可以全選然後複製，
但編輯狀態下如果再點一次欄位，原本的值就會自動消失，無法點兩下。
原本代碼：
HTML

        <table id="scrollSignTable" class="display">
            <thead>
                <tr>
                    <th>UID</th>
                    <th>Sign Name</th>
                    <th>Stage</th>
                    <th>Price</th>
                    <th>CName</th>
                    <th>Action</th>
                </tr>
            </thead>

            <tbody>
                @foreach (Po_sign posign in ViewBag.posigns)
                {
                    <tr>
                        <td class="edit" data-field="uid" data-id="@posign.rid">@posign.uid</td>
                        <td class="edit" data-field="signname" data-id="@posign.rid">@posign.signname</td>
                        <td class="edit" data-field="stage" data-id="@posign.rid">@posign.stage</td>
                        <td class="edit" data-field="price" data-id="@posign.rid">@posign.price</td>
                        <td class="edit" data-field="cname" data-id="@posign.rid">@posign.cname</td>
                        <td>
                            @Html.ActionLink("Delete", "DeletePoSign", new { rid = posign.rid })
                        </td>
                    </tr>
                }
            </tbody>
        </table>
script>
    $(document).ready(function () {
        function optimizeTable(tableId) {
            new DataTable('#' + tableId, {
                paging: false,
                searching: false,
                scrollCollapse: true,
                scrollY: '400px'
            });
        }
        optimizeTable('scrollProcessTable');
        optimizeTable('scrollSignTable');

        $('#searchButton').click(function () {
            searchAction();
        });

        $('#loginIdInput').keyup(function (event) {
            if (event.keyCode === 13) {
                searchAction();
            }
        });

        function searchAction() {
            var loginId = $('#loginIdInput').val();

            window.location.href = '/PoManage/Index?loginId=' + loginId;
            // 在重新導向頁面後，初始化DataTable
            function ReOptimizeTable(tableId) {
                $('#' + tableId).DataTable({
                    paging: false,
                    searching: false,
                    scrollCollapse: true,
                    scrollY: '400px'
                });
            }
            ReOptimizeTable('scrollProcessTable');
            ReOptimizeTable('scrollSignTable');
        }

        $('.edit').click(function () {
            // Get cell data
            var cell = $(this);
            var value = cell.text().trim();
            var field = cell.data('field');
            var id = cell.data('id');
            // Convert cell to input field
            cell.html('<input type=text value=' + value + '>');
            // Focus on the input field
            cell.find('input').focus();
            // Handle input field blur event
            cell.find('input').blur(function () {
                // Get new value
                var newValue = $(this).val();
                // Update cell with new value
                cell.text(newValue);
                // Call controller action to update data
                updateData(id, field, newValue);
            });
            cell.find('input').keypress(function (e) {
                if (e.which === 13) {
                    cell.find('input').blur(); // Trigger blur event
                }
            });
        });

        function updateData(id, field, value) {
            $.ajax({
                url: '/PoManage/EditPoSign',
                type: 'POST',
                data: { rid: id, field: field, value: value },
                success: function () {
                    // Data updated successfully
                    location.reload(); // Refresh the page
                },
                error: function () {
                    // Error occurred while updating data
                }
            });
        }
    });
</script>

Controller：

        [HttpPost]
        public IActionResult EditPoSign(string rid, string field, string value)
        {
            DBManager dbmanager = new DBManager();
            dbmanager.UpdatePoSign(rid, field, value);
            return RedirectToAction("Index");
        }

DB：

        public void UpdatePoSign(string rid, string field, string value)
        {
            using (SqlConnection sqlConnection = new SqlConnection(ConnStr))
            {
                sqlConnection.Open();
                using (SqlCommand sqlCommand = new SqlCommand($"UPDATE Po_sign SET {field} = @value WHERE rid = @rid", sqlConnection))
                {
                    sqlCommand.Parameters.AddWithValue("@value", value);
                    sqlCommand.Parameters.AddWithValue("@rid", rid);
                    sqlCommand.ExecuteNonQuery();
                }
            }
        }

後來要修改Inline edit
把原本的
$('.edit').click(function () {}和function updateData(id, field, value)移除
然後修改editor，ajax調用原來的，結論是無法使用。
因最最近才剛學，想知道哪裡出了問題?

const editor  =new DataTable.Editor({
            ajax: '/PoManage/EditPoSign',
            fields: [
                {
                    label: 'UID:',
                    name: 'uid'
                },
                {
                    label: 'Sign Name:',
                    name: 'signname'
                },
                {
                    label: 'Stage:',
                    name: 'stage'
                },
                {
                    label: 'Price:',
                    name: 'price'
                },
                {
                    label: 'CName:',
                    name: 'cname'
                }
            ],
            table: '#scrollSignTable',
            formOptions: {
                inline: {
                    onBlur: 'submit'
                }
            }
        });