markcell / jquery-tabledit

Inline editor for HTML tables compatible with Bootstrap.
http://markcell.github.io/jquery-tabledit/
MIT License
435 stars 208 forks source link

Url in Table, connected to Database #68

Open Domods opened 7 years ago

Domods commented 7 years ago

I am trying to make a clickable link in a Tabledit cell, but cannot get it to work. It seems to be sanitized or something.

The code works in a standard formatted table, but not with Tabledit.

How can I make this work?

Simple version: <td><a>Cell text</a></td>

In my Code:

$stmt = $dbh->prepare("SELECT * FROM `Table` ORDER BY `Name` ASC");
if($stmt->execute())
{
  echo '<table id="example" class="table table-striped table-bordered" width="100%" cellspacing="0">
    <thead><tr>
      <th style="display:none;">ID</th>
      <th>Name</th>
      <th>Link</th>
      <th>Email</th>
    </tr></thead><tbody>
  ';
  while ($row = $stmt->fetch(PDO::FETCH_ASSOC))
  {
    echo '<tr><td style="display:none;">'.$row['ID'].'</td>';
    echo '<td>'.$row['Name'].'</td>';
    echo '<td><a href="?key='.$_GET['key'].'&link='.$row['Link'].'">'.$row['Link'].'</a></td>';
    echo '<td>'.$row['Email'].'</td></tr>';
  }
}
echo '
</tbody>
<script>
  $("#example").Tabledit({
    url: "test.php",
    columns: {
      identifier: [0, "ID"],
      editable: [[1, "Name"],[2, "Link"],[3, "Email"]]
    },
    buttons: {
      edit: {
          class: "btn btn-sm btn-success"
      },
      delete: {
        class: "btn btn-sm btn-danger"
      }
    }
  });
</script>
';
iampapagray commented 6 years ago

@Domods , Did u find any solution to this?

Domods commented 6 years ago

@iampapagray not yet unfortunately

mikapa21 commented 5 years ago

You can set the url in plain text and add a class on the td element echo '<td><a href="?key='.$_GET['key'].'&link='.$row['Link'].'">'.$row['Link'].'</a></td>'; becomes echo '<td class="linkurl">'.$row['Link'].'</td>'; then using an event handler (onDraw), you can dynamicaly wrap each td's content with an <a> element with the href that you want $('.linkurl').each(function(){ var value = $(this).text(); $(this).html('<a href="?key='+urlParam+'&link='+value+'">' + value + '</a>'); });

To grab the url parameter (urlParam) with javascript you can use this method

var getUrlParameter = function getUrlParameter(sParam) { var sPageURL = window.location.search.substring(1), sURLVariables = sPageURL.split('&'), sParameterName, i; for (i = 0; i < sURLVariables.length; i++) { sParameterName = sURLVariables[i].split('='); if (sParameterName[0] === sParam) { return sParameterName[1] === undefined ? true : decodeURIComponent(sParameterName[1]); } } };

and use it as var urlParam= getUrlParameter('key');

I hope this works if anybody needs it :)

steverosky commented 3 years ago

@mikapa21 can you please explain it more clearly ...I'm a newbie and tried your suggestion but it didn't work ...maybe i didn't apply it well