I am changing a model on websocket messages. I attached a change event function to it:
oBindingModel.attachChange(function(oEvent){}
Now, inside the function, I need to know which value has changed. I searched trough the oEvent Object as well as the returned object from calling this insinde the function. There is a mEventRegistry with an array named change, but I can not find the value in there. Is there any possiblity?
the object returned from this
Thanks!
In the event handler function, you have access to the oEvent object which contains every information about the source of the event.
To access this object, just call oEvent.getSource() in your anonymous function body.
This will return with the source object, which holds the whole model and a most important thing - the path of the changed property. Just call the oEvent.getSource().getPath() to retrieve this information.
Now you know the path, so you can retrieve the value from the model.
Related
All:
I am new to DOM, I got one question about DOM reference, for example(suppose I use D3.js or jQuery):
var domelement = d3.select("div#chart");
d3.select("div#chart").remove();
console.log(domelement);
When I print domelement, it still show an Object in the console even though it has been deleted from the DOM structure.
So I am wondering, why this variable still has access to the DOM object?
How can I decide if a reference is invalid?
Thanks
So I am wondering, why this variable still has access to the DOM object?
You retrieved a reference to an object in memory and your variable will retain it for as long as you have it in scope.
You can mutate an object having a reference to it but you cannot destruct it (not in JS).
How can I decide if a reference is invalid?
There is no such a thing as "invalid" reference. If you want to check if the element is still mounted in the DOM - you can just try to search for it. If it's there - you'll find it, and you will not otherwise.
.remove() returns the value (like a return function in javascript). When you use console.log this value is printed but it no longer exists in the DOM. HTML elements can exist as data nodes in javascript (document.createElement).
In this state, they exists as data, but haven't been added anywhere where they'd be visible. .remove() cuts the element out of the body and returns it in its data form, then console.log prints it.
I am trying to "link" a tag value to a javascript variable (and ideally to a function, but well a variable is a good start), by reference.
I know I can do a myDom.value = myVar but then if the value of myVar change the tag will not be modified.
Is it possible to do this (not using events, because it would be so heavy)?
Thank you :)
No.
You can fake references by assigning objects to things, but only if the property you assign the object to is expecting an object and knows to pull data out of it instead of stringifying it and using it directly.
You could use a closure function around the variable. So instead of attaching the value, you attach a function which will return the variable:
myDom.valueAccessor = function(){ return value }
After this you can access the result as:
myDom.valueAccessor()
This will track the value in value as it changes. Obviously you could choose a snappier name for your function. This seems to work for me in Firefox.
I'm using .data() to store an object-instance to a DOM element. This works within the frame I'm in but due to regulation within the application I'm working on all jQuery dialogs are filled using an iframe. For some reason I can't seem to access the .data() stored object from outside the frame. Any way how I can access it?
My code to store the object (which is an CodeMirror-instance).
$('#MyTextArea').data('CodeMirrorEditor', editor); (where editor is the instance)
When I want to access it I'm using:
var context = document.getElementById('DialogFrame').contentWindow.document);
console.log($('#MyTextArea', context);
console.log($('#MyTextArea', context).data('CodeMirrorEditor'));
The first log results in the textarea being logged. Which is correct, because the ID referred to is a <textarea>.
The second log results in undefined. For some reason the stored instance of editor is lost or not accessible from outside the frame.
Any suggestions on how to approach this problem?
Your problem isn't with the context, but with the jQuery object itself.
Since the data() properties are set within the jQuery object that was defined in the original page, of course the new jQuery object can't access them.
To solve this, use the original jQuery object:
myOrigWindow.jQuery('some-selector').data(...);
I'm posting due to a lack of understanding of a couple of concepts and also to check if my description of this code is accurate.
First I have created parent object called contactForm. I've made this object equal to an object literal which uses literal notation that is, creating a new object with { } and defining properties within the brackets.
Then I have the init method. If you’re familiar with object orientated programming that would be the same things as your constructor method.
Now the next part is where is where I am confused. I am using jQuery to create a new element which are the button tags. Is this newly created element an object inside of the parent object called contactForm?
My second question is am I passing a parameter that sets the text to 'Contact Me!' to the contactForm object or the button element/object?
My final question - is it the case that the parameter passed to the object can also be called a property of that object?
Sorry if I haven't been descriptive enough or accurate enough with my terminology. Any succinct and clearly explained answers would be massively appreciated.
var contactForm = {
init: function() {
$('<button></button>', {
text: 'Contact Me!'
})
.insertAfter('article:first');
}
};
First I have created parent object called contactForm. I've made this object equal to an object literal which uses literal notation that is, creating a new object with { } and defining properties within the brackets.
You have an object, which is described in your code by an object literal, and assign that to the variable contactForm. Not sure why you would call it "parent".
Then I have the init method. If you’re familiar with object orientated programming that would be the same things as your constructor method.
Your object has a property named "init", which is a function - conveniently this is called "a method". However, constructors in JavaScript work a bit different - every function can construct objects when it is called with the new operator. Of course, a dedicated method to initialize is often used when singleton instances are declared (as literals).
Now the next part is where is where I am confused. I am using jQuery to create a new element which are the button tags. Is this newly created element an object inside of the parent object called contactForm?
No. What you are doing in the init function has (at first) nothing to do with the contactForm object. You are calling the jQuery function, and it returns an object on which you call the insertAfter method, and as you don't do anything with the result of that function it is garbage-collected.
My second question is am I passing a parameter that sets the text to 'Contact Me!' to the contactForm object or the button element/object?
You are passing two parameters: a string and an object. What the jQuery function does with these arguments is unknown to your code. According to the documentation (and to the code, if you really wanted to dig in), this will create a button element (wrapped in a jQuery instance) and call the text method on it.
My final question - is it the case that the parameter passed to the object can also be called a property of that object?
No. You pass parameters into a function. It might happen that the function sets them as properties of a returned object, but that depends on the function. Anyway they are not called "properties of the function object".
Is there any way to alter my Model properties from a javascript function inside a view?
Specifically, I have an edit view and need to access a string property value with
function SomeJSFunction() {
var somevar = '<%=Model.Property %>';
...
then do some changes on somevar and set the model property to the changed string.
I'm doing a submit at this point, so it's not a question of dealing with the display, just need to alter the model from inside the function before I submit. I know I could pass the string as a parameter and deal with it inside the controller but it just doesn't cut it as I really need to be done with it in the view. Appreciate any help!
You can't do this using javascript. The model is instantiated by the controller and passed to the view. If you want to modify some properties you will need to perform a request to a controller action and send the new values. This could be done either using a standard form or AJAX request.