0 レビュー
1 回答
php-Ajaxフォームデータパス
PHPファイルでフォームデータを渡すにはどうすればよいですか？私は以下の解決策を試しましたが、うまくいきませんでした。 PHP関数のすべてのチェックボックスを渡す必要があります。試しましたが、必要な完全な値が得られませんでしたか？
問題を確認して、どこが間違っていたかを教えてください。
<form id="filterForm" method="post">
<div class="dropdown">
<button class="btn btn-secondary dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Beer Brands
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<ul>
<li><input class="clickBox" type="checkbox" name="beer_brands[]" value="valu1" />Test</li>
<li><input class="clickBox" type="checkbox" name="beer_brands[]" value="valu2"/>Test</li>
<li><input class="clickBox" type="checkbox" name="beer_brands[]" value="value3"/>Test</li>
</ul>
</div>
</div>
<div class="dropdown">
<button class="btn btn-secondary dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Locations
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<ul>
<li><input class="clickBox" type="checkbox" name="locations[]" value="value4" />Test</li>
<li><input class="clickBox" type="checkbox" name="locations[]" value="value5"/>Test</li>
<li><input class="clickBox" type="checkbox" name="locations[]" value="value6"/>Test</li>
</ul>
</div>
</div>
<div class="dropdown">
<button class="btn btn-secondary dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Sort By
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<ul>
<li><input class="clickBox" type="checkbox" name="sort_by[]" value="value7" />Test</li>
<li><input class="clickBox" type="checkbox" name="sort_by[]" value="value8"/>Test</li>
<li><input class="clickBox" type="checkbox" name="sort_by[]" value="value9"/>Test</li>
</ul>
</div>
</div>
</form>
JQuery
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery(".clickBox").click(function(e){
var b_b_Array = []
var location_Array = []
var sort_by_Array = []
jQuery('.clickBox').each(function ()
{
//debugger;
jQuery("input[name='beer_brands[]']").each( function () {
if(jQuery('input[name="beer_brands[]"]').is(':checked')) {
b_b_Array.push(jQuery(this).val());
}
});
jQuery("input[name='locations[]']").each( function () {
if(jQuery('input[name="locations[]"]').is(':checked')) {
location_Array.push(jQuery(this).val());
}
});
jQuery("input[name='sort_by[]']").each( function () {
if(jQuery('input[name="sort_by[]"]').is(':checked')) {
sort_by_Array.push(jQuery(this).val());
}
});
});
console.log(b_b_Array);
console.log(location_Array);
console.log(sort_by_Array);
var ajaxurl = "<?php bloginfo('url');?>/wp-admin/admin-ajax.php";
jQuery.ajax({
url: ajaxurl,
type : 'post',
data: {
'action':'all_give_aways_filter',
'data' : jQuery("filterForm").serialize(),
},
success : function( response ) {
console.log(response);
// jQuery("div#errMsg").css({'background-color':'white','color':'red'});
// jQuery("div#errMsg").html(response);
}
});
});
});
</script>
この問題の解決にご協力ください。
わからない
0
レビュー
答え :
解決策：
このJavaScriptを置き換えてみてください。これがお役に立てば幸いです
function get_checkbox_value(){
var array = [];
jQuery(':checkbox:checked').each(function(i, _this){
var checkboxname = jQuery(_this).attr('name'); checkboxname = checkboxname.replace('[]','');
array[checkboxname]=[];
array[checkboxname].push(jQuery(this).val());
});
return array;
}
jQuery(document).ready(function(){
jQuery("#filterForm").submit(function(e){
e.preventDefault();
var formdata = get_checkbox_value();
var ajaxurl = "<?php bloginfo('url');?>/wp-admin/admin-ajax.php";
jQuery.ajax({
url: ajaxurl,
type : 'POST',
data: {
'action':'all_give_aways_filter',
'data' : formdata,
},
success : function( response ) {
console.log(response);
}
});
});
});
わからない
同様の質問
私たちのウェブサイトで同様の質問で答えを見つけてください。