Does anyone know of any generic code to clone an object (which only contains properties), which copies by value, not just reference?
It seems as though there should be some sort of prefab recursive function that could work for any old object, so I didn't want to re-invent the wheel Code:
element = document.getElementById(IdOfElement) element = element.cloneNode(true) new_element = document.getElementById(IdOfElement).appendChild(e lement)
Anybody knows how to set id for the new element ? I mean the id which I coud use in CSS stylesheet for setting css properties of new element.
Is there a way in Javascript or Jquery to return an array of all objects underneath a certain point, ie. the mouse position. Basically, I have a series of images which link to various web pages but I have a large semi transparent image positioned over the top of the other images. I want to find the href of the background image that the mouse pointer clicks over.
I'm using a fieldset with a set of form elements as a template, but when I clone the node and try to change the contained element names + ids, they are being set at some point, because I can 'alert' the new names/ids out, but they are not being changed in time to be written to the DOM.
The code is here. Take '?debug' off the address to ditch the alerts.
It's probably a dumb mistake I've made along the way, but I can't see the wood for the trees Any pointers would be great.
UPDATE: The function in question is 'addDate'. I have a form generated from PHP and I want to clone a group of elements and rename each from 'startTime1[h]' to 'startTime2[h]' etc. but the new elements are keeping the same name 'startTime1[h]'.
I have put together a small script and need to clone all the object boxes so that I can copy from selelct box 2 to textarea 1 after adding new row. I am also looking to copy from autocomplete to the same textarea and have the text fall into the text box on a new line.
I'm new to jquery so I'm having a bit of an issue cloning a table row and having all of the id's change correctly. I'm able to clone a row with no problem and change the id of the tr after clicking a button by doing this:
var newId = document.getElementById("id").value; // This works because I am using a hidden input for my id $(id).clone().attr("id", "row" + newId).insertAfter("#div_id");// This changes the id of row The problem I am having is when I want to change the other id's inside of the tr. After insertAfter() I'll do the following: .find("span").text("Item" + newId).find("#Item_A" + oldId).attr("id", "Item_A" + newId);
The first .find will change the text with no problem, its when I get to Item_A that it will keep the old id instead of incrementing to the new id. Yes, I am declaring oldId as a variable and assigning it as newId - 1. Any ideas on how to make sure all id's are incremented properly?
So what I need to do is to simply clone the row, substitute new values from an array and insert it after the last existing row (if array's size more then 1). But this doesn't work! Where is an error?
I have a form that I want to clone and add up to 5 duplicates with slight changes. The changes are:
Add a second question and another set of related radio buttons for only the duplicates. Change the title in the Header to increment by 1 ex. Header 1, Header 2...
I also would like to make the form elements "id" and "names" unique. Also, continue to use the add and remove button at the bottom.
I have included my existing code.
NOTE: for a visual, I mocked up the the original form and 1 copy of the fields in the html, not to be used.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head>
Following is the code which will clone a set of div with their events(onclick) which is working fine for FF but in case of IE it is not firing events associated with each div.
I need to .clone() sections in a dynamic form, but get problems withthe radio buttons in IE.To work as a group, the radio buttons need to have the same name (persection). This is accomplished by changing the name attribute aftercloning a hidden section in a <div>. Easy with jQuery! - and it workswith FF, Opera, Chrome, Safari...IE however, does not allow changing of name attribute dynamically, andtreats all radio buttons across the sections as part of the samegroup!!Does anyone know of a workaround, preferably using jQUery, andavoiding browser sniffing and low-level DOM programming?
I am using the little tooltip script below. Normally, works fine, except when I clone an element which has a tooltip in it and append it to another element using something like: $("#table tbody").append($("#row").clone(true));.
Now, immediately after cloning it, I use jQuery to alert the title attribute, and it is in the new element. Then, when I view it using firefox, the title is gone, and obviously the tooltip cannot work.
/** Vertigo Tip by www.vertigo-project.com Requires jQuery */
I'm writing a dynamic form that allows users to add fields. Thesefields are contained in a table.I have this function to clone the rows (my table has an ID of
I am currently using this function to clone rows in my table when a user clicks 'add row'
The problem is, obviously, cloning the row also clones any of the data that the user may have already entered. I need to just clone the elements of the row, not the user entered data. Is there a way to remove all data from a row before it is cloned?
I have a form where you can enter 1 player's data, press a button and that DIV gets cloned below with same ID names but numbers get augmented (ie firstName_1 in div player_1 becomes firstName_2 in player_2). My problem now is I have a Gender radio button and that if you fill out the gender question and then press the 'Add Player' button the checked status seems to disappear from the cloner div but is retained in the clonee div.
IE you can set gender_1 to 'Male' in div player_1 (checked with DOM inspector and console logging) but when stepping thru the code in firebug
I am trying to figure out how to use objects properties in my code so when the page loads All my properties are in object where I can use elsewhere in my page. Code:
I'm trying to use the following code to load xml files:
ImportXML = function (ts) { this.file = ts; if (document.implementation && document.implementation.createDocument) { this.doc = document.implementation.createDocument("", "", null); this.doc.obj = this; this.doc.onload = this.callBack; this.doc.load(this.file); } else if (window.ActiveXObject) { this.doc = new ActiveXObject("Microsoft.XMLDOM"); this.doc.onreadystatechange = this.ready; this.doc.obj = this; this.doc.load(this.file); } else { alert("Error"); } } ImportXML.prototype.ready = function () { if (myDoc[counter].readyState == 4) this.obj.callBack(); } ImportXML.prototype.callBack = function () { alert('loaded'); }
var xmlDoc = new ImportXML("bar.xml");
The problem I'm having is with the second line that reads this.doc.obj = this;
IE tells me that object doesn't support this property or method. How is it possible to get a reference to the object (xmlDoc) in the prototypes 'ready' and 'callBack" with IE?
If you have a javascript interpreter running in an environment unknown to you (as in what objects it exposes to the language) is it possible to loop through all objects in some way?
This is a non-browser environment, specifically the scripting engine for doing xslt extensions in msxml.
"When we combine FUNCTIONS with OBJECTS we get METHODS". Then he creates an empty ARRAY:
var a = [];
then he uses the "push() method" to add elements to the array.
a.push(1,2,3);
uh, methods are for *objects* right? Yet he is using them on an ARRAY.how an array can magically becomes an object that is manipulated by a "method"?I mean, the array is still an array, no? It never actually becomes an object, right? Yet we still use a *method* to manipulate it. See my conceptual quandry?
I've often write javascripts that use this rather common code to get all tags in an XHTML document:
var alltags = document.getElementsByTagName('*') ... and then use a for loop to access the elements as an array, for example: for (i=0;i<alltags.length;i++) { elementClass=alltags.className [i]Do stuff }
This has always seemed to work in the past, but I recently learned that the getElementsByTagName method returns a DOM NodeList, not an array. I'm currenly working on a project that needs to access the children of an element conditionally upon its class.
I have three questions. First: How do I declare a global variable to be a DOM NodeList object? It wouldn't be assigned until called from a function, so something akin to var elementList = document.getElementsByTagName() in my global declarations is out of the question. Is there something like var elementList = new NodeList() in javascript? (I know that I can assign it in a function without the var and it will be global, but other people may have to work with this code, and I'd like to have it clearly declared at the head of the program.)
Second question: Assuming alltags is a NodeList returned from a getElementsByTagName call, which of these is proper? This:
childElements = alltags[i].getChildNodes() ... or this: childElements = alltags.item(i).getChildNodes() And finally, which of the above techniques has better browser support?
I recently had a problem where I needed to build up an array of strings, that would be join()ed into a string when the array building was complete. however, each value could only be in the array once.
This was a problem for a few reasons. Once a value has gone into an array the only way to check for it that works cross-platform is to scan the array looking for the value. FireFox has the every() and some() functions but they don't work in anything else.
Using an object to simulate an assocaiative array would allow me to avoid this problem by storing key/values with the keys having the same value as the value I was storing. I could then use the (a in b) construct to check that I had not already added a value.
However, array type methods won't work with objects, so I had no access to size () or join () meaning I'd have to manually build the string by iterating over the object.
My solution was to use an array object, but to store the provided data i nboth the array proper and as a property of the array object.
var myArray = new Array;
function addVal (val) { if (!(val in myArray)) { myArray [val] = 1; myArray.push (val); } }
This approach does use up more memory but it does give me the advantages of both arrays and objects for little extra work. (if you don't have FireBug then replace console.log with alert)