does not remove if first line html java

Question

does not remove if first line html java

Navigation

#1 by (0 votes)

0

Good. with this code I can add and remove rows but I am having difficulty locking the first one so it is not deleted. how can I do it?

var table = $( '#table-data' )[0];

$( table ).delegate( '.tr_clone_add', 'click', function () {
	var thisRow = $( this ).closest( 'tr' )[0];
	$( thisRow ).clone().insertAfter( thisRow ).find( 'input:text' ).val( '' );
});

$(table).delegate( '.tr_clone_del', 'click', function () {
    var thisRow = $(this).closest("tr")[0];
    thisRow.remove();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><tablewidth="100%" border="0" cellspacing="0" cellpadding="0" id="table-data">
        <tr>
            <td>header1</td>
            <td>header2</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
        <tr class="tr_clone">
            <td>
            <select name="campo1[]">
            <option value="0">-</option>
            <option value="1">1</option>
            <option value="2">2</option>
            </select>
            </td>
            <td><input type="text" name="campo2[]" class="input" value="0"></td>
            <td><button alt="" class="tr_clone_add" style="cursor:pointer;" title="Adicionar">+</button></td>
            <td><button alt="" class="tr_clone_del" style="cursor:pointer;" title="Remover">-</button>
            </td>
        </tr>
    </table>

javascript html

asked by anonymous 22.03.2018 / 16:25

1 answer

Query to the Web Service of the City of São Paulo always returns "Request XML Message of the service without content" No specific devices appear in android studio when configuring application for various screen sizes

score 0 · Accepted Answer

Just add this to your opt-out method, a small check on how many tr there is.

$(table).delegate( '.tr_clone_del', 'click', function () {
      if($('.tr_clone').length > 1) {
        var thisRow = $(this).closest("tr")[0];
        thisRow.remove();
      }
  });

The complete example follows.

$(function() {
	var table = $( '#table-data' )[0];

  $( table ).delegate( '.tr_clone_add', 'click', function () {
    var thisRow = $( this ).closest( 'tr' )[0];
    $( thisRow ).clone().insertAfter( thisRow ).find( 'input:text' ).val( '' );
  });

  $(table).delegate( '.tr_clone_del', 'click', function () {
      if($('.tr_clone').length > 1) {
        var thisRow = $(this).closest("tr")[0];
        thisRow.remove();
      }
  });
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><tablewidth="100%" border="0" cellspacing="0" cellpadding="0" id="table-data">
        <tr>
            <td>header1</td>
            <td>header2</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
        <tr class="tr_clone">
            <td>
            <select name="campo1">
            <option value="0">-</option>
            <option value="1">1</option>
            <option value="2">2</option>
            </select>
            </td>
            <td><input type="text" name="campo2" class="input"></td>
            <td><button alt="" class="tr_clone_add" style="cursor:pointer;" title="Adicionar">+</button></td>
            <td><button alt="" class="tr_clone_del" style="cursor:pointer;" title="Remover">-</button>
            </td>
        </tr>
    </table>