Atributo disabled tornando o valor vazio

Bom dia, comunidade.

Estou desenvolvendo um processo que em determinada atividade o usuário não pode alterar alguns campos. O form.setEnabled não estava funcionando no meu caso porque eu precisava executar algumas funções no displayFields. Por isso decidi bloquear a edição por JQUERY.

O método padrão que eu estava usando até o momento era o seguinte:

customHTML.append("<script>$('#pendenciaDocumentacao').prop('disabled', true);</script>");

Porém percebi que quando eu movimentava a solução para o final os campos que haviam sofrido essa interação perdiam seu valor. No caso, campos do tipo "checkbox". Porém, ao usar o seguinte código:

customHTML.append("<script>$('#ra').attr('readonly', 'readonly');</script>");

Os valores não foram alterados, porém o usuário pode alterar. Me ficou na cabeça é: Por que o 'disabled' estava tirando o valor do meu campo? Estava implementando de maneira errada?

Código HTML do checkbox:

<div class="checkbox">
                                                <label for="semPendenciaFinanceiro" class="txtCheck">
                                                    <input type="checkbox" value="sim" id="semPendenciaFinanceiro" name="semPendenciaFinanceiro">
                                                    <span class="cr"><i class="cr-icon glyphicon glyphicon-ok"></i></span>
                                                    Sem pendência
                                                 </label>
                                            </div>

Código CSS do checkbox:

.txtCheck{
    font-size: 14px;
    color: #666666;
    text-align: left;
    vertical-align: baseline;
}

.checkbox label:after{
    content: '';
    display: table;
    clear: both;
}

.checkbox .cr{
    position: relative;
    display: inline-block;
    border: 1px solid #a9a9a9;
    border-radius: .25em;
    width: 1.3em;
    height: 1.3em;
    float: left;
    margin-right: .5em;
}

.checkbox .cr .cr-icon{
    position: absolute;
    font-size: .8em;
    line-height: 0;
    top: 50%;
    left: 20%;
}

.checkbox label input[type="checkbox"]{
    display: none;
}

.checkbox label input[type="checkbox"] + .cr > .cr-icon{
    transform: scale(3) rotateZ(-20deg);
    opacity: 0;
    transition: all .3s ease-in;
}

.checkbox label input[type="checkbox"]:checked + .cr > .cr-icon{
    color: #3ED576;
    transform: scale(1) rotateZ(0deg);
    opacity: 1;
}

.checkbox label input[type="checkbox"]:disabled + .cr{
    opacity: .5;
}

Aguardo um retorno de vocês.

Atenciosamente, Leonardo Fioretti.

compartilhar
  1. Você vai ver essas setas em qualquer página de pergunta. Com elas, você pode dizer se uma pergunta ou uma resposta foram relevantes ou não.
  2. Edite sua pergunta ou resposta caso queira alterar ou adicionar detalhes.
  3. Caso haja alguma dúvida sobre a pergunta, adicione um comentário. O espaço de respostas deve ser utilizado apenas para responder a pergunta.
  4. Se o autor da pergunta marcar uma resposta como solucionada, esta marca aparecerá.
  5. Clique aqui para mais detalhes sobre o funcionamento do fluig Forum!

2 respostas

Não é a resposta que estava procurando? Procure outras perguntas com as tags disabled readonly displayfields valor ou faça a sua própria pergunta.