JavaScript Object Property editing
I'm creating (what feels like) a complicated script for use in creating a data based glossary as part of an in5 HTML 5 export.
It takes a tab delimited text file and converts it into a js Array of Objects, each object containing the properties: term, definition, and link. Example below:
{
term:"Term goes here",
definition:"The definition goes here",
link:"Page links go here"
}
My issue arrises when trying to edit the contents of objects via my Dialog with a listbox containing the terms, and edittext fields which default to the properties of the array objects as they are selected. I use event listeners to detect 'changing' and 'change' on the edittext fields like so:
// Edittext field for the Term
var displayTerm = displayGrp.add("edittext", [0, 0, 350, 20]);
// Edittext field for the Defintion
var displayDef = displayGrp.add("edittext", [0, 0, 350, 150],
{alignment: ['fill', 'fill']},{multiline: true});
// Statictext field for the Link
var displayLinks = displayGrp.add("statictext", [0, 0, 350, 20]);
//Update the Listbox item with the edittext field contents
//putting these items in the 'change' event listener only
//updated after a few unfocus/focus of other fields
displayTerm.addEventListener('changing', function() {
var index = termListBox.selection.index;
var newText = this.text;
termListBox.items[index].text = newText;
})
//Update the object property with the edittext field contents
displayDef.addEventListener('changing', function() {
var index = termListBox.selection.index;
var newText = this.text;
splitGlossArray[index].definition = newText;
updateGlossData(splitGlossArray)
})
//Update the object property with the edittext field contents
displayTerm.addEventListener('change', function() {
var index = termListBox.selection.index;
var newText = this.text;
splitGlossArray[index].term = newText;
//Alerts to check array object properties
alert(splitGlossArray[index].term);
alert(splitGlossArray[index]);
alert(typeof(splitGlossArray[index]));
alert(splitGlossArray[index].term);
})But its producing curious results. If given the example object above, when editing the field text and clicking away you get the following outputs in the alerts:
Term field editted to: "Term will never go here"
alert(splitGlossArray[index].term);
//Returns "Term will never go here"
alert(splitGlossArray[index]);
//Returns:
// {
// term:"Term goes here",
// definition:"Definition goes here",
// link:"Page links go here"
// }
alert(typeof(splitGlossArray[index]));
//Returns: object
alert(splitGlossArray[index].term);
//a double check to make sure the term property
//hasnt been overwritten
//Returns "Term will never go here"
So whats going on here? Why is the object property saying its being changed in my alerts, but the object overall is not?
