Joan Joan - 3 months ago 12
JSON Question

Jquery function doesen't work when I change page/row or when I search some specific

I made a JQuery function the one deletes the row I selected. I know that the option exist in the DataTables option, but I want to do by myself, because I prefer to not use AJAX, just JQuery and JSON.
The problem appears when I search some specify row in the datatable with the search option, then I click the button to delete, and nothing happens. The other mistake is when I click to the next page, then, all the rows from that page will not work either.

Do you guys know what this could be?

Here I let my JQuery function:

$(document).ready(function() {

$( ".botFactura" ).click(function(e) {
alert("jkn");
idFact = this.id;
var confirmacio = confirm("Segur que vol esborrar la factura "+idFact);
/*if(confirmacio){
$.post("operacions/borraFact.php", {idFact: idFact}, null, "json").done(function(data){
alert(data.missatge);
})
}*/
});});


Then, I have the JSON file there:

<?php

include("../connexio.php");
$idFact= $_POST['idFact'];
$arrayDatos = array();

if($idFact!=""){
$borrar = 'DELETE FROM factures WHERE id="'.$idFact.'"';
//$connBorr = mysqli_query($conn,$borrar);

$arrayDatos['missatge'] = "Factura ".$idFact." esborrada!";
}else{
$arrayDatos['missatge'] = "No s'ha trobat";
}

echo json_encode($arrayDatos);
?>


I call the $(".botFactura") there:

<button type="button" name="<?php echo $line2['id']?>" id="<?php echo line2['id']?>" class="btn btn-danger botFactura">
<span class="glyphicon glyphicon-trash"></span>
</button>
<button type="button" name="<?php echo $line2['id']?>" id="<?php echo $line2['id']?>" class="btn btn-success botFactura">
<span class="glyphicon glyphicon-pencil"></span>
</button>


Finally, I'll upload some graphical example about what's my problem:
:The first one, is when the page works correctly

Then,the first issue appears when: I change the page of the table. As we can see, I click and nothing happens

The same issue appears when I try to search some specific row into the search box.

Well, I would really appreciate if someone could help to explain why this is not working! Thank you!

Answer

I don't know which version of jQuery you are using but if you are jQuery 1.9 or upper version try this

$( document ).on('click', '.botFactura', function(e)

or if you are using lower version try this

$( ".botFactura" ).live('click', function(e)