Why does this jQuery not only not work, but break all the other jQuery?

Question

I am doing some "fancy" hiding (slideUp and slideDown) of elements on a Sharepoint WebPart.

I added another handler, though, for a button:

$(document).on("click", '[id$=btnAddFoapalRow]', function (e) {
    alert('you mashed the foapal button');
    if ($('[id$=foapalrow3]').css('display') == 'none') {
        $('[id$=foapalrow3]').slideDown();
    }
    else if ($(['id$ = foapalrow4]').css('display') == 'none') {
        $('[id$=foapalrow4]').slideDown();
    }
});

...but it not only fails to work (the HTMLTableRows do not display when the button is clicked), but the other jQuery (checkbox change event handlers, etc.) also fail to work after adding this code. Commenting it out, and the old code does work still.

Why would this code obliterate the whole shebang?

score 3 · Accepted Answer · edited Jun 18 '15 at 23:30

3

$(['id$ = foapalrow4]') <- seems like there is a typo here

it should be

$('[id$ = foapalrow4]')

your code after edit:

$(document).on("click", '[id$=btnAddFoapalRow]', function (e) {
    alert('you mashed the foapal button');
    if ($('[id$=foapalrow3]').css('display') == 'none') {
        $('[id$=foapalrow3]').slideDown();
    } else if ($('[id$ = foapalrow4]').css('display') == 'none') {
        $('[id$=foapalrow4]').slideDown();
    }
});

edited Jun 18 '15 at 23:30

Mohamed-Yousef

23,946
3
19
28

answered Jun 18 '15 at 23:06

timeiscoffee

468
3
14

Okay, it was the typo that was causing the problem, but the code still doesn't work - I'll ask another question for that. – B. Clay Shannon-B. Crow Raven Jun 19 '15 at 17:24
New, related question is here: http://stackoverflow.com/questions/30944017/why-is-this-jquery-not-sliding-down-showing-hidden-slid-up-elements – B. Clay Shannon-B. Crow Raven Jun 19 '15 at 17:30

score 2 · Answer 2 · answered Jun 18 '15 at 23:26

Presumably you must be working on visual studio if you are working with SharePoint. use a JavaScript error validating extension and avoid shooting yourself on the foot with typo's such as the one in your code in line 6 (See screenshot for the plugin that i use (JavaScript parser) in action that detects the JS error!

enter image description here

Why does this jQuery not only not work, but break all the other jQuery?

2 Answers2