highlight row after edit

Question

4.00/5 (1 vote)

See more:

I have a mvc table that displays data. Each row has a edit button. When you click edit there is a pop up(jquery dialog) for editing. Now what i am trying to do is highlight the row have been saved after edit. So the users can see which row they were working on.

There are few things i tried ----> I added a hidden for ID in each row. then in my Save/Update action I set ViewBag.CurrentID = id. Now i compare the two if they are euqal higlight the row.

The problem with what i thought was that 1. in my save method i have RedirectToAction which resets the viewbag. 2. I dont know how to identify then row if id is a match

the alternative to View bag was to use ViewData and accessing my jquery. Now i do not know how to do that I tried couple of way after googling but it did not work.

Here is my table

<table class="searchResult" id="tblSearchResult" border="1" width="100%">
    <thead>
        <tr>
            <th>
                Last Name
            </th>
            <th>
                Middle Name
            </th>
            <th>
                First Name
            </th>
            <th>
            </th>
        </tr>
     </thead>
     <tbody>
        @foreach (var item in Model.SearchResultsPerPage)
           {
                        <tr class="parent">
                            <td>
                                @item.LastName
                            </td>
                            <td>
                                @item.MiddleName
                            </td>
                            <td>
                                @item.FirstName
                            </td>
                            <td valign="middle">
                                <input type="image" src="../../Content/themes/base/Images/edit-icon.png" style="height:1.5em; width: 1.5em;" id="editRow" onclick="EditCurrentRow(@item.AdminID); return false;" />
                            </td>
                        </tr>
                    }
                </tbody>
            </table>

Posted 10-May-13 8:08am

Neha Ojha

Updated 10-May-13 8:19am

Richard C Bishop

v2

Add a Solution

Comments

Jameel VM 13-May-13 11:35am

After return redirecttoaction you cannot get the viewdata and viewbag value. Please post the code of actionresult. Else can't give a solution to your problem

Neha Ojha 13-May-13 16:27pm

Thanks Jameel, I kind of realised that the hard way. I finally figured it how to do it. Thanks

Sunasara Imdadhusen 21-May-13 3:55am

If you got solution then you should provide correct solution over here... so anybody will get benefited from your solution

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Neha Ojha · Answer 1 · 2013-05-21T05:34:00

@Sunasara Imdadhusen -- that is very ture. Many times i have benefited from these forums. I should also do my part. :)

So what I did was in my body tr I added id. so for each foreach rows renders a unique id.

<tbody>
@foreach (var item in Model.SearchResultsPerPage)
{
<tr class="parent" id="CurrentEditedRow-@item.AdminID.ToString()">
<td>
@item.LastName
</td>
<td>
@item.MiddleName
</td>
<td>
@item.FirstName
</td>
<td valign="middle">
<input type="image" src="../../Content/themes/base/Images/edit-icon.png" style="height:1.5em; width: 1.5em;" id="editRow" onclick="EditCurrentRow(@item.AdminID); return false;" />
</td>
</tr>
}
</tbody>

Then its a matter of passing the id to view via model and highlighting the row

var editedID = '@Model.EditedID'
if (editedID != null) {
var rowName = "CurrentEditedRow-" + editedID;
$('#' + rowName).css({
'font-weight': 'bolder',
'font-size': '14px',
'color': '#000099'
});
}