For a f:link show action in my fluid list template i want to pass a javascript variable to the arguments, basically the uid (to pass that specific object to the showAction), but it doesn't work the way i intend to do it. Is there a workaround for this particular problem?
The naked template looks like this:
<f:for each="{termins}" as="termin">
<tr>
<td><f:link.action action="show" arguments="{termin : termin}"> {termin.mitarbeiter}</f:link.action></td>
<td><f:link.action action="show" arguments="{termin : termin}"> {termin.kunde}</f:link.action></td>
</tr>
</f:for>
</table>
You can't - and you also can't (read: never should) generate links to controller actions from JS since it needs to generate a security checksum. Modifying the URL you create will generate a security error. The checksum exists to prevent DDOS so it has good reason.
There are two options:
You can generate all links in advance
You can make a link-generating service that you call with XHR to generate the necessary links from JS.
Only the first one is appropriate to your use case. Especially so since you want to pass UID values which always refer to an object in the database - which means you can easily generate a list of links to all possible detail views, then read/pass that list of links from your JS to select the right one.
The JS is something working after the fluid template. The right order is, your fluid template is parsed into the HTML, and then the browser render the HTML/JS/CSS to you. So, you can not expect to use JS value in your fluid template.
There are 2 possibilities:
1) Instead of a link use a form and transmit it via POST. Set a form field dynamically with JavaScript. That way your variable isn't included in the (cHash-) checksum.
2) Create an AJAX action that accepts your variable as argument. Let it generate a valid link. Use POST to call it with your variable data. Show the link on your page with JavaScript.
Related
I have Post model for a blog app in Django. It has a field named body. In posts, I may use Latex so I need to use MathJax.js. In some posts, I add code snippet, so I use highlight.js. In some I use both, in some I use none of them.
I want to load the relevant javascript depending on the body field of the Post model (similar to THIS). How can I make the relevant .js file(s) to load automatically?
I know that I can add an indicator field like hasLatex (True, False) or hasCode (True, False). But I'm lazy, I want Post.body to be automatically scanned and only relevant js files loaded.
Set something in your context or use a template context processor. For example I load code that handles forms if there is a form key is my context. For something I want on almost every page I put a no_something in my context to disable it. This is done by putting a conditional around the tag in your base template. If the variable is not there or is false it won't show.
What I also do is put my static files in lists inside of my context. JavaScript is in context['js'] and css in context['css']. Those are looped through in my header. I can implement get_context_data in a base class, and all the views that extend from that will have the javascript and css files.
We're building an AngularJS application. I'm now building a public form that is customized depending on the URL it's loaded with.
For example
http://url.com.au/Registration.cshtml#?org=org1
will look slightly different than
http://url.com.au/Registration.cshtml#?org=org2
When the page loads I would like to load some info with GET http://url.com.au/api/Org/org1
and use the response to drive some UI elements.
At first the differences will be small (URL for logo, values from some checkboxes) but over time the form may be more and more dynamic.
What is the pattern I should follow to support:
simple differences,
further along the journey a more dynamic ui?
For a simple solution, I would hold the url change in a route parameter for that route. Then access it using $routeParams. That way you can change your base GET url easily.
For both simple and dynamic UIs I would try to keep use of ngInclude to a minimum (less files to load = better load times, also it creates a new scope which isn't always ideal).
For simple differences I would structure your html to be as accommodating to both layouts as possible. Think about using ng-show/hide to trigger DOM changes based of variables retrieved from the GET request. For assets like images the GET request could return the path to the image and you can then use ngSrc to include it.
Further along the journey, you may want to consider having nested routing. UI-Router is a very popular solution.
I am developing my first website. At this time i am generating a new html design that would be a ticket.
From my main page, i will load this html when the user clicks the "See ticket" button. This html has a table which is filled on document.ready with javascript. The data used is a JSON created in the main page.
I coded a working solution using localStorage. The problem is that the next step is to convert that HTML website to PDF and the software i am using does not work properly with localStorage, so i need to pass the JSON from main page to the ticket page. I can't neither use URL encoding cause string could be sometimes longer than 2000 characters and it is not productive.
So i thought that maybe i could do and $.get call from the ticket.html to index.html and get the needed JSON. Is this approach correct, or is there any better solution?
Regards
As suggested earlier comments, you need to use serverside code to accept post params and you need to do a ajax post to send the data. This is very good approach. I have one more idea for implementing this.
Let say you open ticket.html in a window.open. And have a JS function ( say GetValue) in index.html, that returns JSON . So you need to get JSON in ticket.html.
You need to define a JS function in ticket.html , using windown.opener.GetValue() , you can get JSON value.
Hope, i am in same direction, which you need. If not, please clarify.
Other way, would be use iFrame and use message communication to pass large data between them, you are interested in this, please read this - https://developer.mozilla.org/en-US/docs/Web/API/Window.postMessage
How could i pass some data to my window.open() ?
For example:
I am in site1.com and using
window.open("http://site2.com");
The questing is - how to crossbrowser pass some data via js to that site1.com
The easiest way to pass data between pages is to build a query string like this:
window.open("http://site2.com?parameter1=foo¶meter2=bar&etc=whatever");
When one page opens another the function window.opener() can return values to a particular function in the opening page. Look it up for details. I don't have a development box in front of me so its difficult to show good examples. I know I've done it this way in the past. Like a popup allowing choices to be made by user then close child form and pass choice back to parent form.
to initialize a javascript loaded grid, I need to pass a list of values from controller/gsp. Since the javascript is activated once the page is rendered/loaded, there may not be a direct way to do it. 2 possibilities
1. do an ajax call, and retrieve the list of values from the server
2. store the list in html as a hidden element, and read it from javascript.
option 2 seems better as it avoids few calls back to server. So, which control should I use for a list of values? Any jQuery code snippet to read it back into array/list.
thanks in advance.
It depends on the size of that data. It it's small enough, you could embed it in the page. For example, to populate a calendar with events, I used something like:
<div id="calendar" data-events="[/* event list */]"></div>(the data-events attribute contained a JavaScript array of event objects in JSON format)
However, if you're talking about a huge amount of data, loading it (possibly in chunks) asynchronously after the page load (or when the document is ready) could increase your app's performace and make it more interactive (i.e. I don't want to wait and load that data if the next thing I'm gonna do is navigate away)
Does that answer your question?
You can directly write JavaScript from the server side. I don't know about grails, but here's a very simple example in php:
<script type="text/javascript">
var someVar = "<?php echo $someServerVar;?>";
</script>
Sure, this example is very simple, but you get the idea. And most languages will have some sort of function that escapes JavaScript strings (basically turn " into \" and new lines into \n).
If you put a script like that at the top of your <head>, then those variables will be accessible from all other scripts on the page.