Can't pass the value in php function using ajax

Question

I created the function for my site the users will click the images according to the clicked image I showing the clicked image details so I created the onclick function and I passing that image ID using the ajax function I passing the image ID in PHP file and get that ID into post method and same time passing that variable into PHP class function. My issue is inside the script ID is coming but php file I can't get that variable I don't understand what is the issue. Please help me to find out this issue.

This is the clickable image with onclick function

<div class=\"col-md-3\">
       <div class=\"single-new-trend\">
            <a href=\"#\" id='BandChangeImg$BraproId' onclick='ImageChange($BraproId);'>
               <img src=\"$BraProImg\" alt=\"$BraProName\"></a>
       </div>
</div>

This is my ajax script

function ImageChange(x) {
    var BrandName = x;

    alert(BrandName);

    $.ajax({
        url: 'validate/brandImage.php',
        method: 'POST',
        dataType: 'json',
        data: {BrandId:BrandName},
        success:function(data){
            //alert(data);
            if($.trim(data))
            {
                alert("Success!");
            }else{
                alert("Failed!")
            }
        }
    });
}

Last My PHP file

<?php

include("../db/mySqlDBi.class.php");
$DBConn = new mySqlDB;

$BrandId = $_POST['BrandId'];


include("../classes/personlized.class.php");
$personlized = new personlizedClass;

$result=$personlized->DisplayBrandProductDetails($BrandId);



echo "<script>alert('12334');</script>";

?>

Answer 1

You have

dataType: "json",

in the $.ajax call. jQuery will try to parse the response as JSON, and will get an error if this fails.

The script is sending

echo "<script>alert('12334');</script>";

That's HTML, not JSON, so the above error happens.

Either change it to dataType: "html" or change the PHP to something like

echo json_encode("Brand is $BrandId");