CODEWITHSUNDEEP
jqueryajax
Your Friend
Your Friend

Reputation: 61

jquery conflict issue while using ajax

I have this code on my webpage. It displays testimonials. But i am getting this strange error of Uncaught TypeError: Property '$' of object [object Object] is not a function.

Some similar issues on stack overflow suggested to use jQuery instead of $,but even that aint working here.

The code is this

<script src="./Aero Travel & Tours_files/jquery-1.9.0.min.js" type="text/javascript" charset="utf-8"></script>


<script type="text/javascript" src="./Aero Travel & Tours_files/jquery.bxslider.min.js"></script>
<script> 


var bx= $.noConflict(true);

    bx(document).ready(function() {
bx('.testimonials-slider').bxSlider({
        slideWidth: 800,
        minSlides: 1,
        maxSlides: 1,
        slideMargin: 32,
        auto: true,
        autoControls: true
      })});




 $(document).ready(function () {

$.ajax({
    type: "POST",
    url: "/Web/Common/API/WebService1.asmx/GetTestimonials",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    async: true,
    success: function (data) {
        var json = $.parseJSON(data.d)
        var testimonial = "";
        $.each(json, function (i, obj) {
            if (i == 0 || i + 1 == json.length) {
                testimonial += "<div class='slide bx-clone'>";
            }
            else {
                testimonial += "<div class='slide'>";
            }
            testimonial += "   <div class='testimonials-carousel-context'>";
            testimonial += "      <div class='testimonials-name' style='font-weight: bold;'>" + obj.Signature + "</div>";
            testimonial += "      <div class='testimonials-carousel-content'>" + obj.Description + "</div>";
            testimonial += "   </div>";
            testimonial += "</div>";
            testimonial += "<br/>";
        });
        $('#testimonials').html(testimonial);
    }, //success
    error: function (jqXHR, testStatus, errorThrown) {
        alert("The following error occured while retrieving the project information: " + testStatus + " " + errorThrown);
    } //error
});
});
</script>

Upvotes: 1

Views: 199

Answers (2)

Sathish RG
Sathish RG

Reputation: 112

var bx= $.noConflict(true);

'$' symbols should be replaced with 'bx' everywhere in your code

Upvotes: 0

axel.michel
axel.michel

Reputation: 5764

If it is only a conflict problem, try to change your document.ready function in something like this:

jQuery(document).ready(function($) {
  // inside you can now use the $ as before.

});

Upvotes: 1

Related Questions