CODEWITHSUNDEEP
jquerycsscheckboxhyperlink
Salman Razak Memon
Salman Razak Memon

Reputation: 93

jquery uncheck checkbox with a link

please advice, I want to create tags. i have an input field in a div and multiple checkbox in another div. i want to add tags clicking checkbox. tags got a close button which remove that tag also uncheck the particular check box.

for example i have automobile, fashion, healthcare, education etc checkbox. typing in input box add tag and check box is checked by pressing enter.

$(document).ready(function() {
var $list = $("#itemList");

$(".chkbox").change(function() {
    var a = this.value;
    if (this.checked) {
        $list.append('<li><a href="#">' + a + '</a></li>');
    }
    else {
        $("#itemList li:contains('"+a+"')").remove();
    }
})
$('div a').live('click', function(ev){
    alert("hi");
});


<div id="tab1" class="tab-pane">
    <input type="checkbox" class="chkbox" value="101">  This is 101
    <input type="checkbox" class="chkbox" value="102">  This is 102
    <input type="checkbox" class="chkbox" value="103">  This is 103
    <input type="checkbox" class="chkbox" value="104">  This is 104
</div>
<div id="items">
    <ul id="itemList">
    </ul>
</div>

plesae help or advice.

Upvotes: 1

Views: 1879

Answers (2)

South Coast Web
South Coast Web

Reputation: 440

Morning

try this

var $list = $("#itemList");

$(".chkbox").change(function() {
    var a = this.value;
    if (this.checked) {
        $list.append('<li><a href="#">' + a + '</a><button class="closebutton" value="'+a+'">X</button></li>');
    }
    else {
        $("#itemList li:contains('"+a+"')").remove();
    }
})
$(document).on('click','div a',function(ev){
   alert($(this).text());
});
$(document).on('click','.closebutton',function(){
   var b = this.value;
   $("#itemList li:contains('"+b+"')").remove();
    $(".chkbox[value="+b+"]").removeAttr('checked');
});

This will create a close button which can also be clicked..

http://jsfiddle.net/jDBsw/3/

Upvotes: 2

vipulsharma
vipulsharma

Reputation: 1252

The problem may with your .change. try 

$(document).on('click','.chkbox', function() {
    var a = $(this).val();
    // same code as above
});

also .live is deprecated in the latest versions of JQuery. Do not use that.

Upvotes: 1

Related Questions