JavaScript - Copying An Object
Either I'm having a moment of stupidity, or have completely failed to understand a fundamental aspect of javascript. The code below is jquery, and uses jquery's extend() function, but I don't think that the issue has anything to do with that... does it?
Code: $(document).ready(function(){ var obj1 = { "name": "spud" ,"age": 32 } var obj2 = obj1; $.extend(obj2, {"location": "UK"}); console.log(obj1); }); By my reasoning, obj1 shouldn't have location set. But it does. If this is something peculiar to jquery, then my apologies and I'll go off to the right forum - but is it? Is the line var obj2 = obj1; not making a copy of the original and leaving the original intact? Is it instead making some sort of reference to it? Why is changing the copy having an effect on the original?? Similar TutorialsG'day, How would I go about copying all the prototype functions AND the constructor from one object into another object, and then call them? Code: function myOriginal() { alert('Hello'); } myOriginal.prototype.example = function() { alert('In example '+this.test); } function myNewThing() { // Copy myOriginal into this object here this.oldconstructor(); // Should now display "Hello" this.test = 'from myNewThing'; this.example(); // Should now display "In example myNewThing" } I know I can use this.example.call(this), but that's not an acceptable solution. I want to deploy this style over dozens, potentially hundreds of objects. Thanks muchly, Your friend from server-side... I have 2 textareas, 1 which will be vissible, another that will be hidden. I have a function that mirrors (not in reversed lettering) the first textarea's input to the second. Code: function copy_data(val){ var messageText = document.getElementById(val.id).value document.getElementById('message').innerHTML = messageText; } So that copies from : <textarea name="text_message" rows="4" id="text_message" style="direction:ltr;" onkeyup="copy_data(this)"></textarea><br/> To: <textarea name="message" rows="4" id="message" style="direction:ltr;"></textarea> Then I have another function which when I select text in the "text_message" textarea will apply a tag to it, however I don't want this tag to be vissible in the "text_message" textarea but rather in the "message" textarea. Code: function formatText(el,tag){ var selectedText = document.selection?document.selection.createRange().text:el.value.substring(el.selectionStart,el.selectionEnd); if(selectedText!=''){ var newText=''+tag+''+selectedText+''+tag+''; el.value=el.value.replace(selectedText,newText) } } This effects from this checkbox: <input type="checkbox" id="bold1" name="bold1" onclick="formatText(message,'#28D')" checked="checked" > Could anyone please help me, I think I may have missed something somewhere, because it works if I point it back to "text_message" Hi everyone, Is there a shorter and cleaner way of performing the following: The objective is to get the value/input from the first set of textboxes in the form and copy them to other set of textboxes. Outline of the form is as follows: First set of textboxes Company Address City State Zip Country Select number of users -->1 2 3 User 1 Company Address City State Zip Country User 2 Company Div Address1 Address2 City State Zip Country User 3 Company Address City State Zip Country ============================================= At the moment the code looks like this where (comp,div, addra,addrb,city,state,zip and country) are the name attributes of the first set of text boxes and (comp1.....country1,comp2.....country2, comp3....country3) are the name attributes for the textboxes for user 1,2 and 3 respectively. Code: function compAddress(){ document.form.comp1.value = document.form.comp.value; document.form.div1.value = document.form.div.value; document.form.addra1.value = document.form.addra.value; document.form.addrb1.value = document.form.addrb.value; document.form.city1.value = document.form.city.value; document.form.state1.value = document.form.state.value; document.form.zip1.value = document.form.zip.value; document.form.country1.value = document.form.country.value; document.form.comp2.value = document.form.comp.value; document.form.div2.value = document.form.div.value; document.form.addra2.value = document.form.addra.value; document.form.addrb2.value = document.form.addrb.value; document.form.city2.value = document.form.city.value; document.form.state2.value = document.form.state.value; document.form.zip2.value = document.form.zip.value; document.form.country2.value = document.form.country.value; document.form.comp3.value = document.form.comp.value; document.form.div3.value = document.form.div.value; document.form.addra3.value = document.form.addra.value; document.form.addrb3.value = document.form.addrb.value; document.form.city3.value = document.form.city.value; document.form.state3.value = document.form.state.value; document.form.zip3.value = document.form.zip.value; document.form.country3.value = document.form.country.value; Thanks, Essentially, I have an ASP.net page where I load a record set server side and upload it into a listbox. I'm trying to do all the movement functionalities of the listbox items client side. Specifically, I'm trying to figure out how to copy selected listbox items from one listbox to another -- on button click. I've searched for a while, but every example that I found moves the actual item into another listbox, I just want to copy the selected item to another listbox. I'm very new to JavaScript, so ff someone can provide an example or pseudo code, I would greatly appreciate it. I have 2 text boxes on my page. When the user clicks in one text box, I would like whatever is in there to be copied to the other text box. Is this possible? I have looked into it and onClick seems like it might do it but I can't get it to work. Thanks. Hi, I have a requirement where, on a link, when the user clicks, the app should copy all browser favorites and write to a db (table that has two columns, one with fav name and one col for the website link). Thoughts on how to get this done ? How can I read the the browser favorites from a javascript ? Thanks, Deepna Hi guys! i would like to ask for your assistance.. i am creating two template for my work.. and i would like to know what is the javascript that in one click i can copy and paste all the details from template #1 to template #2. considering that each field in template 1 will fall into the correct field in template #2.. http://img130.imageshack.us/i/25157983.jpg/ hope to hear from you soon. thanks! you may also email me at janshawn_54@yahoo.com Hello all, I am trying to copy the billing information to be the same as the shipping information when they select the checkbox. Everything seems to work except for the State field which is a drop down. Depending on what country they select, the state field will automatically populate. Does anyone know how I can copy the billing state to be the same as shipping as well? Text file attached. Thanks in advance. Hi, every time I try and alert: [ { number:0, secondnumber:0 }, { number:2, secondnumber:1 }, { number:1, secondnumber:2 } ] it just shows [object object], [object object], [object object]. Why is this and what can I do to make the record be shown as it is above in an alert? Thanks. I can't get any info from Firebug except that one line, uncaught exception [object Object]. The code fully worked, then I needed to make it dynamically create Sortables from the scriptaculous library based on how many X were in a table in my database, which I've done, and I'm thinking it may be a simple slight parse error of some type, I'm not too good with Javascript, because now my script barely works. I've double checked the script's source code, the PHP variables are exactly what they should be. Code: print<<<HERE Sortable.create('sortlist$box', { tag: 'img', overlap:'horizontal',constraint:false, containment: $list, dropOnEmpty: true, onChange: function(item) { var list = Sortable.options(item).element; if(changeEffect) changeEffect.cancel(); changeEffect = new Effect.Highlight('changeNotification', {restoreColor:"transparent" }); }, onDrop: function(item) { var thing=Sortable.options(item).element.identify(); var anchors = document.getElementById(thing).childNodes.length-2; if(anchors > 20){ alert('This box had 20 creatures in it already, your last action has not been saved.'); window.location.reload(); } else{ new Ajax.Request("saveImageOrder.php", { method: "post", parameters: { data: Sortable.serialize("sortlist$box") } }); } } }); HERE; $box++; } ?> }); </script> if you solve this I'll send ya $10 via paypal I created a method for displaying an object's properties: Code: renderfunction = false; function showProperty (object, property) { document.write ('<td class="type">' + (typeof object[property]) + '</td>' + '<td class="name">' + property + '</td>'); document.writeln('<td class="value">' + ( (typeof object[property] != 'function') ? object[property] :( (property != 'showProperties') ? ( renderfunction ? object[property]() : ('<span class="self">NOT RENDERED</span>') ) : ('<span class="self">THIS</span>') ) ) + '</td>'); document.writeln('<td class="hasOwnProperty" >' + ( object.hasOwnProperty(property) ? "Local" : "Inherited" ) + '</td>'); if (typeof object[property] == 'function') { document.writeln ('<td class="function">' + object[property] + '</td>'); } else { document.writeln ('<td class="function"> </td>'); } } As long as renderfunction = false, the object is fine coming out of this function. However, if I change renderfunction to true, all my properties become undefined. Why isn't this working as I expect it to? How should I fix it? Thanks in advance, -Brian. Ignore post (if mod, please delete)
Hello together! I generate html code with jsp. In that jsp there a several framesets and frames. And yes i know, frames are not really up to date but it's an old program and i have to deal with it now. Anyway, in the top frameset i have an onload attribute like onload="load()". In the function load i want to access the Element.prototype object. But unfortunately typeof Element gives me "undefined". So i looked a little deeper and found that window.toString() gives me "[object]" and not as expected "[object window]" so somehow my window doesn't know that its construcor is Window. window.construcor is "undefined" as well. And i don't have access to the Element object. I really don't know where the error could be. When the page is loaded and i access the same window over the console, then everything is right. But in my function a can't get access to the objects i need. I also don't know what part of the code could be useful to post here, but maybe someone had a similar problem before? i should say that this problem only occurs in IE8. In IE9 it works perfectly. Has anyone any idea?? I'm writing a program that involves a network of interconnected nodes (or simply objects in my example below). It depends on being able to access properties of an object's linked objects (a bit oddly worded, sorry)... Problem is I'm not sure how to properly access those properties... see below please. <script> //This is an example of a problem im having in my own code... //I want to access the name of the object within the links array wintin the object... var objA = {name: "Object A", links: [objB, objC]}; var objB = {name: "Object B", links: [objC, objD, objE]}; var objC = {name: "Object C", links: [objB]}; var objD = {name: "Object D", links: [objE]}; var objE = {name: "Object E", links: [objD]}; //ex: I want to access the name of Object A's first link... console.log(objA.links[0].name); </script> I'm hoping to get "Object B"... But instead I get: TypeError: Result of expression 'objA.links[0]' [undefined] is not an object. Is there another way around this? Any thoughts are appreciated. Hi all, I'm stumped on finding a way in javascript to create an object factory whose instances are also object factories. In short I want something like that below, but no joy ... any clues? Code: function createClass () { return new createClass() function createClass() { return new createInstance () function createInstance () { //Default properties, values and methods which might later be extended } } } var createDoor = createClass(); var door1 = createDoor(); var door2 = createDoor(); var createChair = createClass(); var chair1 = createChair (); var chair2 = createChair (); Quote: menu: function( a, b ) { $( b ).observe( 'click', function( event ) { event.stop(); if( $( a ).visible() ) { $( a ).hide(); $( b ).removeClassName( 'selected' ); document.stopObserving( 'click' ); } else { $( a ).show(); $( b ).addClassName( 'selected' ); document.observe( 'click', function( e ) { if( e.target.id != a && e.target.id != b && !Element.descendantOf( e.target, $( a ) ) ) { $( a ).hide(); $( b ).removeClassName( 'selected' ); document.stopObserving( 'click' ); } }); } }); $$( '#' + b + ' > a' ).each( function( element ) { element.observe( 'click', function( event ) { $( a ).hide(); $( b ).removeClassName( 'selected' ); document.stopObserving( 'click' ); }); }); } This work's perfrect accept when i use it with others on the menu it leaves the other ones open, how do i get it to close the open one when i open a new menu.. Thanks. Hello. Is there any way to get the variable name of an object from inside the object? E.g. PHP Code: function Bla(){ this.write = function(){ document.write(<objectname>); } } obj1 = new Bla(); obj1.write(); //Outputs obj1 Here is my script: PHP Code: function myTimer(seconds, obj){ this.seconds = seconds; this.obj = obj; this.startTimer = function(){ if(this.seconds>0){ this.seconds--; this.obj.innerHTML = this.seconds; this.timer = setTimeout("Timer.start()",1000); } } } Timer = new Timer(10, obj); Timer.startTimer(); Now the problem is that the variable that contains the object must be named "Timer". This way I cannot create new timer objects with different variable names I have tried: this.timer = setTimeout("this.start()",1000); but it doesn't work. That's why it would be good to detect the variable name and instead use something like this: this.timer = setTimeout(varname+".start()",1000); I would rather not have to pass the variable name through a parameter like this: Timer1 = new Timer(10, obj, "Timer1"); Thanks in advance. Hello, I have 2 things I'm trying to figure out. 1. First form on the page has questions with radio buttons. Each radio's value is a number so a score is assessed at the end. 2. Second form on the page is an email the admin form, which duplicates the score in one field. Question: I would like to know how to write the form results to a text area in second form. However, I can't do this for one, and secondly, the value is a number, can I use labels? Here's the code I've 'made up' so far... JS (i know it's wrong) Code: <script LANGUAGE="JavaScript" type="text/javascript"> function display() { message = "<ul><li><b>Question 1: </b>" + document.quizform.Q1.label; message = "<li><b>Question 2: </b>" + document.quizform.Q2.label; message = "<li><b>Question 3: </b>" + document.quizform.Q3.label; message = "<li><b>Question 4: </b>" + document.quizform.Q4.label; message = "<li><b>Question 5: </b>" + document.quizform.Q5.label; message = "<li><b>Question 6: </b>" + document.quizform.Q6.label + "</ul>"; document.write(message); } </script> Form field example: Code: Question 1:<BR> <label for="Yes"><input type="radio" name="Q1" value="0" checked></label>Yes<br> <label for="No"><input type="radio" name="Q1" value="10"></label>No<br> <label for="I don't know"><input type="radio" name="Q1" value="10"></label>I don't know<br> I am trying to troubleshoot my javascript function below. Code: <script type="text/javascript"> function txtboxfill(fillobj) { var rChar=String.fromCharCode(13); var myVal = "To: " + this.form.to.value + rChar; myVal = myVal + "From: " + this.form.from.value + rChar; myVal = myVal + "Subj: " + this.form.subj.value + rChar + rChar; myVal = myVal + "Message: "; fillobj.value = myVal; } </script> Then I have a text box input field with an Code: <input type="text" id="tp" name="to" size="34" class="totext" onkeyup="txtboxfill(this.form.msg_area);"> and when I enter text in this field it gives me a 'this.form.to' is null or not an object and does not populate the textarea. BTW, msg_area is the id of my textarea. Thank you. Code: function globals() { this.states = ""; } now I can: Code: globals.states = .... how to extend first code to be able: Code: globals.states.something = .... ? |