RationalRabbit
RationalRabbit

Reputation: 1067

Bootgrid data-row-id is undefined

I have edit and delete controls on a Bootgrid table. these require the data row number but that data attribute is undefined, as you can see in the row below. Cannot find anything in the documentation that refers to this.

The editor here is insisting that I do not have enough text for the amount of code, so I am posting more text in order to submit. There really is nothing more to say. I can spent time going through the Bootgrid code or the BootStrap code to maybe figure something out, but I am hoping someone has experienced this before. I find no similar questions on Stackoverflow or, for that matter, anywhere else on the Web.

HTML

<div class="Wrapper">
   <div class="CenterTube">
      <div class="table-responsive">
      <table id="GridData" data-toggle="bootgrid" data-ajax="true" data-url="TickerData.php" class="table table-condensed table-hover table-striped">
      <thead>
         <tr>
            <th data-column-id="ID" data-width="4%" data-type="numeric" data-identifier="true">ID</th>
            <th data-column-id="Expire" data-width="7%">Expire</th>
            <th data-column-id="Message" data-order="asc" data-width="74%">Message</th>
            <th data-column-id="Link" data-width="10%">Link</th>
            <th data-column-id="commands" data-formatter="commands" data-sortable="false" data-width="5%">Edit</th>
         </tr>
      </thead>
      </table>
      </div>
   </div>
</div>

jQuery

  $(document).on("loaded.rs.jquery.bootgrid", function()
  {
     DataTable.find(".update").on("click", function(event)
     {
        var ID = $(this).data("row-id");
        if(ID != "undefined")
        {
           $.ajax(
           {
              url:"TickerData.php",
              method:"POST",
              data:{ID:ID, "SEC":"FetchSingle"},
              dataType:"json",
              success:function(data)
              {
                 var ECount = data.Error.length;
                 if(ECount > 0)
                 {
                    var ErrorString = "";
                    for(i=0;i<ECount;i++)
                    {
                       ErrorString += response.Error[i] + "\n";
                    }
                    alert(ErrorString);
                 }
                 else
                 {
                    $('#DataModal').modal('show');
                    $('#ID').val(data.Output.ID);
                    $('#Expire').val(data.Output.Expire);
                    $('#Message').val(data.Output.Message);
                    $('.modal-title').text("Edit Message");
                    $('#ID').val(ID);
                    $('#action').val("Edit");
                    $('#operation').val("Edit");
                 }
              }
           });
        }
        else
        {
           alert("ID is undefined!");
        }
     });
  });

Row Here is one row after rendering

<td class="text-left" style="width:4%;">1</td>
<td class="text-left" style="width:7%;">2020-08-15 04:14:12</td>
<td class="text-left" style="width:74%;">Severe winds across most of southern Wyoming and northeast Colorado. Hiway closed in places.</td>
<td class="text-left" style="width:10%;">&nbsp;</td>
<td class="text-left" style="width:5%;"><button type="button" class="btn btn-warning btn-xs update" data-row-id="undefined"> Edit </button>&nbsp; 
<button type="button" class="btn btn-danger btn-xs delete" data-row-id="undefined">Delete</button></td></tr>

Upvotes: 0

Views: 433

Answers (1)

RationalRabbit
RationalRabbit

Reputation: 1067

This was actually an oversight I should have caught. The id's in my database table are capitalized. So all ID's were here as well. Totally missed the obvious. the data.id is inserted in the control cells when the table is populated. I had not changed that to data.ID.

Upvotes: 0

Related Questions