in a silverstripe project I´m loading whole pages via ajax. Therefore I added to the Page-Contoller following function:
public function ajax(){
return $this->renderWith('MyTemplate');
}
This works fine so far and I get the page rendered as I want when browsing to mysite.com/mypage/ajax. The only Problem are the included JS/CSS Files in the template "MyTemplate":
<% require javascript(my.js) %>
<% require css(my.css) %>
The css/js does not show up in the source code - somehow it is not included, although it is part of the template "MyTemplate".
So is there a way to add the css/js in a cool way with silverstripe methods?
I tried this:
public function ajax(){
Requirements::css("my.js");
return $this->renderWith('ProjectPage');
}
but no success so far.
Many thanks,
Florian
You need to load the following javascript file into your site, depending on silverstripe version:
SS3 - /framework/javascript/jquery-ondemand/jquery.ondemand.js
OR
SS2.4 -/sapphire/javascript/core/jquery.ondemand.js
As far as I understand; when you make an ajax request, any new css or javascript requirements are added into the the request header. Then when the request is successful, ondemand.js pulls those scripts into the document for you, if they are not already there.
Related
My site is AJAX but it pulls content from .html files. Some of those files have been indexed without the #!, so they just function as a basic html site. I want to redirect users that land on the non ajax page to the #! version. I tried a redirect (without thinking about it) and it created an endless loop with the dynamic content.
If you look at the code, you will see that it uses js to place the static pages into a content wrapper.
I am equally having trouble with an seo issue, where google does not appear to be requesting the escaped_fragment version... that or I need some help. I thought that since it was pulling content from html files, I could just copy those pages and add name it _escaped_fragment_=page.html it is not working. I tried a redirect, but google fetch just showed the redirect request and not content.
It was a template that I purchased... I figured out how to modify the theme and content, but this is beyond me.
Closed
I decided to scrap the hashbang method. I have real pages, and I decided to let them be searched and indexed. I am waiting on a solution to pull only the body into the ajax content warapper; however, I was able to apply basic CSS to the pages without messing anything up when loaded into the main page via ajax.
I used
$("a").attr("href", function(i, href) (some js stuff to add a hash-- hostname +# href)
to add a hash to the clean urls that were internal from the main menu. This created a loop if added to the pages, so I used a clean url with an onclick redirect to the ajax version. "/" before the link.
onclick="window.location = '/#link.html';return false;"
I had a JS redirect that detected if there was a hash before the page link, and if not, added it; however, google did not like it! Sure the pages are not as nice. That said, I have content for non JS enabled browsers. As soon as I get the main.js modified so that it ignores head elements, I can dress them up even more. Each page has links that will get a user to the ajax version, including the home button "/#".
Here's my issue, I'm trying to load a FB comments module via an AJAX div. Now, it works if I go directly to the php page, but if I load it from within the div, it doesn't. I've looked at the other posts (FB javascript SDK after jquery LOAD (ajax)), but still can't seem to get it to work, looking for clarification.
If you want to see what I'm talking about, check http://azconceptphoto.com/lindsey and check out testimonials.
Ideally, on the normal part of my site, I can just load the HTML5 code and it works fine, though for some reason it doesn't remotely work via the AJAX div. And considering the posts from before are out of date (2011), I was hoping to get more feedback on this.
Based on the code from your link you are not using any of the PrototypeJS Ajax methods to get the backend script. Ajax.Updater is the method you need to use so....
Here is my suggestion
change the definition of loadXMLDoc() to
function loadXMLDoc(div, location)
{
new Ajax.Updater(div,location,{'evalScripts':true});
}
this will update the contents of div with the contents of location. Also if the response has <script> tags in it then the javascript will be parsed and evaluated (thats the option evalScripts)
I'm trying to make an ajax enabled webapp using the tag. For some reason,
it redirects the entire page to my template, and doesn't update the specified div.
Here is what I have so far:
In the head of my GSP file:
<g:javascript library="jquery" />
<g:setProvider library="jquery"/>
In the body of my GSP file:
<div id="message"></div>
<g:remoteLink controller ="reqOff" action="quick_req" update="[success: 'message']">ar</g:remoteLink>
My controller method returns a template; which seems to be working fine.
The problem:
Right now, rather than update the div, it renders my template on a new page.
Other Notes:
- My grails version is 1.4.0.M1
- My jquery plugin is installed and updated to 1.7.2
- I have no other conflicting JS libraries in my view
I fixed the problem with JQuery and incidentally it was related to the CSS problem mentioned in the comments. As it turns out Gregg was on to something when he pointed out that the jQuery may not be loading in.
What I did is upgrade my resources plugin, and since it brokeing my app, forced me to learn what the resources plugin actually does. After setting up my modules and getting the r:require and r:layoutResources tag in, everything loads in just fine. It took a little trial and error, and I followed a tutorial type blog post from the plugin's author: http://www.anyware.co.uk/2005/2011/09/12/optimising-your-application-with-grails-resources-plugin/
In conclusion, check to make sure your resources are loading correctly with the resources plugin. I was under the assumption that the g:javascript tag loaded jQuery, but for my app, this apparently was not the case.
I'm trying to use a JUMI file (a component for Joomla that allows me to get aceess to Joomla MVC) in AJAX callback. The structure is like this:
file.php that calls AJAX file is already a JUMI file.
file ajax.js (included in file.php) makes the call.
file.tooltip.php is a JUMI file which output is shown on file.php. It needs to be a JUMI because I need to access Joomla libraries to get the data it processess.
To prevent the problem that JUMI outputs a file with all the template I'm using in the Joomla call method in the end of the url in ajax.js: &tmpl=component. It works, but however it brings together all other calls for javascripts and so on contained in the template, which is bringing me to conflicts. The page is very slow and other javascript components are not working.
Does anyone know how is the best way to approuch the situation and get to a solution?
Thanks a lot!
You need to use &format=raw at the end of the url to the file you're ajax'ing to. Chances are though, that you get a server error because that "view is not supported". Easy fix, go to your site
root/components/com_jumi/views/application/
then make a copy of view.html.php called view.raw.php.
This component REALLY needs to be updated.
So you have a file, file.php, that has something like this in it?
<script type="text/javascript">
$(document).load( function() {
$('#this_id').click(function() {
$('#that_id').hide();
});
});
</script>
<div id="this_id">click me</div>
<div id="that_id">hello and goodbye!</div>
And then you want to access a file called "file.tooltip.php" that is also a Jumi file?
I don't know why that would need to be a Jumi file, it could be a simple php file that gets called in your javascript. To access the underlying Joomla libraries, you would simply invoke the appropriate library in the PHP file.
I hope this helps...
Bud
I'm working on converting NerdDinner to Spark and have everything except the mobile views (which I'm not worrying about) and some code that uses Page. Here is one of the locations that is hanging up - but there are a couple of others due to the View not having a Page ...
In asp.net mvc the code looks like this:
<link rel="Stylesheet" type="text/css" href="<%=Page.ClientScript.GetWebResourceUrl(typeof(DotNetOpenAuth.OpenId.RelyingParty.OpenIdSelector), "DotNetOpenAuth.OpenId.RelyingParty.OpenIdSelector.css")%>" />
The "Page.ClientScript.GetWebResourceUrl" call fails with an error about there not being a Page. Is this true?
I've worked around this one with adding an action that will return the resource as a FileStreamResult ... but there is another call using an open auth library that has a constraint check for a Page object ... so it fails due to the same problem - and unless I hack that code, I can't seem to find away around it. Is there anyway to get a Page in a Spark View?
In my project that uses Spark I am retrieving resources by use of a handler.
In reference to the other call, no there is no Page. A Page object is actually just a special HttpHandler that renders the markup to the response. So since MVC uses a different handler to create the Controller and render the View, there is no Page handler.
I would think the Open Auth library needs to be updated to work better with MVC.