[jQuery] Re: clueTip send header with Ajax request
I got rid of the syntax error, but it appears that clueTip is not
inserting the header on the request.
function initToolTips() {
jQuery('a.eventTitle').cluetip({
width: 350,
local: false,
hideLocal: true,
cursor: 'pointer',
cluetipClass: 'jtip',
arrows: true,
dropShadow: false,
hoverIntent: false,
sticky: true,
mouseOutClose: false,
closePosition: 'title',
closeText: '',
clickThrough: true,
hoverIntent: {
sensitivity: 3,
interval: 200,
timeout: 100
},
ajaxCache: false,
ajaxSettings: {
dataType: 'xml',
//global: true
beforeSend: function(xhr) {
xhr.setRequestHeader("${apiAuthHeader_name}", "$
{apiAuthHeader_value}");
}
}
}
On Nov 21, 9:10 am, n8cshaw <[EMAIL PROTECTED]> wrote:
> Hi all. I am implementing clueTip and have it working just fine using
> an Ajax call. However, when all is said and done, the Ajax call will
> be hitting a web service that requires a custom authentication header.
> I have set up my jQuery global ajax options to send the header on all
> requests.
>
> jQuery.ajaxSetup({
>beforeSend: function(xhr)
> { xhr.setRequestHeader("customAuthHeader",
> "customAuthHeaderValue");}
> });
>
> However, it does not appear that clueTip recognizes these global
> options (ideally, it probably should). So, I have to send the header
> on the request manually. I have tried to do this via the ajaxSettings,
> but I am getting syntax errors and the clueTip docs don't mention
> anything about usingbeforeSend, so I am not even sure if it is
> possible.
>
> ajaxSettings: {
> dataType: 'xml',
>beforeSend: function(xhr) {
> xhr.setRequestHeader("customAuthHeader",
> "customAuthHeaderValue")
> }
> },
>
> Has anyone done this or can anyone provide some advice on how to do
> this?
[jQuery] clueTip send header with Ajax request
Hi all. I am implementing clueTip and have it working just fine using
an Ajax call. However, when all is said and done, the Ajax call will
be hitting a web service that requires a custom authentication header.
I have set up my jQuery global ajax options to send the header on all
requests.
jQuery.ajaxSetup({
beforeSend: function(xhr)
{ xhr.setRequestHeader("customAuthHeader",
"customAuthHeaderValue");}
});
However, it does not appear that clueTip recognizes these global
options (ideally, it probably should). So, I have to send the header
on the request manually. I have tried to do this via the ajaxSettings,
but I am getting syntax errors and the clueTip docs don't mention
anything about using beforeSend, so I am not even sure if it is
possible.
ajaxSettings: {
dataType: 'xml',
beforeSend: function(xhr) {
xhr.setRequestHeader("customAuthHeader",
"customAuthHeaderValue")
}
},
Has anyone done this or can anyone provide some advice on how to do
this?
[jQuery] Re: Event Firing Twice
I was wrong about it being fixed if local scripts are not included. It was throwing an error because a script did not exist, which was stopping the event stack, thus preventing the event from firing twice. I am still stumped... my stripped down version, which only contains 3 divs and very little JS code still has the event firing twice. On Nov 6, 11:49 am, n8cshaw <[EMAIL PROTECTED]> wrote: > ok, I stripped a bunch of stuff out and posted a simplified file. This > should make it easier to see what is going on. The event is still > firing twice. > > http://www.iaffectproperties.com/code/SearchForm_simple.htm > > On Nov 6, 11:21 am, MorningZ <[EMAIL PROTECTED]> wrote: > > > I took a look at the source code in the first link but there's > > too much to look at, can you be more specific about what 's, what > > selectors, and what chunk of javascript code is not doing what you > > expect it to? > > > that would help others help you > > > On Nov 6, 10:22 am, n8cshaw <[EMAIL PROTECTED]> wrote: > > > > weird, works for me... I posted it > > > athttp://www.iaffectproperties.com/code/SearchForm.htm > > > also. > > > > All of the images, css and local JS are pointing to localhost and > > > don't work obviously (JQuery and JQuery UI are being loaded from > > > Google)... as a side-effect of that, the event appears to no longer > > > run twice. I guess that tells me that some other script I am using is > > > interfering with the event and causing it to run twice? How can I > > > debug which one and prevent this from happening? I thought JQuery was > > > namespaced to prevent this? > > > > On Nov 6, 9:40 am, Liam Potter <[EMAIL PROTECTED]> wrote: > > > > > The link you provided doesn't seem to work. > > > > > n8cshaw wrote: > > > > > One more interesting note... if the parent div is visible (display: > > > > > block) when the page loads, I do not see this behavior. It is only > > > > > when the parent div is not visible (display: none) on page load that > > > > > it happens. > > > > > > On Nov 6, 9:07 am, n8cshaw <[EMAIL PROTECTED]> wrote: > > > > > >> I am attaching an event to a link. The link lets the user toggle the > > > > >> display of a child div inside of a parent div. However, when the link > > > > >> is clicked, the event is run twice (div opens and then closes > > > > >> immediately). > > > > > >> I have tried using .click() and .bind() and it makes no difference > > > > >> which one I use. I have also tried using an anonymous function versus > > > > >> a callback function and there is no difference. I tried using return > > > > >> false and e.stopPropagation() and there is no difference. I have > > > > >> triple-checked that I am not binding the event more than once in my > > > > >> code. The only way I can get it to not fire twice is to put the call > > > > >> in the link's onclick attribute. > > > > > >> I have seen several similar posts on this in the group, but I have > > > > >> not > > > > >> seen a reason why this happens or a fool-proof way to stop it from > > > > >> happening. The only thing I can think of is that one of the other JS > > > > >> libraries I am using on the page, like Matt Kruse's > > > > >> DynamicOptionList, > > > > >> etc... are interfering with the event propagation, but I don't know > > > > >> for sure if that is the cause. > > > > > >> I am moving over from Prototype/Scriptaculous and had this all > > > > >> working > > > > >> without a problem using those libraries. > > > > > >> I have posted the code at:http://jsbin.com/atiza > > > > > >> Help!
[jQuery] Re: Event Firing Twice
ok, I stripped a bunch of stuff out and posted a simplified file. This should make it easier to see what is going on. The event is still firing twice. http://www.iaffectproperties.com/code/SearchForm_simple.htm On Nov 6, 11:21 am, MorningZ <[EMAIL PROTECTED]> wrote: > I took a look at the source code in the first link but there's > too much to look at, can you be more specific about what 's, what > selectors, and what chunk of javascript code is not doing what you > expect it to? > > that would help others help you > > On Nov 6, 10:22 am, n8cshaw <[EMAIL PROTECTED]> wrote: > > > weird, works for me... I posted it > > athttp://www.iaffectproperties.com/code/SearchForm.htm > > also. > > > All of the images, css and local JS are pointing to localhost and > > don't work obviously (JQuery and JQuery UI are being loaded from > > Google)... as a side-effect of that, the event appears to no longer > > run twice. I guess that tells me that some other script I am using is > > interfering with the event and causing it to run twice? How can I > > debug which one and prevent this from happening? I thought JQuery was > > namespaced to prevent this? > > > On Nov 6, 9:40 am, Liam Potter <[EMAIL PROTECTED]> wrote: > > > > The link you provided doesn't seem to work. > > > > n8cshaw wrote: > > > > One more interesting note... if the parent div is visible (display: > > > > block) when the page loads, I do not see this behavior. It is only > > > > when the parent div is not visible (display: none) on page load that > > > > it happens. > > > > > On Nov 6, 9:07 am, n8cshaw <[EMAIL PROTECTED]> wrote: > > > > >> I am attaching an event to a link. The link lets the user toggle the > > > >> display of a child div inside of a parent div. However, when the link > > > >> is clicked, the event is run twice (div opens and then closes > > > >> immediately). > > > > >> I have tried using .click() and .bind() and it makes no difference > > > >> which one I use. I have also tried using an anonymous function versus > > > >> a callback function and there is no difference. I tried using return > > > >> false and e.stopPropagation() and there is no difference. I have > > > >> triple-checked that I am not binding the event more than once in my > > > >> code. The only way I can get it to not fire twice is to put the call > > > >> in the link's onclick attribute. > > > > >> I have seen several similar posts on this in the group, but I have not > > > >> seen a reason why this happens or a fool-proof way to stop it from > > > >> happening. The only thing I can think of is that one of the other JS > > > >> libraries I am using on the page, like Matt Kruse's DynamicOptionList, > > > >> etc... are interfering with the event propagation, but I don't know > > > >> for sure if that is the cause. > > > > >> I am moving over from Prototype/Scriptaculous and had this all working > > > >> without a problem using those libraries. > > > > >> I have posted the code at:http://jsbin.com/atiza > > > > >> Help!
[jQuery] Re: Event Firing Twice
weird, works for me... I posted it at http://www.iaffectproperties.com/code/SearchForm.htm also. All of the images, css and local JS are pointing to localhost and don't work obviously (JQuery and JQuery UI are being loaded from Google)... as a side-effect of that, the event appears to no longer run twice. I guess that tells me that some other script I am using is interfering with the event and causing it to run twice? How can I debug which one and prevent this from happening? I thought JQuery was namespaced to prevent this? On Nov 6, 9:40 am, Liam Potter <[EMAIL PROTECTED]> wrote: > The link you provided doesn't seem to work. > > n8cshaw wrote: > > One more interesting note... if the parent div is visible (display: > > block) when the page loads, I do not see this behavior. It is only > > when the parent div is not visible (display: none) on page load that > > it happens. > > > On Nov 6, 9:07 am, n8cshaw <[EMAIL PROTECTED]> wrote: > > >> I am attaching an event to a link. The link lets the user toggle the > >> display of a child div inside of a parent div. However, when the link > >> is clicked, the event is run twice (div opens and then closes > >> immediately). > > >> I have tried using .click() and .bind() and it makes no difference > >> which one I use. I have also tried using an anonymous function versus > >> a callback function and there is no difference. I tried using return > >> false and e.stopPropagation() and there is no difference. I have > >> triple-checked that I am not binding the event more than once in my > >> code. The only way I can get it to not fire twice is to put the call > >> in the link's onclick attribute. > > >> I have seen several similar posts on this in the group, but I have not > >> seen a reason why this happens or a fool-proof way to stop it from > >> happening. The only thing I can think of is that one of the other JS > >> libraries I am using on the page, like Matt Kruse's DynamicOptionList, > >> etc... are interfering with the event propagation, but I don't know > >> for sure if that is the cause. > > >> I am moving over from Prototype/Scriptaculous and had this all working > >> without a problem using those libraries. > > >> I have posted the code at:http://jsbin.com/atiza > > >> Help!
[jQuery] Re: Event Firing Twice
One more interesting note... if the parent div is visible (display: block) when the page loads, I do not see this behavior. It is only when the parent div is not visible (display: none) on page load that it happens. On Nov 6, 9:07 am, n8cshaw <[EMAIL PROTECTED]> wrote: > I am attaching an event to a link. The link lets the user toggle the > display of a child div inside of a parent div. However, when the link > is clicked, the event is run twice (div opens and then closes > immediately). > > I have tried using .click() and .bind() and it makes no difference > which one I use. I have also tried using an anonymous function versus > a callback function and there is no difference. I tried using return > false and e.stopPropagation() and there is no difference. I have > triple-checked that I am not binding the event more than once in my > code. The only way I can get it to not fire twice is to put the call > in the link's onclick attribute. > > I have seen several similar posts on this in the group, but I have not > seen a reason why this happens or a fool-proof way to stop it from > happening. The only thing I can think of is that one of the other JS > libraries I am using on the page, like Matt Kruse's DynamicOptionList, > etc... are interfering with the event propagation, but I don't know > for sure if that is the cause. > > I am moving over from Prototype/Scriptaculous and had this all working > without a problem using those libraries. > > I have posted the code at:http://jsbin.com/atiza > > Help!
[jQuery] Event Firing Twice
I am attaching an event to a link. The link lets the user toggle the display of a child div inside of a parent div. However, when the link is clicked, the event is run twice (div opens and then closes immediately). I have tried using .click() and .bind() and it makes no difference which one I use. I have also tried using an anonymous function versus a callback function and there is no difference. I tried using return false and e.stopPropagation() and there is no difference. I have triple-checked that I am not binding the event more than once in my code. The only way I can get it to not fire twice is to put the call in the link's onclick attribute. I have seen several similar posts on this in the group, but I have not seen a reason why this happens or a fool-proof way to stop it from happening. The only thing I can think of is that one of the other JS libraries I am using on the page, like Matt Kruse's DynamicOptionList, etc... are interfering with the event propagation, but I don't know for sure if that is the cause. I am moving over from Prototype/Scriptaculous and had this all working without a problem using those libraries. I have posted the code at: http://jsbin.com/atiza Help!
[jQuery] Re: Toggle and Nested Divs
Well, no one followed up and I kept experimenting and found that if I
put the event call in the onclick attribute of the link, it works as
expected. If I try to bind the onclick event on document ready, it
does not work.
Works: onclick="showHideExactDates();"
Does not Work:
jq("#dateExactShowHideLink_image").click(showHideExactDates);
The latter method makes the div open and close immediately when
toggled. I believe there must be some conflict going on between JQuery
and some other library being used on the page, but I don't know that
for certain...
I would still love to know why this is happening if anyone has any
ideas or suggestions.
On Nov 5, 8:40 am, n8cshaw <[EMAIL PROTECTED]> wrote:
> Thanks Ricardo. I have put the code up athttp://jsbin.com/atiza
>
> As for the double quotes on the Velocity call, those are evaluated on
> the server prior to being sent to the client, so no worries there.
>
> I appreciate the help with this! It seems like this should be a very
> easy thing to do (I did the exact same thing with Prototype/
> Scriptaculous on another site). I am not sure what I am missing.
>
> On Nov 5, 7:27 am, ricardobeat <[EMAIL PROTECTED]> wrote:
>
> > Try providing a test page or pasting your code
> > atwww.pastie.orgorwww.jsbin.com, that way people can actually read it! :)
>
> > Can't figure out from this code what might be wrong, it's probably an
> > event bubbling issue.
>
> > And you have src="$content.getURI("images/icon_plus.gif")" that will
> > cause serious parsing errors on the browser, use single quotes inside.
>
> > - ricardo
>
> > On Nov 4, 7:43 pm, "[EMAIL PROTECTED]" <[EMAIL PROTECTED]> wrote:
>
> > > Hi all.
>
> > > I have an outer div that contains several child divs (event search
> > > form that lets the user pick dates, categories, etc...). The user can
> > > toggle the outer div and the child divs as well. This all works for me
> > > AS LONG AS the outer div is visible and not able to be toggled. When I
> > > let the user toggle the outer div, when the outer div is toggled to
> > > visible and the user tries to toggle a child div, the child div opens
> > > and then closes again right away.
>
> > > I believe this is happening because the child div is somehow
> > > inheriting the parent's visibility. I debugged it and
> > > showHideExactDates() is being run twice. So, it seems like it is
> > > starting out as visible, even though it is not visible on the form.
>
> > > Here is a snippet of the code:
>
> > > > > src="$content.getURI("images/icon_plus.gif")"
> > > name="searchFormShowHideIcon" id="searchFormShowHideIcon" border="0"
> > > align="left" alt="+" /> > > id="searchFormShowHideLink_text">Search Form
>
> > >
> > >> > title="show/hide exact date form fields"> > > src="$content.getURI("images/icon_plus.gif")"
> > > name="dateExactShowHideIcon" id="dateExactShowHideIcon" border="0"
> > > align="left" alt="+" /> > > id="dateExactShowHideLink_text">Specify Exact Dates
> > >
> > > Occurs between > > name="dateRangeStartMonth" id="dateRangeStartMonth" title="date range
> > > start month" value="$!dateRangeStartMonth" maxlength="2">/
> > > > > id="dateRangeStartDay" title="date range start day" value="$!
> > > dateRangeStartDay" maxlength="2">/
> > > > > id="dateRangeStartYear" title="date range start year" value="$!
> > > dateRangeStartYear" maxlength="4"> > > id="dateRangeStartCalendarLink" title="event range start calendar date
> > > picker"> > > alt="Choose range start date" border="0" align="absmiddle">
> > > and > > id="dateRangeEndMonth" title="date range end month" value="$!
> > > dateRangeEndMonth" maxlength="2">/
> > > > > id="dateRangeEndDay" title="date range end day" value="$!
> > > dateRangeEndDay" maxlength="2">/
> > > > > id="dateRangeEndYear" title="date range end year" value="$!
> > > dateR
[jQuery] Re: Toggle and Nested Divs
Thanks Ricardo. I have put the code up at http://jsbin.com/atiza
As for the double quotes on the Velocity call, those are evaluated on
the server prior to being sent to the client, so no worries there.
I appreciate the help with this! It seems like this should be a very
easy thing to do (I did the exact same thing with Prototype/
Scriptaculous on another site). I am not sure what I am missing.
On Nov 5, 7:27 am, ricardobeat <[EMAIL PROTECTED]> wrote:
> Try providing a test page or pasting your code
> atwww.pastie.orgorwww.jsbin.com, that way people can actually read it! :)
>
> Can't figure out from this code what might be wrong, it's probably an
> event bubbling issue.
>
> And you have src="$content.getURI("images/icon_plus.gif")" that will
> cause serious parsing errors on the browser, use single quotes inside.
>
> - ricardo
>
> On Nov 4, 7:43 pm, "[EMAIL PROTECTED]" <[EMAIL PROTECTED]> wrote:
>
> > Hi all.
>
> > I have an outer div that contains several child divs (event search
> > form that lets the user pick dates, categories, etc...). The user can
> > toggle the outer div and the child divs as well. This all works for me
> > AS LONG AS the outer div is visible and not able to be toggled. When I
> > let the user toggle the outer div, when the outer div is toggled to
> > visible and the user tries to toggle a child div, the child div opens
> > and then closes again right away.
>
> > I believe this is happening because the child div is somehow
> > inheriting the parent's visibility. I debugged it and
> > showHideExactDates() is being run twice. So, it seems like it is
> > starting out as visible, even though it is not visible on the form.
>
> > Here is a snippet of the code:
>
> > > src="$content.getURI("images/icon_plus.gif")"
> > name="searchFormShowHideIcon" id="searchFormShowHideIcon" border="0"
> > align="left" alt="+" /> > id="searchFormShowHideLink_text">Search Form
>
> >
> >> title="show/hide exact date form fields"> > src="$content.getURI("images/icon_plus.gif")"
> > name="dateExactShowHideIcon" id="dateExactShowHideIcon" border="0"
> > align="left" alt="+" /> > id="dateExactShowHideLink_text">Specify Exact Dates
> >
> > Occurs between > name="dateRangeStartMonth" id="dateRangeStartMonth" title="date range
> > start month" value="$!dateRangeStartMonth" maxlength="2">/
> > > id="dateRangeStartDay" title="date range start day" value="$!
> > dateRangeStartDay" maxlength="2">/
> > > id="dateRangeStartYear" title="date range start year" value="$!
> > dateRangeStartYear" maxlength="4"> > id="dateRangeStartCalendarLink" title="event range start calendar date
> > picker"> > alt="Choose range start date" border="0" align="absmiddle">
> > and > id="dateRangeEndMonth" title="date range end month" value="$!
> > dateRangeEndMonth" maxlength="2">/
> > > id="dateRangeEndDay" title="date range end day" value="$!
> > dateRangeEndDay" maxlength="2">/
> > > id="dateRangeEndYear" title="date range end year" value="$!
> > dateRangeEndYear" maxlength="4"> > id="dateRangeEndCalendarLink" title="event range end calendar date
> > picker"> > alt="Choose range end date" border="0" align="absmiddle">
> >
> >
>
> > function showHideSearchForm() {
> > jq("#eventSearchFormDiv").toggle("blind", {}, 1000);
> > }
>
> > //add the form submit handler
> > jq(document).ready(function() {
> > jq("#searchFormShowHideLink_image").click(showHideSearchForm);
> > jq("#searchFormShowHideLink_text").click(showHideSearchForm);
> > });
>
> > function showHideExactDates() {
> > alert("running showHideExactDates()");
> > jq("#dateExactDiv").toggle("blind", {}, 1000);
> > }
>
> > //add the form submit handler
> > jq(document).ready(function() {
> > jq("#dateExactShowHideLink_image").click(showHideExactDates);
> > jq("#dateExactShowHideLink_text").click(showHideExactDates);
> > jq("#dateRangeStartCalendarLink").datepicker();
> > jq("#dateRangeEndCalendarLink").datepicker();
> > });
>
> > Help please! I have been banging my head on this now for several
> > hours!
>
> > Thanks.
