how does data-render attribute works in javascript - javascript

Can anyone explain the functionality of data-render="true" attribute works in javascript and how to use it in javascript?

I believe what that would be is a data attribute. I am not sure if this is the main use, but I know it makes sending data from html to javascript very easy. Data Attributes
I used it in a project when ids for a table were created at runtime, and depending on the row clicked on, grabbed the data attribute.
To go to your question, I believe that is what is happening with the data-render. It is just a "variable" to store a boolean in a sense.

In HTML5 specification, you are allowed to create attributes into your tags.
The specification recommends that you use some naming guidelines to create your own tags, thus as using something like "data-[some namespace to define your project]-[attribute_name]"
You can access those attributes in js, and load them with data when your server returns the page to the client. These type of attributes allow you to communicate data between server and client codes in a quite simple and clean way.

Related

How to modify HTML from another file with JavaScript/jQuery

I need a reference of a HTML element that has an id of #searchResults
$.get('search-for-prospect', function() {
_content.find('.prospect-container').sort(function(a,b){
...stuff...
}).appendTo('#searchResults');
})
I tried using jQuery's get to get the that element, but it doesn't work as expected.
I need to get a reference of searchResults and append to it. How can I achieve that?
The only way to get HTML from another page with javascript is by making AJAX call (in fact js template engines work this way).
So you have to $.ajax the page you want, parse it as HTML and do what you want to do.
Beware: you are not editing the HTML file itself, but just its "in memory copy".
Javascript, as far as it is used as client-side technology, does not allow modifying files or in general accessing the file system. So if you're looking for some trick to write in the HTML, you're on the wrong way

Best way to pass server (c# / Razor) values into an AngularJS app

We use DNN and often need to pass a few context specific values (like page id or module-on-page-id) into an AngularJS app. We've developed our own conventions how to do this, but would like to hear from others how they approach this to find a best practice.
So basically the situation is that the server-page has information needed by the JS. Using WebAPI is not an option, as these values are known in the page, but not in a separate request. Things I've seen so far have been:
Use in-view-razor like href="#Tab.TabId/{{...}}" (I don't like this)
Place the values in the ng-init like ng-init="config = { prop1: '#Tab.TabId' }"
Create a separate <script> tag where we generate a module on the fly containing these values so angular.module("config", []).constant('prop1', '#Tab.TabId')
Create a json with razor in the page somewhere and inject all of it as a module into the app using a generic code which does the same as #3, just with cleaner code re-use.
I've seen all these and have also used all. Currently we avoid #1 as we believe it's not good to mix templating languages and because it doesn't allow externalizing parts of the view. So basically we use #2 as for quick-and-simple (and a bit dirty) + #3/#4 for larger projects.
Do you have a better way, or which way would you prefer?
We are using variant #4.
This has the advantage that the JSON defines the exact interface for the config needed by the JS module. And Razor is great to generate URLs using #Url.Action.
we use NewtonSoft and do JSONConvert.SerializeObject(ObjectName) and then pass it over as a Session from the controller and then use #Html.Raw(ObjectName) and its a JSON Object that can be utilized easily in javascript...

Spring MVC - Is JSTL Tag JSON Conversion OK?

A psuedo controller method
#RequestMapping("/foo")
public String getFoo(Model model) {
model.add("foo", repo.findFoo());
model.add("bar", repo.findBar());
model.add("barOptions", repo.findBarOptions(bar));
return "fooView";
}
Let's say the client uses Expression language to render foo and bar; but we use JavaScript to render barOptions.
<html>
<script>
var options = <mytag:toJSON object="${barOptions}"/>;
$("#options").renderOptions( options );
</script>
<body>
<mytag:renderFoo foo="${foo}"/>
<mytag:renderBar foo="${bar}"/>
<ul id="options"></ul>
</body>
</html>
Common conventions tells me this is bad. But the essence of MVC, where the controller sends data and the view determines how to use it, tells me this is good. Is there a better way to do the same thing? Is there any reason why this isn't commonly done? I could request the JSON using a separate call, but then I have to make more requests for the page to load, and there may be logic to determine barOptions in the controller method getFoo() based on other input at the time of the page load.
At first glance I can not say that I see anything blatantly wrong with approach. The only aspect that initially took me off guard was your need to convert data in the model object to json.
For me, JSON usually implies that there is some sort of server side object that needs to be converted so that a client side javascript can access or manipulate its structure in a javascript way. I guess without knowing more of the purpose of the options list, I can't see a reason why json serialization is required here.
By using a Tag to convert a model object to JSON, we avoid an
additional request made by the client
But if we assume that JSON is a requirement (perhaps for some third party jquery plugin), then I absolutely do not see anything wrong with approach.
What is special or different about the barOptions unordered list, why does it have be rendered with json? Why not just use a for loop to build the list items? Or you can have a custom tag that builds out the ul entirely.
Aside from that, I missing the point as how one may perceive this as being bad code.
Normally JSON is requested by JavaScript with an Ajax call, but if in your case it's available at page rendering time, I see nothing wrong with your solution. It's clean, compact code and easy to read. Looks perfectly OK to me, the alternative would be to loop on the options array with a forEach, but this approach looks better.

Client side templating with unknown variables

Our company has an intranet consisting of several e-mail templates filled with variables (like [[NAME]], [[PROJECT]] and so on). I was thinking of implementing some sort of client side templating to make it easier to replace these variables with actual values.
The problem is that among all the client side template solutions I've located so far, all of them seem to assume that the JS code knows all the template variables that exist in the markup, and none of them seem to be able to fetch a list of variables defined in the markup.
Does anyone know of any solutions/plugin which makes this possible?
Thanks in advance!
Can't you just use some simple regex?
var variables = mycontent.match(/\[\[(.*?)\]\]/g);
I set up a demo here, so you can see it in action.
If set of templates are already cached on client and available to customer on demand and each template will have it own set of information to be replaced in (either hardcoded or define on runtime). Then we can go for some generic solution
Pseudo code
- Decide which Template now need to render
- Send a Ajax command of array of variables in to be replace in the template
[{var_name:"%project_name%",var_value:"Project" },{var_name:"%superviser%",var_value:"Its me :)" }]
- Write a generic code that loop through json array and replace the var_name with the template source
Check this - http://api.prototypejs.org/language/template/

How do I allow rails to have javascript: in the data

I have a database of ad html, and some of them contain Javascript functions. Is there a way to have rails allow javascript: tags for a particular attribute on a particular model?
To clarify further, I can bring the html up in an edit form, but when I try to submit, my browser (Firefox) says the connection is reset. IE gives me an error as well. The only thing that allows the html to be submitted is to remove the javascript: from the tag.
My guess is that this is a security measure by Rails to not allow javascript injection, however, I have no control over the html of these ads, and many have javascript in them.
If my guess is indeed correct, is there a way to override the security for this one attribute of this one model? Or am I way off target here?
I am using Rails 2.3.4 on Ruby 1.8.7
Now I've never used rails but the idea should be the same, you just want to store the javascript as a string, and then when you display it, do not escape the data. A better way to do this would be to link to your javascript and then just store calls to the functions in your database.
Without seeing any code, I'm guessing you are using sanitize. Instead of sanitizing, consider transmitting and storing your javascript escaped, then unescape it when you actually need to use it.

Categories

Resources