CODEWITHSUNDEEP
jqueryattributes
Sravan
Sravan

Reputation: 1135

how to get the attribute values of the table row using jquery?

I have a following razor to create a table.

@model IEnumerable<iBoxV5.Model.Common.AdvancedSearch>
<table id="SearchFieldsTable">
  <thead>
    <tr>
    <th>
        ColumnName
    </th>
    <th>
        FilterValues
    </th>
    <th>Updated Before</th>
    </tr>
</thead>
<tbody>
@foreach (var item in Model)
{
<tr [email protected] [email protected] [email protected] [email protected] id=@(index++)>
    <td>
        @Html.DisplayFor(modelItem => item.ColumnName)
    </td>
    <td>
        @Html.TextBoxFor(modelItem => item.FilterValue, new { @class = "FrmTextBox advSearch" });

        @Html.TextBoxFor(modelItem => item.FilterValue, new { @class = "FrmTextBox advSearch" });
    </td>
    <td>
        @Html.TextBoxFor(modelItem => item.FilterValueTo, new { @class = "FrmTextBox advSearch" });
    </td>
</tr>
}
</tbody>
</table>

And In the above I have added few attributes for the like ColumnName.

I wants to build a JSON for the each row of the Table.

I tried with the following jquery Snippet.

var SearchFieldsTable = $("#SearchFieldsTable tbody");

var trows = SearchFieldsTable[0].rows;

$.each(trows, function (index, row) {
    var ColumnName=$(row).attr("ColumnName");
});

But the above is not returning the ColumnName I expected.

Upvotes: 2

Views: 42795

Answers (5)

Muru Bakthavachalam
Muru Bakthavachalam

Reputation: 1350

try this;

$("#trowId").attr("attrbuteName");

Upvotes: 5

Bharath
Bharath

Reputation: 807

May be this will be helpful.

var SearchFieldsTable = $("#SearchFieldsTable tbody");

var trows = SearchFieldsTable.children("tr");

$.each(trows, function (index, row) {
    var ColumnName=$(row).attr("ColumnName");
    // .... Your codes here 
});

FYI: "tbody" don't have "rows". The following is wrong

SearchFieldsTable[0].rows

You can use the following code instead to use above code. 

var SearchFieldsTable = $("#SearchFieldsTable");

Upvotes: 2

Ram
Ram

Reputation: 144659

You are defining a local variable in each iteration, now your ColumnName variable only stores the attribute of last row. Also ColumnName in not a valid attribute. You can use data-* attributes and map method.

var columnName = $("#SearchFieldsTable tbody tr").map(function(){
                      return $(this).data('ColumnName')
                 })

Now columnName is an array of column names.

Upvotes: 0

Praveen Kumar Purushothaman
Praveen Kumar Purushothaman

Reputation: 167162

Some browsers won't support custom attributes. So, you can better use data().

var ColumnName = $(row).data("ColumnName");

And in the row, define it as:

<tr [email protected] ...

Upvotes: 0

NullPoiиteя
NullPoiиteя

Reputation: 57312

you can get the value by either class or id like 

var ColumnName=$(row).attr(".ColumnName").val();

or 

var ColumnName=$(row).attr("#ColumnName").val();

Upvotes: 2

Related Questions