jQuery .overlay will not work in Sharepoint web part

Question

I am having an issue with a simple jQuery .overlay function not working properly when added inside of a Sharepoint 2010 web part. The following code works perfectly inside of a normal page in Sharepoint, but when inserted into a webpart, it fails to open the modal.

   // TECHBIZ REGISTRATION POP UP
        $("a[id*=linkCourseRegister_]").overlay({mask: '#000', opacity: '.5'});

        $("[id*=linkCourseRegister_]").click(function(e) {
            //alert(this.id);
            $('input[type=hidden][id*=registrationid]').val(this.id);
            //alert('after ID=' + $('span[id*=registrationid]').text());
            return true;               
        });


<div><a rel="#disabledOverlay" id="ctl00_ctl36_g_be8c97b5_828a_4ff8_9a91_db1a022ee9db_ctl00_linkCourseRegister_1" style="cursor: pointer;">Register&gt;&gt;&gt;</a></div>

<div id="disabledOverlay" class="ecm_ballGraph_call_modal_13" style="display:none;"></div>

Any help would be greatly appreciated,

Jason

jfplataroti jfplataroti · Accepted Answer · 2013-07-10T19:31:19

Kind of late but, instead of using the clientID property to apply the overlay function using jquery function use a css class using the CssClass property, like:

<asp:HyperLink id="someID" CssClass="someClass" runat="server" />

and then on the script:

 $(".someClass").overlay({mask: '#000', opacity: '.5'});

I hope it helps!

jQuery .overlay will not work in Sharepoint web part

1 Answers