CODEWITHSUNDEEP
phpjquery
Mert METİN
Mert METİN

Reputation: 1288

Reading checkboxes values with jQuery

I have a little bit problem with reading datas from checkboxes.

 {foreach value=artist2 from=$artist}
                <br />

                   <input type="checkbox" name="artist[]" value="{$artist2.MOVIE_ID}-{$artist2.PERSON_ID}" { in_array array=$item match=$artist2.NAME_SURNAME returnvalue="CHECKED" }>{$artist2.NAME_SURNAME}<br />

                <hr />
                {/foreach}
                   <p align="right">  <a style="float: right" href='javascript:void(null);' onclick="deleteData();" ><input type="submit" name="removeArtistFromMovie" onclick="showMessage('Seçilen oyuncu(lar) başarıyla silindi')" value="Seçilenleri Sil" id="value"</p></a>
                <br >
                  </form>

I produce checkboxes like that and in my js file:

I try this

function deleteData(){
    var artistIds = new Array();

    $("input[@type=artist[]][@checked]").each(function(){
        artistIds.push($(this).attr('id'));
    });

alert(artistIds);



$.post('/management/deleteDataAjax2', 
       { json: JSON.stringify({'artistIds': artistIds}) },
       function(response){
        alert("Başarıyla silindi");
        window.location.replace(window.location.pathname);
});



}

However, above code does not take the values of checkboxes which is checked. Why ?

Finally

I think problem is here because the page does not go to js.

<form name=form1 method=post action=# onsubmit='return validate(this)'>

                <br />

                   <input type="checkbox" name="artist[]" value="{$artist2.MOVIE_ID}-{$artist2.PERSON_ID}"  />{$artist2.NAME_SURNAME}<br />


                <hr />



                {/foreach}
                <p align="right">
                <a style="float: right" href='javascript:void(null);' onclick="deleteData();" ><br />
                    <input type="button" name="checkArtistButton" value="Seçilenleri Sil" id="ajaxCheckbox" /></a></p>
                <br >
                  </form>

and this is my js 

function deleteData(){

    var artistIds = [];
$('#ajaxCheckbox').click(function() {
    $("input[name='artist[]']:checked").each(function() {
        artistIds.push($(this).attr('value'));
    });
    alert(artistIds);
});​
​    



$.post('/management/deleteDataAjax2', 
       { json: JSON.stringify({'artistIds': artistIds}) },
       function(response){
        alert("Başarıyla silindi");
        window.location.replace(window.location.pathname);
});



}

Upvotes: 0

Views: 200

Answers (3)

Manse
Manse

Reputation: 38147

instead of 

$("input[@type=artist[]][@checked]").each(function(){

try

$("input[name='artist[]']:checked").each(function(){

Working example here

note

I think you mean to get the value of the checkboxes - as looking at your markup they do not have id attributes - use .val() instead of attr('id') to get the value

Update

You are now setting up an event handler on the click of an anchor ... change this

function deleteData() {
    var artistIds = [];
    $('#ajaxCheckbox').click(function () {
        $("input[name='artist[]']:checked").each(function () {
            artistIds.push($(this).attr('value'));
        });
        alert(artistIds);
    });​​

to this

function deleteData() {
    var artistIds = [];
    $("input[name='artist[]']:checked").each(function () {
        artistIds.push($(this).val());
    });
    alert(artistIds);

the deleteData function is already called onclick

Upvotes: 3

Chandresh M
Chandresh M

Reputation: 3828

Try below line of code:

var artistIds = Array();
$("input[name=artist[]]:checked").each(function(index){
     artistIds[index] = $(this).val();
});

This may work for you..

Upvotes: 1

ThiefMaster
ThiefMaster

Reputation: 318488

Use the :checked selector instead of [@checked] (btw, you do not use @ in CSS property selectors). You also used the wrong property selector for the name. I've also simplified your code a bit; your use-case is perfect to use .map(..).get()

var artistIDs = $("input[name='artist[]']:checked").map(function(){
    return this.id;
}).get();

Demo: http://jsfiddle.net/ThiefMaster/sBmdC/

Upvotes: 1

Related Questions