Ajax 호출이 성공시 응답을 표시하지 않음

폴 스티븐 데이비스

prints라는 mysqli 데이터베이스 테이블의 관련 이미지와 정보를 부트 스트랩 모달에 표시 한 다음 이미지, 제목 등을 모달에 표시하려고합니다 ... Ajax 호출이 작동하고 응답이 있어야 할 div를로드하지만 나머지 응답이 모달을 채우지 않습니까?

내 코드는 다음과 같습니다.

데이터베이스 연결 PHP :`

     <?php
     $dbhost = '*';
     $dbuser = '*';
     $dbpass = '*';
     $dbname = '*';
     $conn = mysqli_connect($dbhost, $dbuser, $dbpass, $dbname);

     if(! $conn ) {
        die('Could not connect: ' . mysqli_error());
     }
     //echo 'Connected successfully';

  ?>

오류없이 연결되며 필요할 때 호출됩니다.

해당 테이블의 썸네일을 표시하고 모달 팝업을 클릭하여 사용하기 위해 데이터베이스가 사용되는 내 메인 페이지는 다음과 같습니다.

<?php include 'CreateDb.php';
ini_set('display_errors', 'on');
error_reporting(E_ALL);
$SQLprintsall = 'SELECT * FROM prints';
$printsall = mysqli_query($conn, $SQLprintsall);

?>
<div id ="shop-header">
  <div id="cont-cart">
  <p>BUY PRINTS</p>
  <ul class="cart-actn">
    <li><a class="fa fa-pound-sign" href="#"></a></li>
    <li><a class="fa fa-shopping-cart" href="#"></a></li>
  </ul>
</div>
<ul class="shop-filters">
  <li class="filter-item">All</li>
  <li class="filter-item"><a href="#">Landscapes</a></li>
  <li class="filter-item"><a href="#">Animals</a></li>
  <li class="filter-item"><a href="#">Europe</a></li>
  <li class="filter-item"><a href="#">Scotland</a></li>
  <li class="filter-item"><a href="#">England</a></li>
  <li class="filter-item"><a href="#">Asia</a></li>
  <li class="filter-item"><a href="#">Canada</a></li>
</ul>
</div>
<!--thumbnail images Loop-->
<div id="shop-thumbs">
<?php while($prints = mysqli_fetch_array($printsall)) : ?>
<div id="image-shop" class="image-holder">
  <button type="button" data-id="<?php echo $prints['image']; ?>" class="img-btn btn-success 
printinfo" >
  <img src="<?=$prints['image_href']; ?>">
  </button>
</div>
<?php endwhile; ?>
<!-- Modal -->
<div class="modal fade" id="empModal" role="dialog">
<div class="modal-dialog">

 <!-- Modal content-->
 <div class="modal-content">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal">&times;</button>
  </div>
  <div class="modal-body">

  </div>
  <div class="modal-footer">
   <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
  </div>
 </div>
</div>
</div>
<script>

$(document).on('click', '.printinfo', function(){

 var printinfo = $(this).attr('data-id');
 alert("'.$printinfo.'");

 // AJAX request
 $.ajax({
  url: 'wp-content/themes/LEP/Modals/landscape-product-1.php',
  type: 'post',
  data: {printinfo: printinfo},
  success: function(response){
    console.log(printinfo);
    alert(response);
    // Add response in Modal body
    $('.modal-body').html(response);

    // Display Modal
    $('#empModal').modal('toggle');
  }
});
});

</script>

</div> <!-- end of containder from header.php -->

그러면 다음과 같은 모달 팝업이 호출됩니다.

<?php
include "CreateDb.php";

$printinfo = 0;
if(isset($_POST['printinfo'])){
$printinfo = mysqli_real_escape_string($conn,$_POST['printinfo']);
}
$sql = "SELECT * FROM prints WHERE id =" .$printinfo;
$result = mysqli_query($conn,$sql);

$response = "<div class='modal-holder'>";

while( $prints = mysqli_fetch_array($result)){
$id = $prints['image'];
$image = $prints['image_href'];
$title = $prints['image_title'];

$response .= "<div>";
$response .= "<h1>".$title."</h1>";
$response .= "</div>";

$response .= "<div>";
$response .= "<img src=".$image_href.">";
$response .= "</div>";

}
$response .= "</div>";

echo $response;

?>

모든 것이 클릭으로 작동하지만 모달은 응답 데이터를 포함하는 div를 제외하고는 응답을로드하지 않습니까?

이 사이트는 http://landscapephotoprints.co.uk 에서 위와 같습니다.

어떤 도움이라도 대단히 감사하겠습니다

많은 감사

폴 스티븐 데이비스

데이터를 JSON 객체로 올바르게 전달한 다음 PHP를 사용하여 응답을 표시하는 대신 데이터를 성공 함수에 사용하도록 원래 AJAX 요청을 수정했습니다. Velome의 권장에 따라 JSON 경로를 따라 내려 가서 원래 PHP 응답을 편집하는 것보다 훨씬 더 빠른 솔루션을 찾았습니다.

$(document).on('click', '.printinfo', function(){

 var printinfo = $(this).attr('data-id');
     imageinfo = $(this).find().closest('img').attr('src');
 alert(printinfo);
 $('.modal-h1').html('');
 // AJAX request
 $.ajax({
  url: 'wp-content/themes/LEP/Modals/landscape-product-1.php',
  type: 'post',
  dataType: 'json',
  data: { printinfo: printinfo},
  success: function(data){
    console.log(data);
    console.log(data[0].href);
    console.log(data[0].id);
    console.log(data[0].title);
    alert(data);
    $('.modal-header').prepend('<h1 class=modal-h1>' + data[0].title +'</h1>');
    $('#modimg').attr('src', data[0].href);

    $('#myModal').modal('toggle');
    // Display Modal
    }
});
});

그리고 while 루프 선택을 변경하고 반환 할 배열을 설정했습니다.

 $printinfo = $_POST['printinfo'];

 $sql = "SELECT * FROM prints WHERE image ='".$printinfo."' LIMIT 1";
 $result = mysqli_query($conn, $sql);
 $return_arr = array();

 while($prints = mysqli_fetch_array($result)) : {


  $id = $prints['image'];
  $href = $prints['image_href'];
  $title = $prints['image_title'];

  $return_arr[] = array("id" => $id,
                  "href" => $href,
                  "title" => $title);


} endwhile;

$myJson = json_encode($return_arr);
echo $myJson;
exit;

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

jQuery AJAX 응답이 PHP를 표시하지 않음

분류에서Dev

AJAX $ .post가 응답 데이터를 표시하지 않음

분류에서Dev

Ajax 호출이 올바른 타이머 시간을 표시하지 않음 iPad

분류에서Dev

응답을 다시 보내지 않는 JQuery Ajax 호출

분류에서Dev

SPRING에서 Ajax에서 응답을 호출하는 동안 허용되지 않는 오류 표시

분류에서Dev

Ajax 응답이 JS에 표시되지 않음

분류에서Dev

Ajax 응답이 JS에 표시되지 않음

분류에서Dev

AJAX Jquery 호출이 응답을 반환하지 않습니다.

분류에서Dev

Ajax 호출을하는 동안 Kendo 진행률 표시 줄이 시작되지 않음

분류에서Dev

양식 제출 중 ajax 호출 후 성공 페이지 표시 없음

분류에서Dev

JQuery + ajax + json이 응답을 표시하지 못함

분류에서Dev

ajax가 출력을 표시하지 않음

분류에서Dev

Ajax 요청시 페이지가 일시적으로 응답하지 않음

분류에서Dev

Ajax 요청시 페이지가 일시적으로 응답하지 않음

분류에서Dev

macOS Catalina에서 컬이 응답 본문을 표시하지 않음

분류에서Dev

C # Live 버전이 올바른 오류 응답을 표시하지 않음

분류에서Dev

Ajax 호출이 성공을 반환하지 않습니다.

분류에서Dev

성공에 대한 Ajax 호출이 작동하지 않음

분류에서Dev

응답시 콜백이 호출되지 않음

분류에서Dev

dataTable을로드합니다. AJAX 요청이 성공했지만 데이터가 표시되지 않음

분류에서Dev

Ajax 요청이 응답하지 않음

분류에서Dev

jQuery AJAX 호출이 성공 / 실행되지 않음

분류에서Dev

ajax가 응답하지 않는 jQuery 호출, 오류 없음

분류에서Dev

Ajax 오류 응답을 웹 페이지로 표시

분류에서Dev

서버 응답을 기다리지 않는 Ajax 호출

분류에서Dev

jquery ajax 호출에서 spring mvc 응답이로드되지 않음

분류에서Dev

SoapUI 응답에 속성 값이 표시되지 않음

분류에서Dev

.NetCore 2.2에서 Ajax 호출을 통해 DeveloperExceptionPage가 표시되지 않음

분류에서Dev

Ajax 호출이 응답하지 않습니다.

Related 관련 기사

  1. 1

    jQuery AJAX 응답이 PHP를 표시하지 않음

  2. 2

    AJAX $ .post가 응답 데이터를 표시하지 않음

  3. 3

    Ajax 호출이 올바른 타이머 시간을 표시하지 않음 iPad

  4. 4

    응답을 다시 보내지 않는 JQuery Ajax 호출

  5. 5

    SPRING에서 Ajax에서 응답을 호출하는 동안 허용되지 않는 오류 표시

  6. 6

    Ajax 응답이 JS에 표시되지 않음

  7. 7

    Ajax 응답이 JS에 표시되지 않음

  8. 8

    AJAX Jquery 호출이 응답을 반환하지 않습니다.

  9. 9

    Ajax 호출을하는 동안 Kendo 진행률 표시 줄이 시작되지 않음

  10. 10

    양식 제출 중 ajax 호출 후 성공 페이지 표시 없음

  11. 11

    JQuery + ajax + json이 응답을 표시하지 못함

  12. 12

    ajax가 출력을 표시하지 않음

  13. 13

    Ajax 요청시 페이지가 일시적으로 응답하지 않음

  14. 14

    Ajax 요청시 페이지가 일시적으로 응답하지 않음

  15. 15

    macOS Catalina에서 컬이 응답 본문을 표시하지 않음

  16. 16

    C # Live 버전이 올바른 오류 응답을 표시하지 않음

  17. 17

    Ajax 호출이 성공을 반환하지 않습니다.

  18. 18

    성공에 대한 Ajax 호출이 작동하지 않음

  19. 19

    응답시 콜백이 호출되지 않음

  20. 20

    dataTable을로드합니다. AJAX 요청이 성공했지만 데이터가 표시되지 않음

  21. 21

    Ajax 요청이 응답하지 않음

  22. 22

    jQuery AJAX 호출이 성공 / 실행되지 않음

  23. 23

    ajax가 응답하지 않는 jQuery 호출, 오류 없음

  24. 24

    Ajax 오류 응답을 웹 페이지로 표시

  25. 25

    서버 응답을 기다리지 않는 Ajax 호출

  26. 26

    jquery ajax 호출에서 spring mvc 응답이로드되지 않음

  27. 27

    SoapUI 응답에 속성 값이 표시되지 않음

  28. 28

    .NetCore 2.2에서 Ajax 호출을 통해 DeveloperExceptionPage가 표시되지 않음

  29. 29

    Ajax 호출이 응답하지 않습니다.

뜨겁다태그

보관