I am trying to use lightbox plus plugin for Wordpress which works fine for most of my site.
I have a php page which is used by a jQuery AJAX function to retrieve data in order to paginate a large result set back in wordpress. This page is not part of wordpress.
I have managed to get Wordpress functions to work fine in this php page by using:
define('WP_USE_THEMES', false);
require('/home/love/public_html/dev/wp-blog-header.php');
require('/home/love/public_html/dev/wp-load.php');
However, in this page is an include, and within the included file is a link to an external sheet which is meant to be brought in with a lighbox:
<a class="" rel="lightbox" href="<?php bloginfo('url'); ?>/more-product-info?a=<?php echo $post->ID ?>">
<div id="moreprodinfo">More Info</div>
</a>
This method of retrieving information in a lighbox works ok on most parts of my site, but its just not working on the part that uses AJAX to retrieve the link to the lighbox page.
I assumed it was something to do with plugins not working when the page is not part of Wordpress, but all the Wordpress function have been working so why not plugins? Also my cufon plugin doesnt work on this ajax retrieved page either.
Is it becuase I am using .html javascript function to display the content retrieved by AJAX:
if(pageType == 'prizeHome'){
loading_hide();
$("#tab-prize-home #container").html(msg);
Any help would be appreciated
It looks like a common issue when using ajax to load html content :
You probably call lightbox and cufon when document is ready, which happens only once before your ajax call. You have to call again lightbox and cufon after your ajax call.
Related
im using the laravel 5.1 and building web app
i just bought HTML theme and directly copy all the css and Js files to public/assets ( not using any task runner such as gulp or grunt). i try to customize the login and register view page and if i use the default routing its fail to load the js and CSS ( just load plain HTML ) but if i point it directly by
Route::get('login','AuthController#getLogin')
its working . how can i fix the JS and CSS problem ?
*all the other pages works right and load the CSS and JS *
here are the screen shots from other pages and login page :
here is from my login page that fail to load :
if i use route to directly link to the page not passing through the Auth controller and after submit send data to login function ( like simple normal forms) its working but if goes through the controller system its fail . also if i use :
Route:resource('contact','contactcontroller')
my contact pages such as index, create , etc all are fail to load CSS but if i directly link to them like:
Route:get('contact','contactController#index')
it will successfully load the CSS and my page will be shows fine .
this question may help you with that !
Laravel stylesheets and javascript don't load for non-base routes
BTW : look at your page with firefox(chrome) Inspect Element Or Firebug to see the http requests!
Try using this way script and style link
{!! HTML::script('js/bootstrap.min.js') !!}
{!! HTML::style('css/bootstrap.min.css') !!}
<link href="{{URL::asset('../assets/css/bootstrap.css')}}" rel="stylesheet">
<script src="{{URL::asset('../assets/js/jquery.js')}}"></script>
I use these methods works 10/10.
I tried triggering a link via .trigger() function but is not working
<a data-role="button" id="redirectprofile_btn" href="profile.html" rel="external" style="display:block;">Profile</a>
Once i click the link manually, it will display the profile page (profile.html, with its own css and js) but if i use
$("#redirectprofile_btn").click() or $("#redirectprofile_btn").trigger('click'),
it wont redirect.
Im new to jquerymobile, any help would really be great.
Thanks
Use event.prevent default() followed by event.stopImmediatePropogation then changePage to the links href attr value.
So I am new to jQuery and I'm trying to set up an html page that has tabs. Each tab should show a different html page as follows:
<div id="tabs">
<div class="tabdiv tabActive">Page1</div>
<div class="tabdiv">Page2</div>
<div class="tabdiv">Page3</div>
<div class="tabdiv">Page4</div>
</div>
<div class="tabscontent" id="ajax-content">
Default text
</div>
So what I want is that when I click on page 1, page1.html will be loaded up in div.tabscontent. This is the jQuery code that I have.
$(document).ready(function() {
$("div#tabs a").click(function() {
alert(this.href);
$("#ajax-content").empty().append("Loading");
$("div#tabs div.tabdiv").removeClass('tabActive');
$(this).children('div.tabdiv').addClass('tabActive');
$.ajax({
url: this.href,
success: function(html) {
$("#ajax-content").empty().append(html);
alert("Success!");},
error: function() {
$("#ajax-content").empty().append("Didn't work");}
});
return false;
});
});
Note: 1) I have the latest jquery attached 2) I the page1.html, page2.html, etc are in the same folder as the above html file. 3) I am working locally and have tried google-chrome, firefox, and opera and they all had tabs that showed "Didn't work". Even when I reference http://www.facebook.com in the url it doesn't work. Please help me.
I put the alert in there to see if the href works and it does work. For example for page1 tab it returns `file:///u/b/user/Desktop/ajaxdemo/Page1.html'
In your case, it does not work because you're trying to access a file from user computer. It poses security risks because if javascript is able to access local files, javascript is able to steal files from client machine.
Even when I reference http://www.facebook.com in the url it doesn't
work
The reason for this is: AJAX requests are subject to the same-origin policy. Facebook is on another domain, that's why it does not work.
One more thing to keep in mind, some browsers think absolute URLs are cross-domain requests even if it's in the same domain, only relative Urls work, so avoid using absolute Urls.
To fix your issues, try deploying on a server and use relative URLs instead of absolute URLs.
This is a simple php file that displays a Like and Tweet button.
<? $url = "http://example.com"; $title = "Title";?>
<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=247886858583094&xfbml=1"></script><fb:like href="<?=$url?>" send="false" layout="button_count" width="80" show_faces="true" font=""></fb:like>
Tweet<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
My problem is basically that I want to get this file to display in my page via Ajax and it doesn't. It works as a standalone page, just doens't load through ajax.
Why doesn't it work and what can I do to make it work?
Facebook :
http://forum.developers.facebook.net/viewtopic.php?id=68635
Twitter :
http://www.ovaistariq.net/447/how-to-dynamically-create-twitters-tweet-button-and-facebooks-like-button/
I have a problem withjdoc include head. On any other page than Home, the <jdoc:include type="head" /> result is not complete, it does not include jQuery library etc. but only the title and favicon. Any idea how could I keep the JS libraries and all from jdoc head on all pages, not just the homepage ? I don't know why they get loaded on home but not on login for example, or search...
Thanks.
By default header in Joomla doesn't contain jQuery... It loads Mootools.
If you need to load jQuery you have to use a plugin like this one.