Deaktivieren Sie das Kontrollkästchen, wenn AJAX-Fehler

Question

Ich habe eine Tabelle mit einem Kontrollkästchen in der ersten Spalte - wenn dies aktiviert ist führt dies ein AJAX-Skript, das eine PHP-Session-Variable mit den ausgewählten Werten aktualisiert. Wenn es einen AJAX-Fehler gibt, möchte ich, dass das Kontrollkästchen deaktiviert bleibt. Im Moment bleibt es aktiviert, wenn ein AJAX-Fehler mit dem Skript vorliegt.

Hier ist der Tisch und das Skript:

$(document).ready(function() { 
 
    $("input.select-item").click(function() { 
 
    var productID = $(this).val(); 
 
    // Create a reference to $(this) here: 
 
    $this = $(this); 
 
    $.post('productSelections.php', { 
 
     type: 'updateSelections', 
 
     productID: productID, 
 
     selectionType: 'single' 
 
    }, function(data) { 
 
     data = JSON.parse(data); 
 
     if (data.error) { 
 
     var ajaxError = (data.text); 
 
     var errorAlert = 'There was an error updating the Product Selections'; 
 
     $this.closest('td').addClass("has-error"); 
 
     $("#updateSelectionsErrorMessage").html(errorAlert); 
 
     $("#updateSelectionsError").show(); 
 
     return; // stop executing this function any further 
 
     } else { 
 
     $this.closest('td').addClass("success") 
 
     $this.closest('td').removeClass("danger"); 
 
     } 
 
    }).fail(function(xhr) { 
 
     var httpStatus = (xhr.status); 
 
     var ajaxError = 'There was an error updating the Product Selections'; 
 
     $this.closest('td').addClass("danger"); 
 
     $("#updateSelectionsErrorMessage").html(ajaxError); 
 
     $("#updateSelectionsError").show(); 
 
    }); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script> 
 
<table class="table table-condensed table-striped table-bordered"> 
 
    <thead> 
 
    <th><input type="checkbox" class="select-all checkbox" name="select-all" /></th> 
 
    <th class="text-center" scope="col">Product ID</th> 
 
    <th class="text-center" scope="col">Description</th> 
 
    </thead> 
 
    <tbody> 
 

 
    <tr class="" id="85799"> 
 
     <td id="AT36288"><input type="checkbox" class="select-item checkbox" name="select-item" value="AT36288" /></td> 
 
     <td>AT36288</td> 
 
     <td>Apples</td> 
 
     <td></td> 
 
    </tr> 
 
    <tr class="" id="85800"> 
 
     <td id="AT36289"><input type="checkbox" class="select-item checkbox" name="select-item" value="AT36289" /></td> 
 
     <td>AT36289</td> 
 
     <td>Bananas</td> 
 
     <td></td> 
 
    </tr> 
 
    <tr class="" id="85801"> 
 
     <td id="AT36290"><input type="checkbox" class="select-item checkbox" name="select-item" value="AT36290" /></td> 
 
     <td>AT36290</td> 
 
     <td>Oranges</td> 
 
     <td></td> 
 
    </tr> 
 
    <tr class="" id="85803"> 
 
     <td id="AT36292"><input type="checkbox" class="select-item checkbox" name="select-item" value="AT36292" /></td> 
 
     <td>AT36292</td> 
 
     <td>Grapes</td> 
 
     <td></td> 
 
    </tr> 
 
    </tbody> 
 
</table>

Ich füge eine Fehlerklasse des rot zu färben und auch eine Warnung angezeigt werden, möchte aber das Kontrollkästchen, um zu verhindern wenn möglich noch überprüft werden.

Answer 1

Sie können einen beliebigen in der Ajax fehlgeschlagen Block versuchen

$this.attr('checked', false); 
$this.prop('checked', false); 
$this.removeAttr('checked');