Проблема сбора значения флажка с использованием AJAX и переполнения стека

Я работаю над формой, которая имеет флажок ввода. Форма имеет поле ввода флажка, посредством которого я изменяю значение динамически в зависимости от того, установлен флажок или нет. Когда пользователь нажимает на флажок, значение должно измениться на 1 ,,, если не нажать, значение должно быть равно нулю. Я собираю значение через AJAX и отправляю его в бэкэнд (сборка в PHP Laravel). Когда я dd () получаю значение, я получаю нулевое значение флажка.

Макет, содержащий поле флажка

 <div class="check-now {{ $errors->has('spouse') ? ' has-error' : '' }}" style="width: 100%;">
<h1 class="cover-travel">I am travelling with</h1>
<label class="spouse-me">
<h1 class="pumba">Spouse</h1>
<input type="checkbox" id="spouse" value="" class="spouse"  onClick="checkMark()">
</label>
@if ($errors->has('spouse'))
<span class="help-block">
<strong>{{ $errors->first('spouse') }}</strong>
</span>
@endif
</div>

Функция, которая изменяет значение флажка

 function checkMark() {
var checkBox = document.getElementById("spouse");
var text = document.getElementById("spouseDetail");

// If the checkbox is checked, display the output text
if (checkBox.checked == true){
checkBox.value = '1';
} else {
checkBox.value = 'O';
}
}

AJAX для отправки данных в бэкэнд

// Get the form via its id
var form = $('#travel_form');

$( "form" ).submit(function( event ) {
event.preventDefault();
//alert('clicked');


//Fetch the value of spouse
var spouse = $('#spouse').val();

//Log in console tab am getting an empty value
console.log(spouse);

//Add in a JS object
var type = {
'spouse' : spouse
}

$.ajax({
type: "POST",
url: "getplans",
data:JSON.stringify(type),
contentType: 'application/json',
dataType: "json",
success: function(response){
window.location.href="getp" ;
},
//Alert errors from backend
error: function(data) {
var errors = '';
for(datos in data.responseJSON){
errors += data.responseJSON[datos] + '\n';
}
alert(errors);
}
});
});

Контроллер, обрабатывающий вызов AJAX

 public
function validatePlanEntries(Request $request)
{
//dd($request->all());
}

0

Решение

Вы можете немного упростить свой код. Если вы просто хотите передать состояние флажка, вам нужно только:

Вместо вашего checkMark() функция, просто проверьте это в обратном вызове отправки.

// This will set the value 1 if it is checked and 0 if it isn't.
var checkBox = document.getElementById("spouse");
var type = {
'spouse' : checkBox.checked ? 1 : 0
}

// Don't stringify the object, just pass it as is. jQuery will take care if it.
$.ajax({
...
data: type,
...
0

Другие решения

Других решений пока нет …

По вопросам рекламы ammmcru@yandex.ru
Adblock
detector