You are viewing a plain text version of this content. The canonical link for it is here.
Posted to user@click.apache.org by Parth Joshi <jo...@gmail.com> on 2012/06/18 19:27:45 UTC
javascript prototype error on adding of jQuery Code
I added JQuery UI Code for putting tabs on my form...
I get following JS Errors:
Uncaught SyntaxError: Unexpected identifier Register.htm:530
Uncaught TypeError: Object [object Object] has no method 'attachEvent'
prototype.js:4536
Uncaught TypeError: Object [object Object] has no method 'dispatchEvent'
prototype.js:4619
My JQuery Code goes as follows:
registertabs.js:
$(document).ready(initScript);
function initScript () {
initComponents();
}
function initComponents() {
$('#registerTabs').tabs();
}
Added this script in HeaderElements in Click page:
@Override
public List<Element> getHeadElements() {
if (headElements == null) {
headElements = super.getHeadElements();
headElements.add(new JsImport("/js/jquery/js/jquery-1.7.2.min.js"));
headElements.add(new JsImport(
"/js/jquery/js/jquery-ui-1.8.20.custom.min.js"));
headElements.add(new CssImport(
"js/jquery/css/smoothness/jquery-ui-1.8.20.custom.css"));
headElements.add(new JsImport(
"/js/components/ajax/registertabs.js"));
}
return headElements;
}
Velocity/Htm code goes as follows:
...
..
${registerForm.startTag()}
<div id="registerTabs">
<ul>
<li><a href="#tab1">Personal Details</a></li>
<li><a href="#tab2">Family Details</a></li>
<li><a href="#tab3">Kundali Details</a></li>
<li><a href="#tab4">Expectation</a></li>
</ul>
<div id="tab1">
${registerForm.fields.personalDetailFieldSet}
</div>
<div id="tab2">
${registerForm.fields.familyDetailsFieldSet}
</div>
<div id="tab3">
${registerForm.fields.kundaliDetailsFieldSet}
</div>
<div id="tab4">
<p>Please enter your expectations:</p>
</div>
</div>
${registerForm.endTag()}
$jsElements
..
..
Please help...
Thanks and Regards,
--
*Parth J Joshi*
Re: javascript prototype error on adding of jQuery Code
Posted by Parth Joshi <jo...@gmail.com>.
Thanks Bob,
Will workout on it...
:)
On 19 June 2012 11:12, Bob Schellink <sa...@gmail.com> wrote:
> Hi Parth,
>
> Sounds as if you are mixing jQuery and Prototype.js library on the
> same page? Some of the Click Extra controls uses the Prototype.js
> library which might be how you got Prototype included.
>
> You could try to use the following jQuery workaround:
> http://docs.jquery.com/Using_jQuery_with_Other_Libraries
>
> Alternatively, do not use the Click extra controls which includes the
> Prototype library. If you are using the Click DateField (which uses
> Prototype) rather look at the CalendarField:
> http://code.google.com/a/apache-extras.org/p/click-calendar/
>
> regards
>
> Bob
>
> On Mon, Jun 18, 2012 at 7:27 PM, Parth Joshi <jo...@gmail.com>
> wrote:
> > I added JQuery UI Code for putting tabs on my form...
> >
> > I get following JS Errors:
> >
> > Uncaught SyntaxError: Unexpected identifier Register.htm:530
> > Uncaught TypeError: Object [object Object] has no method 'attachEvent'
> > prototype.js:4536
> > Uncaught TypeError: Object [object Object] has no method 'dispatchEvent'
> > prototype.js:4619
> >
> >
> > My JQuery Code goes as follows:
> >
> > registertabs.js:
> >
> > $(document).ready(initScript);
> >
> >
> > function initScript () {
> > initComponents();
> > }
> >
> > function initComponents() {
> > $('#registerTabs').tabs();
> > }
> >
> > Added this script in HeaderElements in Click page:
> >
> > @Override
> > public List<Element> getHeadElements() {
> > if (headElements == null) {
> > headElements = super.getHeadElements();
> > headElements.add(new JsImport("/js/jquery/js/jquery-1.7.2.min.js"));
> > headElements.add(new JsImport(
> > "/js/jquery/js/jquery-ui-1.8.20.custom.min.js"));
> > headElements.add(new CssImport(
> > "js/jquery/css/smoothness/jquery-ui-1.8.20.custom.css"));
> > headElements.add(new JsImport(
> > "/js/components/ajax/registertabs.js"));
> > }
> > return headElements;
> > }
> >
> > Velocity/Htm code goes as follows:
> >
> > ...
> > ..
> >
> > ${registerForm.startTag()}
> > <div id="registerTabs">
> > <ul>
> > <li><a href="#tab1">Personal Details</a></li>
> > <li><a href="#tab2">Family Details</a></li>
> > <li><a href="#tab3">Kundali Details</a></li>
> > <li><a href="#tab4">Expectation</a></li>
> > </ul>
> > <div id="tab1">
> > ${registerForm.fields.personalDetailFieldSet}
> > </div>
> > <div id="tab2">
> > ${registerForm.fields.familyDetailsFieldSet}
> > </div>
> > <div id="tab3">
> > ${registerForm.fields.kundaliDetailsFieldSet}
> > </div>
> > <div id="tab4">
> > <p>Please enter your expectations:</p>
> > </div>
> > </div>
> > ${registerForm.endTag()}
> >
> > $jsElements
> > ..
> > ..
> >
> > Please help...
> >
> > Thanks and Regards,
> >
> > --
> > Parth J Joshi
> >
> >
>
--
*Parth J Joshi*
Re: javascript prototype error on adding of jQuery Code
Posted by Bob Schellink <sa...@gmail.com>.
Hi Parth,
Sounds as if you are mixing jQuery and Prototype.js library on the
same page? Some of the Click Extra controls uses the Prototype.js
library which might be how you got Prototype included.
You could try to use the following jQuery workaround:
http://docs.jquery.com/Using_jQuery_with_Other_Libraries
Alternatively, do not use the Click extra controls which includes the
Prototype library. If you are using the Click DateField (which uses
Prototype) rather look at the CalendarField:
http://code.google.com/a/apache-extras.org/p/click-calendar/
regards
Bob
On Mon, Jun 18, 2012 at 7:27 PM, Parth Joshi <jo...@gmail.com> wrote:
> I added JQuery UI Code for putting tabs on my form...
>
> I get following JS Errors:
>
> Uncaught SyntaxError: Unexpected identifier Register.htm:530
> Uncaught TypeError: Object [object Object] has no method 'attachEvent'
> prototype.js:4536
> Uncaught TypeError: Object [object Object] has no method 'dispatchEvent'
> prototype.js:4619
>
>
> My JQuery Code goes as follows:
>
> registertabs.js:
>
> $(document).ready(initScript);
>
>
> function initScript () {
> initComponents();
> }
>
> function initComponents() {
> $('#registerTabs').tabs();
> }
>
> Added this script in HeaderElements in Click page:
>
> @Override
> public List<Element> getHeadElements() {
> if (headElements == null) {
> headElements = super.getHeadElements();
> headElements.add(new JsImport("/js/jquery/js/jquery-1.7.2.min.js"));
> headElements.add(new JsImport(
> "/js/jquery/js/jquery-ui-1.8.20.custom.min.js"));
> headElements.add(new CssImport(
> "js/jquery/css/smoothness/jquery-ui-1.8.20.custom.css"));
> headElements.add(new JsImport(
> "/js/components/ajax/registertabs.js"));
> }
> return headElements;
> }
>
> Velocity/Htm code goes as follows:
>
> ...
> ..
>
> ${registerForm.startTag()}
> <div id="registerTabs">
> <ul>
> <li><a href="#tab1">Personal Details</a></li>
> <li><a href="#tab2">Family Details</a></li>
> <li><a href="#tab3">Kundali Details</a></li>
> <li><a href="#tab4">Expectation</a></li>
> </ul>
> <div id="tab1">
> ${registerForm.fields.personalDetailFieldSet}
> </div>
> <div id="tab2">
> ${registerForm.fields.familyDetailsFieldSet}
> </div>
> <div id="tab3">
> ${registerForm.fields.kundaliDetailsFieldSet}
> </div>
> <div id="tab4">
> <p>Please enter your expectations:</p>
> </div>
> </div>
> ${registerForm.endTag()}
>
> $jsElements
> ..
> ..
>
> Please help...
>
> Thanks and Regards,
>
> --
> Parth J Joshi
>
>