Using jQuery with ComponentOne on ASP.NET

Question

I'm trying ComponentOne and I'm having a problem with jQuery.
I'm working en ASP.NET so i have an .aspx with several controls including an update panel for the page.
I have a TabControl control from ComponentOne in wich i have all the information of my page. That information uses jQuery Calendar and other plugins.
Before I imported ComponentOne everything was OK but then jQuery seems to be loading twice (in theory for what i'd investigated).
I keep getting the .datepicker is not a function, and I can't get colorbox to work. I've tested everything in an aspx apart and everything's working fine. Does anyone have a solution for this ? Thankyou very much.

A little bit of my code:

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
<script type="text/javascript" src="/Scripts/jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="/Scripts/jquery-ui-1.8.8.custom.min.js"></script>
<script type="text/javascript" src="/Scripts/jquery.datePicker.js"></script>
<script type="text/javascript" src="/Scripts/jquery.colorbox-min.js"></script>
<link href="/Styles/jquery-ui-1.8.8.custom.css" type="text/css" rel="Stylesheet" />
<link href="/Styles/colorbox.css" type="text/css" rel="Stylesheet" />

that's the head content.
i'm using jquery like this:

$(document).ready(function () {
        $("#<%=tbFechaIngresoEntrante.ClientID %>").datepicker();
        $("#<%=tbFechaAsignacionEntrante.ClientID %>").datepicker();
        $("#<%=tbFechaOficioEntrante.ClientID %>").datepicker();
        $("#<%=tbFechaSalidaSalientes.ClientID %>").datepicker();

    });

and finally i have tabcontrol define like this with several other controls:

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<asp:UpdatePanel runat="server" ID="upTotal">
    <ContentTemplate>
        <asp:Label runat="server" ID="lbPermisos" Text="Usted no tiene permiso para ver esta página."
            Visible="false"></asp:Label>
        <div id="divSeguridad" style="margin-left: 200px" runat="server">            
            <cc1:C1TabControl ID="C1TabControl1" VisualStyle="Office2007Blue" runat="server"
                Height="100%" Width="75%" VisualStylePath="/Styles" SelectedIndex="0">
                <TabPages>
                    <cc1:C1TabPage ID="C1TabPage1" Text="Documentación Entrante">

I'm seeing more and more companies do this, it's becoming a real problem. Default includes of jQuery that you can't override becomes very tedious to debug. — Mike Robinson, Mar 14 '11 at 15:26

euther · Accepted Answer · 2011-03-18T15:25:36.970

Controls for ComponentOne have a property called UseEmbeddedjQuery wich is set to true by default. I tried setting it up to false and it didn't worked at first because i had several other controls from ComponentOne inside the TabControl wich weren't set to false too. I changed every UseEmbeddedjQuery property in every control and now's working fine.

I found that solution here.

For people who come across a problem like this the solution is simple: import your own jQuery file and set the UseEmbeddedjQuery property to false en every control.
Hope this helps someone.

ADDED

Yet another solution is to leave that property true and use:
jqr = jQuery.noConflict(true);

Using jQuery with ComponentOne on ASP.NET

1 Answers1