编辑显示值时JQuery的数据表上的行改变风格 [英] Change style on a row in JQuery Datatables when editing displayed values

问题描述

我从jQuery插件里显示的DataTable从数据库中获取的对象。在每行的结尾有一个编辑按钮，单击时打开了场一个弹出窗口，允许用户更改的对象。

I have a datatable from the JQuery plugin that displayes objects fetched from a database. At the end of each row there is an "edit" button that when clicked opens up a popup with fields that allows the user to change the object.

下code是编辑按钮，打开弹出窗口。

The code below is the "edit" button opening the popup.

<td>@Ajax.ActionLink("Edit",
                                 "controllerMethodReturningEditView",
                                 new
                                 {
                                     Id = @m.Id
                                 },
                                 new AjaxOptions
                                 {
                                     HttpMethod = "GET",
                                     UpdateTargetId = "popupBox",
                                     InsertionMode = InsertionMode.Replace,
                                     OnSuccess = "openPopup('myPopup')"
                                 })</td>

调用的控制器方法时pressing编辑按钮只是打开一个观点，即是在popupbox显示部分

The controller method called when pressing the edit button just opens a view that is a partial displayed in a popupbox

return PartialView("editObjectView", objectModel);

和这个editObjectView只包含一个形式采取输入字段。

and this "editObjectView" just contains a form with fields for taking input.

@using(Html.BeginForm(...
           <label>...</label><input ... />
           .... and so on

如果是，该弹出用户被允许编辑所显示的对象的值。当用户$ P $在弹出psses一个保存按钮，新值将被发送到在数据库中保存的值（对象）的控制器的方法。当值保存在控制器方法调用加载的第一个视图控制器方法（显示数据表视图）和方法要求，以显示新对象或对象更改数据库中的所有对象。

Then in this popup the user is allowed to edit the values of the displayed object. When the user presses a "save" button in the popup the new values will be sent to a controller method that saves the values (to the object) in the database. When the values are saved the controller method calls the controller method that loaded the first view (the view showing the datatable) and that method requests all objects from the database in order to display new objects or changes to objects.

现在，这里是我的问题：当页面对象被修改后重新加载，我该如何改变编辑行的风格？我想要的是设置一个红色边框的最近编辑记录左右。我想preFER如果我也不会用，通过重新加载页面的所有控制器的方法来发送的对象。

Now here is my question: when the page is reloaded after an object has been edited, how do I change the style of the edited row? All I want is to set a red border around the recently edited row. I would prefer if I would not have to send the object through all the controller methods used to reload the page.

感谢您的帮助，AP preciate吧！

Thanks for the help, appreciate it!

推荐答案

不知道什么是在返回页面，不知道要更新的样式。

Not knowing what's being returned to the page and not knowing the styling you want to update.

让我们说你要交替各行CSS类。你可以做类似下面的东西内容添加到页面后：

Let's say you want to alternate each rows css class. You could do something like below after the content is added to the page:

$("tr:nth-child(odd)", "#YOUR_TABLE_ID").addClass("odd-row");

或者，确保每个行HTML格式成为一个独特的ID标签...，然后做一些jQuery被添加到页面后，就设置类。

Or, make sure that each rows HTML is formatted it an unique ID tag "..." and then do some jQuery do set the class after being added to the page.

如果请求是一个Ajax请求，而你使用JSON返回东西回来 - 这样的：

If the request is an Ajax request, and you're returning something back using json - like:

var json { Id = Table.ID, status = true };

这时的onSuccess事件会做这样的事情：

Then the OnSuccess event would do something like this:

function OnSaveSuccess(data) {
    if (data.status) {
        $("#" + data.Id).addClass("highlight-row");
    } else {
    console.warn("save was not successful!");
    }
}

这篇关于编辑显示值时JQuery的数据表上的行改变风格的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！