Develop Reference

Passing Javascript Object Array to MVC Controller w/ POST

So I have an array of javascript objects that is constructed using JQuery across multiple table rows. It has the following form:
obj_rows = [
{"param1":value11, "param2":value12, "param3":value3},
{"param1":value21, "param2":value22, "param3":value23},
//more objects with the same parameters
]
What I would like is a way for an AJAX POST request to a Controller method SomeController/SomeAction that takes in this array and can iterate over all objects. I was trying to figure out a way to do this using JSON, but to no success.
NOTE: Even though I am using MVC, I do not have a model class corresponding to these objects. Ideally, I would like to end up with some structure like a List of 3 Tuples.

actually the solution is to take the object and stringify it into a string and then send it over the ajax request.
just do:
JSON.stringify(obj_rows)
and you will get on the other endpoint an array (stringified of course), you have to parse it back and you will have your array.

You can use javascript method JSON.stringify() to convert you object into a string and assign its result to a hidden field in your view and once you recieve this in your controller you can then deserialize it to an object or parse it yourself.

How to autorender a JSON array using pure.js?

I am trying to use the pure.js templating engine to convert a JSON array into HTML code.
I understand how to use autoRender() to map an associative map to HTML: http://jsfiddle.net/P7H98/
but if I replace the associative map with an array, I end up with iteration that inserts empty rows: http://jsfiddle.net/P7H98/1/
Is it possible to autoRender() an array and end up with the same output as the first example?
UPDATE: Nesting <div class="toString"></div> inside the <li> node fixes the problem. But I'm still not sure why. Surely there is a more readable solution to this problem?

The toString is a coincidence.
The property names triggers a loop, because it points to an array.
Then the toString is a method that exists for each array element, and is called.
If you add the class toString on the LI, it will work.
You should try using render and directives.
They can be generated on the fly, and give you a more precise control of what needs to be done.

Using jQuery's data() with Mustache.js templates

I am building a web-application where I want to display a complex model (named Answer). I am using a Mustache template to format the data, but now I have the problem that I cannot attach any complex data to the resulting html, which is normally possible using jQuery's .data() method.
My current (incorrect) implementation should demonstrate what I am trying to accomplish:
// (part of) the template
{{#answers}}
<input type="checkbox" data-answer="{{.}}">{{text}}
{{/answers}}
// js on the page
$(document).on('change', 'input[type="checkbox"]', function (event) {
console.log($(this).data('answer'));
})
Now I was hoping for a reference to the original Answer-object in the console, instead I got the rather useless string "[object Object]". Is there some way for me to retrieve the original object when the user checks the checkbox?
Edit: See also http://jsfiddle.net/sebastianv89/jQBpN/

I think the problem may be that HTML data- attributes are used to store textual data, not actual Javascript objects, so using a Mustache template to attempt to set data-answer will only result in the text representation of your answer objects being stored
Another approach you could try is to cache your answer objects in a map (as a JS object) and use your data-answer attribute to store keys into that map.

LINQ-For-Javascript Nested Arrays

The Linq-For-Javascript library contains functions that convert between "jQuery objects" and "Enumerable objects": toEnumerable() and TojQuery(). Consider the difference between these two lines:
$('tr'); // returns array of tr
$('tr').toEnumerable().TojQuery(); // returns array of tr[1]
Converting from jQuery to Enumerable and back to jQuery does not give you what you started with. The end result is an array of arrays of elements, with each sub-array having a length of 1. I do need to make use of Enumerable, so this is just a convenient example of my problem.
This means that to get the id of an element, you'd need to do the following:
$('tr')[0].id; // returns "myID"
$('tr').toEnumerable().TojQuery()[0][0].id; // returns "myID"
I'm surprised of this, because even though I've allegedly gone back TojQuery(), the object returned by TojQuery() does not work with typical jQuery calls:
$('tr').find('td').length; // returns 170 (in my case)
$('tr').toEnumerable().TojQuery().find('td').length; // returns 0 (BAD)
I would like it if both lines returned 170, but apparently Linq-For-Javascript doesn't work that way.
So, my questions:
Why is this?
Am I doing it wrong?
If not, any good workarounds? (convert array of 1-element arrays to array of elements?)
Thanks!

JQuery handles operations according to types. In the first line of the code, if finds all HTML TR objects and by the help of this information it can attach necessary functions to the found objects.
$('tr').find('td')
However, it could not understand after you change it to enumarable object since it is no longer seems to be a HTML Object instead it becomes any other type of object. Thus, jquery cannot attach a function to it.
$('tr').toEnumerable()

append object to innerHTML and get that object from innerHTML

here is an example in jsfiddle.
I want to know if I can append a javascript object to innerHTML, that get that object again from innerHTML as object.
something like,
alert((this.innerHTML).html);
that's just an example, don't ask me why do you need this?
I'm trying to edit an existing code, and I have to do this so.
I have to transfer an object via div.innerHTML.

Check this jsfiddle. In it, I add the object to the div as a 'data-'-attribute, using JSON to convert it to a string. After that, adding some comment to the div triggers the DOMSubtreeModified-handler, in which the 'html'-part of the object is retrieved and alerted. It that something to work with?

In this case, quite possible your only option is to convert your object to string and then put that into the element. (This is done by looping through the key, values building the string as you go.)
You would reverse the process to convert it back into an obj.
I know some javascript libary's have helper functions to make this process very simple.
You could try adding the data directly onto the dom element, rather than as its content..
tempDiv.objData = myObject;

It was suggested to use JSON, but no code. So:
function addObjAsJSON(el, obj) {
el.setAttribute('data-myJSON', encodeURIComponent(JSON.stringify(obj)));
}
function getObjAsJSON(el) {
return JSON.parse(decodeURIComponent(el.getAttribute('data-myJSON')));
}
That should allow you to add anything as a serialised object, then get it back. You should add some error checking to make it robust though (e.g. check that you get a string back from the call to getAttribute).
For user agents that don't have built-in JSON support, see json.org which has a link in the javascript section to json.js.