Thanks, Jon, I tried out the technique described in the link that you provided and it worked very well.
Thank you for saving much of my time and effort. On Jan 15, 11:19 am, Jon Banner <banali...@googlemail.com> wrote: > have a go withhttp://docs.jquery.com/Core/jQuery.noConflict > > 2010/1/15 j...@verax <joti.bis...@gmail.com> > > > > > I found the problem. > > > Its the $ sign ! The $ sign has a very special meaning in the jQuery > > framework. So if it is used in any other Javascript that doesnt use > > jQuery, it will be incompatible. So this means we should not use '$' > > in our code just because it looks cool ! Also, be very careful when > > you copy javascript plug-ins from the internet if you are already > > using javascript frameworks. They will most likely create an > > incompatibility. > > > I have to now do either of the following: > > > a) re-write all my javascript code to use jQuery > > b) write my own autocomplete javascript. > > > On Jan 14, 5:24 pm, "j...@verax" <joti.bis...@gmail.com> wrote: > > > Hi jQuery guru, > > > > I have an application based on struts and tiles. Validation is done by > > > javascript at a global level. > > > When I include my autocomplete code in my JSP page, the validation > > > (checkValidation()) malfunctions with a javascript error - "Object > > > does not support this property or method" at the line > > > > if (CCRDerrorContainer.hasChildNodes()). > > > > If I remove the autocomplete code from my JSP (business logic + > > > autocomplete libraries) , the validation works as designed. Details of > > > relevant code is provided below. Can anyone provide me with any clue > > > as to how to resolve this problem ? > > > > ====================================================================== > > > ----------------------------------------------------------------------------------- > > > My JSP file > > > ----------------------------------------------------------------------------------- > > > <%@ include file="../common/include.jsp" %> > > > <link rel="stylesheet" type="text/css" href="css/ > > > jquery.autocomplete.css" /> > > > <script type="text/javascript" src="js/autocomplete/lib/jquery.js"></ > > > script> > > > <script type='text/javascript' src='js/autocomplete/ > > > jquery.autocomplete.js'></script> > > > > <script> > > > var cols = []; // column mappings : 0=Last name, > > 1=First Name, > > > 2=Title, 3 = Employee ID > > > $().ready(function() { > > > > $('input#employeeLastName').flushCache(); > > > $("#employeeLastName").autocomplete("jsp/common/getData.jsp? > > > dataType=EmployeeName",{ > > > minChars: 1, > > > max: 1000, > > > width: 400, > > > delay: 1000, > > > selectFirst: false, > > > autoFill: false, > > > cacheLength: 20, > > > matchContains: false, > > > matchSubset: true, > > > mustMatch: false, > > > matchCase: true, > > > formatItem: function(row, i, max) > > { > > > cols = row[0].split("%"); > > > return i + "/" + max + ": > > " + cols[0] + ", " + cols[1] + " (" + > > > cols[2] + ")"; > > > }, > > > formatMatch: function(row) { > > > cols = row[0].split("%"); > > > return cols[0] + ", " + > > cols[1]; > > > }, > > > formatResult: function(row) { > > > cols = row[0].split("%"); > > > return cols[0] + ", " + > > cols[1] + " (" + cols[2] + ")"; > > > } > > > }); > > > $("#employeeLastName").result(function(event, row, formatted) { > > > if (row) { > > > cols = row[0].split("%"); > > > $(this).next().val(cols[3]); > > > } > > > }); > > > }); > > > </script> > > > <tiles:importAttribute name="task" /> > > > <tiles:importAttribute name="action" /> > > > <tiles:importAttribute name="displayAction" /> > > > <tiles:importAttribute name="showArchived" /> > > > > <style type="text/css"> > > > @import > > "${pageContext.request.contextPath}/css/employee/select.css"; > > > </style> > > > > <h1> > > > <fmt:message key="employee.label.title.select" /> > > > </h1> > > > <hr /> > > > > <div id="employeeSelect"> > > > <tiles:insert definition="successMessages" /> > > > <tiles:insert definition="failureMessages" /> > > > <ccrd:errors /> > > > > <html:form action="${action}" method="post" > > > > > <label for="employee" id="employeeLbl" > > > > <fmt:message key="employee.text.selectEmployee" > > /> > > > <span class="task"><fmt:message key="${task}" > > />:</span> > > > </label> > > > > <html:text styleId="employeeLastName" property="lastName" > > > size="100" > > > maxlength="200"> > > > </html:text> > > > <html:hidden property="employeeId" /> > > > <BR/> <BR/> > > > <div class="buttons"> > > > <html:submit property="submit" > > styleId="submitButton"><fmt:message > > > key="button.submit"/></html:submit> > > > <html:submit property="cancel" > > styleId="cancelButton"><fmt:message > > > key="button.cancel"/></html:submit> > > > </div> > > > > </html:form> > > > </div> > > > -------------------------------------------------------------------------------------------------------- > > > Tiles-Defs extract > > > --------------------------------------------------------------------------------------------------------- > > > > <definition name=".default" path="/jsp/layouts/template.jsp" > > > > <put name="header" value="/jsp/layouts/header.jsp" /> > > > <put name="leftnav" value="/jsp/layouts/menu.jsp" /> > > > <put name="footer" value="/jsp/layouts/footer.jsp" /> > > > </definition> > > > ----------------------------------------------------------------------------------------------------------- > > > Template.jsp > > > ------------------------------------------------------------------------------------------------------------ > > > <%@ page contentType="text/html;charset=ISO-8859-1" language="java"%> > > > <%@ include file="../common/include.jsp"%> > > > > <% > > > response.setHeader("Pragma","no-cache"); //HTTP 1.0 > > > response.setHeader("Cache-Control","no-cache, private, no-store, max- > > > stale=0"); //HTTP 1.1 > > > response.setDateHeader("Expires", 0); //prevents caching at the proxy > > > server > > > %> > > > > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" > > > "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";> > > > > <html> > > > <head> > > > <base > > > href="@base.href.protocol@ > > ://${pageContext.request.serverName} > > > @base.href.p...@${pagecontext.request.contextpath}/" /> > > > <title><bean:message key="template.header.title" /> > > > </title> > > > <meta http-equiv="Content-Type" > > > content="text/html; charset=ISO-8859-1" /> > > > <meta http-equiv="pragma" content="no-cache" /> > > > <meta http-equiv="cache-control" content="no-cache" /> > > > <meta http-equiv="expires" content="Sun, 28 Dec 1997 > > 09:32:45 GMT" / > > > > <link rel="stylesheet" type="text/css" > > href="css/style.css" /> > > > <link rel="stylesheet" type="text/css" > > href="css/menu.css" /> > > > <link rel="stylesheet" type="text/css" href="main.css" /> > > > > <script type="text/javascript" > > src="js/common.js"></script> > > > <script type="text/javascript" > > src="js/calendar.js"></script> > > > <script type="text/javascript" > > src="js/StrutsMenuControl.js"></ > > > script> > > > <script type="text/javascript" > > src="js/TableFilter.js"></script> > > > <script type="text/javascript" > > src="js/validation.js"></script> > > > > </head> > > > > <body onload="checkValidation();"> > > > <div id="shadow"> > > > <div id="container"> > > > <tiles:insert attribute="header" > > flush="false" /> > > > <div id="body"> > > > <div id="menucontainer"> > > > <tiles:insert > > attribute="leftnav" flush="false" /> > > > </div> > > > <div id="contentcontainer"> > > > <div id="content"> > > > <!-- Content goes > > here --> > > > <tiles:insert > > attribute="body" flush="false" /> > > > <!-- Content ends > > here --> > > > </div> > > > </div> > > > <div class="break"> > > > </div> > > > </div> > > > </div> > > > </div> > > > > <tiles:insert attribute="footer" flush="false" /> > > ... > > read more »- Hide quoted text - > > - Show quoted text -
