JavaScript kind of redefines what an Array means because an array is an object with a .length property and methods like .slice() and .join().
jQuery defines a jQuery object as "Array like", because it has a length property but it doesn't have certain array methods like join().
If I were to define the jQuery object as an object, and forget about mentioning anything to do with an array, how would I define it? What properties does it have besides length?
I guess all the methods are what you see in the documentation, far exceeding the number of methods that are in an array.
A jQuery object is array-like which means that it contains zero or more indexes (properties which names are positive integers starting with zero). Besides those indexes, a jQuery object contains these properties:
length
context
selector
And also around 140 inherited methods (which are defined on the jQuery.prototype object - you can do console.dir(jQuery.prototype) to get a full list... ).
Note that jQuery objects do not contain (or inherit) the Array methods (slice, substr, ...). If you want to execute those methods on your jQuery object, use call/apply.
For example, if you have 3 TEXTAREA elements on the page and you do this:
var j = $('textarea');
then this j jQuery object will contain these properties:
0 - reference to the first TEXTAREA element
1 - reference to the second TEXTAREA element
2 - reference to the third TEXTAREA element
length - which is 3
context - reference to the document object
selector - which is 'textarea'
plus all those inherited methods...
the jQuery object is an object which has
a length property
numeric properties which reference the items from the select (0,1,2,3...)
bindings to jQuery functions
additional jQuery properties
The length and numeric properties allow the object to respond like an array. You can run it in a for loop or use functions like map or each on it.
I would recommend using your browser's debugger or Firebug and inspect a jQuery object. That will teach you a lot about how it is structured.
Related
I comment, and looked here and I can not find the solution, my problem is the following:
in my html template in angular, I need to pass a series of data to the metadata property of a button, I can't get the correct way to successfully concatenate the variable that contains the value.
this should be the html element:
<mati-button clientId="clientId" flowId="flowId" color="green"metadata='{"user_id":"1234778","email":"som#som.com"}'/>
I tried several ways but I can't insert the respective values....
example:
<mati-button metadata='{"userID": "{{user.id}}" }'></mati-button>
unsuccessfully...
Assuming mati-button is an Angular component with metadata as Input(), you are probably looking for
<mati-button
[clientId]="clientId"
[flowId]="flowId"
[color]="green"
[metadata]="{ userId: '1234778', email: 'som#som.com'}"
></mati-button>
See the guide on property binding to learn more:
To bind to an element's property, enclose it in square brackets, [], which identifies the property as a target property. [...] The brackets, [], cause Angular to evaluate the right-hand side of the assignment as a dynamic expression. Without the brackets, Angular treats the right-hand side as a string literal and sets the property to that static value.
By "dynamic expression" they mean JS-expressions, i.e., a public variable available through the component's TypeScript, a boolean expression, an array, or, like in your case, a JS-object that you can construct inline.
You can try doing this
<mati-button metadata="{'userID': user.id }"></mati-button>
metadata='{" userID ": {{user.id}}}'
in the end I got it. Apparently I don't know why, but the third-party script hides that parameter and it couldn't be debugged in the console, but it does receive them without any problem! Thanks everyone for your help!
for an application I am building an administration panel where a power user should be able to check the JSON structure of a selected object.
I would like to display the JSON object in a computed text field but display/format it nicely so it is better human readable, something similar as in pretty print.
Is there any function I could use in SSJS that results in something similar so I can use display json nicely in computed text / editable fields?
Use stringify's third parameter "space":
JSON.stringify(yourObject, null, ' ');
space
A String or Number object that's used to insert white
space into the output JSON string for readability purposes. If this is
a Number, it indicates the number of space characters to use as white
space; this number is capped at 10 if it's larger than that. Values
less than 1 indicate that no space should be used. If this is a
String, the string (or the first 10 characters of the string, if it's
longer than that) is used as white space. If this parameter is not
provided (or is null), no white space is used.
As XPages doesn't support JSON.stringify yet you can include JSON's definition as SSJS resource and use it.
As Knut points out, you can certainly add json2.js to XPages; I've previously used an implementation as Marky Roden's post outlines. This is probably the "safest" way of doing so, from the SSJS side of things.
It does ignore the included fromJson and toJson SSJS methods provided out of the box in XPages. While imperfect, they are functional, especially with the inclusion of Tommy Valand's fix snippet. Be advised, using Tommy's fix does wrap responses to ensure a proper JS object can be parsed by shoving an Array into an object with a values property for the array; so no direct pulling of an Array only.
Additionally, I believe it would be useful to point out that a bean, providing a convenience method or two as wrappers to use either the com.ibm.commons.util.io.json methods to abstract the conversion method, or switching in something like Google GSON, might be more powerful and unified, based on your style of development.
Knut, Eric, I came so far myself already.
function prettyPrint(id) {
var ugly = dojo.byId(id).value;
var obj = $.parseJSON( "[" + ugly + "]" );
var pretty = JSON.stringify(obj, undefined, 4);
dojo.byId(id).innerHTML = pretty;
}
and I call it e.g.
var name = x$('#{id:input-currentObjectCollectionFiltered}').attr("name");
prettyPrint(name);
I tried to make use the x$ function but was not able to make the ID dynamic there e.g.
var ugly = x$('#{id:" + id + "}').val();
not sure why. would be nicer if I just would call prettyPrint('input-currentObjectCollectionFiltered'); and the function would figure it out.
Instead of dojo.byId(id).value I tried:
var ugly=$("#" + id).val();
but things returns and undefined object: I thought jquery would be smarter to work with dynamic id's.
anyway stringify works just fine.
How do I add a filter attribute to <iron-data-table? (Please post a plunk demo.)
I forked this plunk. Then I tried to add a filter by adding the following line:
<iron-data-table
...
filter="['item.user.name.first.length', '< 5']">
Which broke the plunk. Here is the new (now broken) plunk.
The documentation here describes the filter attribute as follows:
filter An array containing path/filter value pairs that are used to filter the items.
But it lacks an example of how to use it.
How do I add a filter attribute to <iron-data-table? (Please post a plunk demo.)
This isn't a very well documented feature:
Normally, you would go about using filter-by and filter-value properties in <data-table-column> elements, but you can also access the filter property directly.
When it comes to filtering items data source, there is only "contains" kind of filtering available. So, you pretty much can't do filtering based on string length like in your Plnkr with those. For more custom filtering functionality, you need to go using a function dataSource where you can do anything you want using the filters provided as arguments for the data source function.
Anyways, in case you want still to access filter directly and for example provide a default filtering value, you need to set the value to be an array of objects, which have a path and filter property:
this.filter = [{path: 'user.name.first', filter: 'donna'}];
Here's an example: http://plnkr.co/edit/KIefwLNHeinkOgERWOvZ?p=preview
this is part of an XML file I retrieve using AS3 E4X:
<links>
<link>
<label>Versions</label>
<href>http://mylink1</href>
</link>
<link>
<label>Configurations</label>
<href>http://myLink2</href>
</link>
</links>
I want to retrieve the values of labels, so I write:
document.links.link.label.text();
This returns VersionsConfigurations. I need this as Array ([Versions, Configurations]) but I would like not to use a loop. Is there any other way?
Well, this is a "don't try this at home" solution, but here you are. :)
You can use E4X search expression to do whatever you want to nodes of an XMLList.
This works as follows: someXMLList.(expression), where expression is any AS3 code that can access each node's properties and methods with no need of qualifying their names. For instance, you could do the following:
yourXML.descendants("label").(trace("label text: ", text()));
Note that I'm using text() here with no access . operations. Actually this will return an new XMLList for all nodes, where expression evaluated to true. Since trace() returns void, the resulting list will be empty. Internally there is of course a loop through all nodes of XMLLIst that is created by calling descendants() (or using .. operator).
You can construct your array the same way.
var doc:XML =
<links>
<link>
<label>Versions</label>
<href>http://mylink1</href>
</link>
<link>
<label>Configurations</label>
<href>http://myLink2</href>
</link>
<link>
<label>A label
with
multiple
line
breaks</label>
<href>http://myLink3</href>
</link>
</links>;
trace(doc.descendants("label").text().toXMLString().split("\n"));
/* Trace output (incorrect):
Versions,Configurations,A label
,with
,multiple
,line
,breaks
*/
var list:Array = [];
doc.descendants("label").(list.push(text().toString()));
trace(list);
/* Trace output (correct):
Versions,Configurations,A label
with
multiple
line
breaks
*/
That may be useful when performing some complicated searches on an XMLList. However in your case I think you should instead use simple splitting of a string representation or a regular expression as Shane suggests.
An alternative technique could be to use a regular expression, although this particular example is dependent on your labels always starting with a capital and otherwise containing only lower case characters.
var regex:RegExp = /[A-Z][a-z]+/g;
var inString:String = "VersionsConfigurations";
var outArray:Array = inString.match(regex);
trace(outArray.length); // 2
In Flex, is it possible to include some kind of MetaData to a property, to be able to list all possible values that a property can use? I want to be able to list the values when calling the property from MXML, as in the case of for example the property enabled or visible, where the user gets a list of "true/false".
Use the Inspectable metadata tag. In your case you'll want to explicitly use the enumeration attribute.
[Inspectable( enumeration="one,two,three" )]
public var myProp:String;