title: Get Values from table rows on button click jquery
body: <p>I am trying to get row values from a table on button click. This is how I created the table:</p>
  
  <pre><code>&lt;tbody&gt;
      @foreach (var item in Model)
      {
          ViewBag.AccountID = item.AccountId.ToString();
          if (item.Items != null)
          {
              foreach (var itemOnList in item.Items)
              {
                  &lt;tr&gt;
                      &lt;td&gt;@Html.DisplayFor(model =&gt; itemOnList.ItemId)&lt;/td&gt;
                      &lt;td data-itemname="@itemOnList.ItemName"&gt;@Html.EditorFor(model =&gt; itemOnList.ItemName)&lt;/td&gt;
                      &lt;td data-serialnumber="@itemOnList.SerialNumber"&gt;@Html.EditorFor(model =&gt; itemOnList.SerialNumber)&lt;/td&gt;
                      &lt;td data-brandname="@itemOnList.BrandName"&gt;@Html.EditorFor(model =&gt; itemOnList.BrandName)&lt;/td&gt;
                      &lt;td data-quantity="@itemOnList.Quantity"&gt;@Html.EditorFor(model =&gt; itemOnList.Quantity)&lt;/td&gt;
                      &lt;td data-description="@itemOnList.Description"&gt;@Html.EditorFor(model =&gt; itemOnList.Description)&lt;/td&gt;
                      &lt;td&gt;
                          &lt;a href="javascript:void(0);"  data-itemid="@itemOnList.ItemId" class="btn_edit"&gt;Edit |&lt;/a&gt;
                          &lt;a href="javascript:void(0);" data-itemid="@itemOnList.ItemId" class="btn_delete"&gt;Delete&lt;/a&gt;
                      &lt;/td&gt;
                  &lt;/tr&gt;
              }
          }
      }
  &lt;/tbody&gt;
  </code></pre>
  
  <p>This is how I try to get the values from the table:</p>
  
  <pre><code>$('#tbl_items').on('click', '.btn_edit', function () {
      var self = $(this);
      alert($(this).data('serialnumber') + " " + $(this).data('description'));
  });
  </code></pre>
  
  <p>but it doesn't alert me the values. </p>