Develop Reference

Override a stock BootStrap javascript function

I'm generating a bootstrap modal using the following plugin which loads a form into a modal dynamically.
https://nakupanda.github.io/bootstrap3-dialog/
BootstrapDialog.show({
message: $('<div></div>').load('remote.html')
});
This page then loads another modal which is google reCaptcha control. This control has a button which becomes unresponsive.
I've figured that I need to override a function that natively comes in bootstrap as mentioned in this link Problems with new Google reCAPTCHA in IE when inside modal or dialog
This single line of code should do the overriding.
$.fn.modal.Constructor.prototype.enforceFocus = function () { };
It shouldn't be that difficult but I have spent almost 2 hours trying to figure out why my function isn't overriding the original BS function?
Also, if I put the above line of code in bootstrap.js file, then the override works. Anywhere else, it doesn't.
The code works in Firefox and Chrome, but fails in IE which is out of context but the fix is for IE.
Any help is much appreciated.

WordPress jQuery.load() pagination link gives 404

I'm trying to build a jQuery-based next/previous navigation but ran into a roadblock of a weird error. Here's a very much simplified version of what I'm trying to do:
$('.next').click(function(ev) {
ev.preventDefault();
$('main').fadeOut();
$('main').load('/page/2/ main .content', function() {
$('main').fadeIn();
});
});
The next page link is usually generated dynamically of course.
Clicking on the link gives a 404 error in the Chrome developer tools and the content never loads into the main tag. Changing it to a rewrite-less /?paged=2 also 404's. When inserting a link to a page however (like /contact/) works without without a problem. Directly entering the link works as well, so rewriting is working correctly.
This is driving me nuts. Anyone has an idea how to make this work?

JQuery Mobile - how to use it for ONLY swipe

I am having huge problems with the jquery mobile pack, it broke my entire page by making links go to ajax and showing the loading div etc. I tried fixing them all and I somehow managed it with tons of excess code (I don't know what part exactly hid the loading part and which part undid the ajax).
Basically JQuery mobile made a mess of my page, and all I need is the swipe event, I found the github repository of jquery mobile (Here), but I honestly have no idea which parts to take so I can use the swipe event.
I know people want code, but there is no problem in my code here, JQuery mobile simply wants to open all links in ajax, and because I am using bootstrap and I don't use JQuery mobile for anything else but swipes, I won't be pasting anything.
If anyone can tell me which parts I need to take/modify to make it work that would be awesome.
I tried by only copying the events/touch.js but it didn't work.

If you want to navigate page without using ajax then you should add tag rel=external
Or data-ajax="false"
you can find more information for Jquery mobile HERE
EDITED
I have Another solution but I pesonally not prefer but I also having same issue before so I tried this solution
$(document).ready(function(){
$("a").click(function (){
window.top.location = $(this).attr("href");
return false;
});
});
Try this I hope its work for you too..
this function will force change document location when user click on any Hyperlink

Can anyone detect why my jQuery is firing on my homepage, but isn't firing on a different page within the same domain?

I have been having some issues getting jQuery to work on some parts of my website. To test if the jQuery would fire I prepared a bit of jQuery that launches everytime my header file is included.
When I am at the home page the jQuery fires properly and the pop-up comes up. As soon as I move to a different section of the site. The same jQuery code included in the header isn't firing. I have checked the console for errors or faults and couldn't find anything.
A test location of the website would be at this location
That is the homepage of the site, if you visit it a pop-up will appear. If you browse to this link the jQuery doesn't fire even though it's still there in the code.
The jQuery code I'm trying to launch is as follows
<script type="text/javascript">
$(function(){
$('#overlay').fadeIn(200,function(){
$('#box2').fadeIn(400)
});
return false;
});
</script>
I'm not very experienced in debugging jQuery and have tried consulting some other questions and forums thought these solutions or attempts didn't seem to work for me. I was hoping I could get a hint in the right direction here.

Your code
$(document).ready(function() {
$('#slider2').s3Slider({
timeOut: 4000
});
});
appears to be raising an error which causes the javascript processing to stop. The element '#slider2' element does not exist on this page. Either remove this code or add a guard condition such as,
$(document).ready(function() {
if ($('#slider2').length) {
$('#slider2').s3Slider({
timeOut: 4000
});
}
});

FancyBox Jquery Null Error - Strange issue

I am experiencing a very strange issue i am hoping someone can answer (its kind of broad, but i will explain it my best), code works on local page when opened, but as soon as the same page is uploaded it throws an error. Two others have also looked at this, resulting in more confusion.
I downloaded FancyBox to use the inline feature to pop up a user form via href link, instead of taking the user to an additional page.
You can see the "stock" fancy box here:
1 fancyapps.com/fancybox/demo
Under various options, Inline is what i am using.
I didnt need all of the other features that came with FancyBox so i stripped the page to the following, which works just fine:
2 *Fancy Box Demo Stripped to Inline Feature only*
So then, i applied this code to our sandbox copy of the page to implement:
3 *Sandbox Copy with Fancy Box inline feature added to "make offer" link*
It stops working! There are no conflicts with other javascript on the page, and the only difference is that it has a couple of color .css changes, all .fancybox was named to .ptroffer and that the css code is not inline on the page (which wouldn't cause this error anyway).
This same page, opened locally works beautifully - upload and it throws error.
SCRIPT5007: Unable to get value of the property 'ptroffer': object is null or undefined
<script type="text/javascript">
$(document).ready(function() {
$('.ptroffer').ptroffer();
});
</script>
Works fine with link #2, and with link #3 locally, but with #3 uploaded it throws error.
Please!

Something in your code somewhere is overriding $. If you change that "ready" handler to call
jQuery('.ptroffer').ptroffer();
you won't get that error. However, things may not work; I think that an older version of jQuery is being imported by something (1.3!), which is bad.
edit oh I see, something's pulling in Prototype. You've got a regular script soup going on there, and things are going to be unpredictable and bizarre until you get that straightened out. Probably somewhere in there something's calling jQuery.noConflict(), but that "ready" handler you're adding isn't written to expect that. Whatever code that's expecting jQuery 1.3 may be in for a surprise also.