CODEWITHSUNDEEP
jqueryjquery-uisharepoint
Mort
Mort

Reputation: 837

Object doesn't support property or method 'slider' (jquery in Sharepoint 2010)

I'm getting the error Object doesn't support property or method 'slider' when loading my Sharepoint page.

I'm running this function on page load

function sliderFunctionality() {
$("#sliderdiv").css("background-color", "#ccc");
$("#sliderdiv").slider({
    value: 0,
    min: 0,
    max: 5,
    step: 1,
    slide: function (event, ui) {
        $("#amount").val("$" + ui.value);
    }
});
$("#amount").val("$" + $("#sliderdiv").slider("value"));
alert('testing.....');
};

Here is my webpart code

protected override void CreateChildControls()
    {
        //REGISTER STYLESHEETS
        CssRegistration.Register("/_layouts/STYLES/Stylesheet1.css");

        //REGISTER JAVASCRIPT LIBRARIES
        ScriptLink.Register(this.Page, "/_layouts/SCRIPTS/jquery-1.7.1.min.js", false);
        ScriptLink.Register(this.Page, "/_layouts/SCRIPTS/jquery.SPServices-0.7.0.min.js", false);
        ScriptLink.Register(this.Page, "/_layouts/SCRIPTS/JScript1.js", false);

        this.Controls.Add(new LiteralControl("<label for='amount'>Donation amount ($50 increments):</label>"));
        this.Controls.Add(new LiteralControl("<p><input type='text' id='amount' style='border:0; color:#f6931f; font-weight:bold;' />"));
        this.Controls.Add(new LiteralControl("<div id='sliderdiv'>here</div></p>"));

        this.ChildControlsCreated = true;
    }

The change of css background colour works but the slider doesn't. So jquery is working fine on the page and the DIV is being found.

Why is slider not working? I'm using jquery 1.7.1

Upvotes: 1

Views: 4703

Answers (2)

Mario J Vargas
Mario J Vargas

Reputation: 1195

Make sure you aren't including jQuery more than once. The second one will reset any earlier plugins you have already added to the rendered HTML.

Upvotes: 1

mu is too short
mu is too short

Reputation: 434695

I don't see anywhere that you're pulling in the jQuery-UI JavaScript. I think you should have something that looks more like this:

ScriptLink.Register(this.Page, "/_layouts/SCRIPTS/jquery-1.7.1.min.js", false);
ScriptLink.Register(this.Page, "/_layouts/SCRIPTS/jquery-ui-1.8.17.min.js", false);
...

And you might want a CssRegistration.Register for the jQuery-UI stylesheet as well. I don't know what your jquery-ui.js is called so I guessed.

Upvotes: 3

Related Questions