Forced to edit link instead of going to link in editable table cell |
Forced to edit link instead of going to link in editable table cell |
anonkun |
Jan 12 2019, 03:50 AM
Post
#1
|
Group: Members Posts: 1 Joined: 12-January 19 Member No.: 26,794 |
I have the following code which allows me to edit a cell, but the problem is that when I want to click on the link, it forces me to edit instead. I want to be able to edit only when I click on the pen icon, but I can't seem to figure out how to do it.
HTML CODE <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet"> <table border="1" style="width:100px" style="height:99px" style="margin:0 auto"> <tbody> <tr> <td ><div class="row_data" edit_type="click" col_name="datamapname"><i class="fa fa-pencil"></i><a id="dm" href="https://www.google.com/" target="_blank">Sample</a></div></td> </tr> </tbody> </table> Jquery CODE $(document).on('click', '.row_data', function(event) { //Remove pencil icon. $(this).find('i.fa-pencil').remove(); //Remove link $("#dm").removeAttr('href'); event.preventDefault(); if($(this).attr('edit_type') == 'button') { return false; } //make div editable $(this).closest('div').attr('contenteditable', 'true'); //add bg css $(this).addClass('bg-warning').css('padding','5px'); $(this).focus(); $(this).attr('original_entry', $(this).html()); }) //--->make div editable > end // --> save single field data > start $(document).on('focusout', '.row_data', function(event) { event.preventDefault(); if($(this).attr('edit_type') == 'button') { return false; } //Add pencil icon back $(this).append('<i class="fa fa-pencil"></i>'); //Add link back $("#dm").attr('href','https://www.google.com/'); }) JSFiddle: https://jsfiddle.net/89zgd1ry/ |
Christian J |
Jan 12 2019, 05:06 AM
Post
#2
|
. Group: WDG Moderators Posts: 9,661 Joined: 10-August 06 Member No.: 7 |
I don't do jQuery, but this part looks like it makes the link editable when you click anywhere in .row_data (including on the link?):
CODE $(document).on('click', '.row_data', function(event) |
Lo-Fi Version | Time is now: 27th April 2024 - 02:07 AM |