1. java
  2. android
  3. c#
  4. .net
  5. javascript
  6. php
  7. jquery
  8. html
  9. sql

Removendo li da ul

No momento o código remove todos os itens da lista, mas gostaria que removesse só os que tiverem o checkbox marcados.

<html>
<head>
    <title>Demo</title>
    <script type="text/javascript" src="~/Scripts/JavaScript.js"></script>
</head>
<body>
    <form action="~/Controllers/">
        <label for="ctarefa">Tarefas:</label> 
        <input href="#" class="active" onkeypress="return recarrega(event);" type="text" id='my_span'><br />
        <div class="boxLista">
            <ul id="Foo">
            </ul>
        </div>
        <input type="reset" value="Delete" onclick="del()"> 
    </form>
</body>
</html>

JavaScript:

function OnEnter(evt) {
    var key_code = evt.keyCode ? evt.keyCode :
    evt.charCode ? evt.charCode :
    evt.which ? evt.which : void 0;
    if (key_code == 13) {
        return true;
    }
}
var j = 1;
function recarrega(e) {
    if (OnEnter(e)) {
        var p = document.getElementById('Foo');
        var filhos = p.childNodes;
        for (i = filhos.length - 1; i >= 0; i--) {
            if (filhos[i].tagName == 'LI') {
                p.appendChild(filhos[i]);
            }
        }
        var tarefa = document.getElementById("my_span").value;
        document.getElementById("my_span").value = "";
        var li = document.createElement('li');
        var label = " <label for='ckb" + j + "' id='lbl" + j + "' >" + tarefa + "</label>"
        p.appendChild(li);
        li.setAttribute("ondblclick", "HabilitaInput(" + j + ")")
        li.id = 'my_span' + j;
        li.innerHTML = "<input type='checkbox' id='ckb" + j + "' value='" + j + "' onclick='my_fun(" + j + ");'>" + "<input type='text' id='input" + j + "' value='" + tarefa + "' style='display: none' onkeypress='return atualizaTarefa(this," + j + ",event);'>" + label;
        j++;
        $.post("Start/GotTarefa", { tarefa: tarefa }, function (data) { alert('Application saved. ' + data); }, "String");
        return false;
    }
    else {
        return true;
    }
}
function my_fun(j) {
    var chkbox = "ckb" + j;
    var my_span = "lbl" + j;
    var msg = chkbox + " " + my_span;
    if ($("#ckb" + j).is(':checked')) {
        document.getElementById(my_span).style.textDecoration = 'line-through';
        document.getElementById(my_span).className = 'del';
    }
    else {
        document.getElementById(my_span).style.textDecoration = 'none';
    }
}
function HabilitaInput(index) {
    var idInput = "input" + index;
    document.getElementById(idInput).style.display = 'block';
    document.getElementById(idInput).focus();
}
function atualizaTarefa(element, index, e) {
    if (OnEnter(e)) {
        var newtarefa = element.value;
        var idInput = "input" + index;
        var idLbl = "lbl" + index;
        document.getElementById(idLbl).innerHTML = newtarefa;
        document.getElementById(idInput).style.display = 'none';
        $.post("Start/GotTarefa", { tarefa: newtarefa }, function (data) { alert('Application saved. ' + data); }, "String");
    }
}
function del(){
    var ul = document.getElementById("Foo");
    var lis = ul.getElementsByClassName("del");
     while (ul.parentNode) {
        ul.parentNode.removeChild(ul);
    }
}
  • consegui resolver.. while ((lis).length > 0) { lis[0].parentNode.removeChild(lis[0]); e na my_fun var li = "my_span" + j; document.getElementById(li).className = 'del';

    }

    Marcio Vinicios Aldao da Silva   07 de dez de 2015
  • Poste como resposta então

    TerraSkilll   08 de dez de 2015
  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 GUJ!

0 resposta

Não é a resposta que estava procurando? Procure outras perguntas com as tags javascript html jquery ou faça a sua própria pergunta.