jQuery와 Ajax를 사용하여 PHP에 여러 확인란 값을 제출하는 방법
10980 단어 ajaxphpjqueryjavascript
이 게시물에서는 jQuery와 ajax를 사용하여 여러 체크박스 값을 PHP에 제출하는 방법에 대한 예제를 보여드리겠습니다. 이전 게시물에서 how to loop the checked checkbox value in jquery에 대해 게시했습니다. 이제 PHP가 그것을 읽고 MySQL 데이터베이스로 처리할 수 있도록 서버 측으로 보낼 것입니다.
샘플 출력
다음은 이 함수의 샘플 출력입니다.
HTML, CSS 및 Javascript 코드
다음은 전체 HTML, CSS 및 Javascript 코드입니다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Loop Checkbox Value in jQuery</title>
<style type="text/css">
.result-wrapper {
display: none;
}
</style>
</head>
<body>
<form id="form" action="server.php">
<label>What animals you have at home?</label>
<div>
<input type="checkbox" name="animals[]" value="Dog"> Dog
</div>
<div>
<input type="checkbox" name="animals[]" value="Cat"> Cat
</div>
<div>
<input type="checkbox" name="animals[]" value="Pig"> Pig
</div>
<br/>
<button type="button" id="submit">Submit</button>
</form>
<script
src="https://code.jquery.com/jquery-3.6.0.min.js"
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
crossorigin="anonymous"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#submit").on("click", function() {
var $this = $(this); //submit button selector using ID
var $caption = $this.html();// We store the html content of the submit button
var form = "#form"; //defined the #form ID
var formData = $(form).serializeArray(); //serialize the form into array
var route = $(form).attr('action'); //get the route using attribute action
// Ajax config
$.ajax({
type: "POST", //we are using POST method to submit the data to the server side
url: route, // get the route value
data: formData, // our serialized array data for server side
beforeSend: function () {//We add this before send to disable the button once we submit it so that we prevent the multiple click
$this.attr('disabled', true).html("Processing...");
},
success: function (response) {//once the request successfully process to the server side it will return result here
// do something here after successfully submitted
},
complete: function() {
$this.attr('disabled', false).html($caption);
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
// You can put something here if there is an error from submitted request
}
});
});
});
</script>
</body>
</html>
PHP 코드
다음은 ajax를 통해 제출된 양식을 포착하는 PHP 코드입니다. 파일 이름: server.php. 속성 action="server.php"형식의 이전 코드에서 호출합니다.
<?php
$request = $_REQUEST;
print_r($request);
?>
이제 이를 수행하는 방법에 대한 완전한 코드가 있습니다. 이제 끝까지 테스트할 시간입니다.
다음은 이 코드의 샘플 파일 이름입니다.
이 튜토리얼이 도움이 되었으면 합니다. 이 코드를 다운로드하려면 여기https://codeanddeploy.com/blog/php/how-to-submit-multiple-checkbox-value-to-php-using-jquery-ajax를 방문하십시오.
행복한 코딩 :)
Reference
이 문제에 관하여(jQuery와 Ajax를 사용하여 PHP에 여러 확인란 값을 제출하는 방법), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/codeanddeploy/how-to-submit-multiple-checkbox-value-to-php-using-jquery-ajax-4cg6텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
