Come inoltrare anche la casella di controllo non selezionata

Question

Se la casella di controllo non è selezionata, facendo clic sul pulsante di invio del modulo non viene inviato alcun dato.

Alcune caselle potrebbero non essere presenti nella forma in base ai campi modulo selezionati dall'utente. Quindi, il controller di invio non ha la possibilità di determinare se la casella di controllo non selezionata era presente o meno nel modulo.

Se il database contiene true per questa colonna, questa proprietà non viene aggiornata su false. Il nome della casella di controllo è uguale al nome della colonna booleana del database.

Come forzare il modulo per inviare caselle di controllo in stato non controllato o qualsiasi altra idea a valore impostato nel database su falso se la casella di controllo non è selezionata ma non modificare il valore nel database se la casella di controllo non è presente nel modulo?

jquery, jQueryUI, asp.net mvc 2 sono utilizzati

Answer 1

Questo è un problema comune con le caselle di controllo in forme HTML e non riguardano solo ASP.NET.

La risposta è di avere un campo nascosto che accompagna ogni casella di controllo. Quando la casella di controllo è stata modificata, utilizzare un evento sul lato client per aggiornare il campo nascosto.

Il campo nascosto verrà sempre inviato.

Tuttavia, poiché si utilizza ASP.NET MVC, se si utilizza l'helper HTML.CheckBoxFor, questo verrà gestito automaticamente.

Answer 2

Questo è un problema molto comune - quando la casella di controllo non è selezionata non invierà al valore di server off/false di per sé. La risposta più popolare che ho trovato è stata quella di aggiungere campi nascosti con lo stesso nome di checkbox e value = false. Ma poi quando qualcuno lo ha controllato mi ha mandato due valori.

E non mi è piaciuto. Questo è quello che ho fatto:

Da qualche parte in HTML:

<input type="checkbox" name="${name}" onclick="true" > 

in jQuery:

Il primo passo è quello di impostare i valori nascosti su tutte le caselle di controllo che non sono controllati.

$(document).ready(function() { 
     $(".checkbox").each(function() { 
       if ($(this).prop("checked") == undefined) { 
        $(this).after("<input type=\"hidden\" name=\"" + $(this).attr("name") + "\" value="off">") 
       } 
       } 
     ) 
    }); 

In secondo luogo dobbiamo reagire utente cliccando la casella: mentre deselezionando aggiungere campo nascosto, quando si seleziona - rimuovere successivo fratello in DOM - ci aspettavamo campo nascosto lì.

ATTENZIONE: quando caselle di controllo hanno genitore comune si dovrebbe verificare se il tipo di pari livello successivo è nascosto e quindi rimuoverlo !:

$(".checkbox").click(function() { 
        if ($(this).prop("checked") == undefined) { 
         $(this).after("<input type=\"hidden\" name=\"" + $(this).attr("name") + "\" value=off>") 
        } else { 
         $(this).next().remove(); 
        } 
       } 
      ); 

e funziona per me :)

Answer 3

mio più breve soluzione: utilizzare onchange di una casella di controllo() evento per impostare un fratello nascosto a 0 o 1. Come segue:

var htm = '<input type="checkbox" '+(isMale>0?"checked":"")+' onchange="this.nextSibling.value=this.checked==true?1:0;" /><input type="hidden" name="Gender" value="'+isMale+'" />'; 

Invia invia solo il Hidd it fratello, NON la casella di controllo perché non ha un attributo nome. Quindi quanto sopra è serializzato come "...& Sesso = 1 ... "o" ... & Sesso = 0 ..." a seconda del valore isMale

Answer 4

mi sono imbattuto in un problema simile durante l'utilizzo di jQuery/Java -. Invece di usare un campo nascosto aggiuntivo, ho forzato un mezzo ogni volta che il modulo è stato salvato indipendentemente dal fatto che i campi sono stati modificati

es Se chkBox1 =unchecked (trasmetterà nullo - attributo valore di controllo tramite jQuery onClick o onChange caso di casella di controllo).

<input name="chkBox1 " class="editable-value" id="chkBox1 " style="display: inline;" type="checkbox" data-type="A" data-original-value="checked" data-force-save="true" value="N"/> 

e ChkBox2=checked (Invierà Y)

<input name="ChkBox2" class="editable-value" id="ChkBox2" type="checkbox" CHECKED="Y" data-type="A" data-original-value="checked" value="Y"> 

sono i valori sullo schermo e cerco di salvare i dati, nel mio codice Java eseguo un controllo nullo sul valore ottenuto nel getter e interpreto un null come 'N'. Ciò evita il sovraccarico di un campo nascosto anche se si è liberi di scegliere la soluzione che si rivolge alla loro particolare situazione.

Answer 5

Recentemente mi sono trovato in questo numero e questa è la mia soluzione. Lo faccio senza campo nascosto. Basta cambiare il "valore" della casella di controllo su "spento" e accertarsi che sia selezionato in modo che venga inviato. Nota: ho provato solo contro un server php, ma dovrebbe funzionare.

 // Prepare checkboxes 
    var checkboxes = document.querySelectorAll('input[type="checkbox"]') 
    checkboxes.forEach(function(cbox) { 
     if (!cbox.checked) { // If the checkbox is checked it keeps its value, default value is 'on' 
      cbox.value='off' // Otherwise change the value to off, or something else 
      cbox.checked = true // We need to check it, so it sends the value 
     } 
    })