.ajaxデータのjQueryでチェックボックスの値を取得します。

Question

boolean（チェックされた/チェックされていない）値を.ajaxで渡そうとしていますが、動作させることができません。私は​​、対.prop('checked')を使用してチェックボックスの値を取得する方法についての束を読んだが、私は何も動作するように見えることはできません。ここで

は私のHTMLです：

<input type="checkbox" id="typeOfSearch" value="TRUE"> 
<label for="typeOfSearch">Exact Search?</label> 

そして、ここでは私はJavaScript

$.ajax({ 
      url: 'partsTable.php', 
      type: 'post', 
      dataType: 'html', 
      data: { 
       major: $('select#dropdownMajor').val(), 
       minor: $('select#dropdownMinor').val(), 
       typeOfSearch: $('checkbox#typeOfSearch').prop('checked') 
       }, 
       success: function(data) { 
        var result = data 
        $('#fromPartsTable').html(result); 
       } 
      }); 

である私はselectボックスのスクリプトを動作させることができ、そしてそれらは、私は、チェックボックスを追加した後、仕事を続け、チェックボックスの値は渡されていません。

私が興味を持っているのは、「チェックされている」と「チェックされていません」を渡していることだけです。

ご協力いただければ幸いです。ありがとう。

Answer 1

無効なセレクタを使用しています。代わりにinputを使用してください。

あなたのHTML以下、

<input type="checkbox" id="typeOfSearch" value="TRUE"> 
<label for="typeOfSearch">Exact Search?</label> 

function send() { 

    $.ajax({ 
    url: 'partsTable.php', 
    type: 'post', 
    dataType: 'html', 
    data: { 
     major: $('select#dropdownMajor').val(), 
     minor: $('select#dropdownMinor').val(), 
     typeOfSearch: $('input#typeOfSearch').prop('checked') 
    }, 
    success: function(data) { 
     var result = data 
     $('#fromPartsTable').html(result); 
    } 
    }); 

} 

$('#submit').click(function() { 
    send(); 
}); 

Answer 2

Stack Overflowの質問をするときは、よりよく検索してください。あなたのセレクタはほんの始まりに選択されている要素にイベントを添付します

https://stackoverflow.com/a/27265333/5129424

：これは、「jqueryのオンまたはオフを取得」のためにGoogleでトップヒットでした。あなたは、値が変更されたときに未チェック状態を確認決定する必要があります。そのようなタグが存在しないよう

$("#countries input:checkbox").change(function() { 
        var ischecked= $(this).is(':checked'); 
        if(!ischecked) 
         alert('uncheckd ' + $(this).val()); 
       }); 

Working Demo

Answer 3

あなたはcheckboxを選択することはできません。 inputを試してください。タグを気にすることなく一意にidを付けてもよいです。 $('#typeOfSearch')：

function send() { 
 

 
    $cb = $('input#typeOfSearch'); 
 
    console.log($cb.prop('checked')); 
 

 
    $.ajax({ 
 
    url: 'partsTable.php', 
 
    type: 'post', 
 
    dataType: 'html', 
 
    data: { 
 
     major: $('select#dropdownMajor').val(), 
 
     minor: $('select#dropdownMinor').val(), 
 
     typeOfSearch: $cb.prop('checked') 
 
    }, 
 
    success: function(data) { 
 
     var result = data 
 
     $('#fromPartsTable').html(result); 
 
    } 
 
    }); 
 

 
} 
 

 
$('#submit').click(function() { 
 
    send(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="checkbox" id="typeOfSearch" value="TRUE"> 
 
<label for="typeOfSearch">Exact Search?</label> 
 
<button id="submit">Send</button>

Answer 4

あなたのセレクタは

$('checkbox#typeOfSearch') 

間違っているあなたは、このを探しています：

<checkbox id="typeOfSearch"> 

あなただけのIDで選択した場合は、それが働くだろう

$('#typeOfSearch') 

Answer 5

をinput要素を持っては、チェックボックスがチェックされているかどうかを確認する方法はいくつかあります。チェックボックスがオンの場合、値はtrueです。そうでない場合はfalseです。

if ($('#typeOfSearch:checked').length > 0) { 
    /* Do something */ 
} 

if($('#typeOfSearch').prop('checked') == true) { 
    /* Do something */ 
} 

if ($('#typeOfSearch').filter(':checked')) { 
    /* Do something */ 
} 

これが役立ちます。

Answer 6

希望はこのことができます:)

$(document).ready(function() { 
 
    //set initial state. 
 
    $('#typeOfSearch').change(function() { 
 
     $('#typeSelected').html(($(this).is(':checked') ? "TRUE" : "FALSE")); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="checkbox" id="typeOfSearch" /> This Type 
 
<br> 
 
Type Selected: 
 
<span id="typeSelected">FALSE</span>