I am working on a sortable table (full code in attachment). I solved all the intermediate steps till the end when, to my surprise, appenChild() method inserts some previous cloneNodes in looped rows in a peculiar mode, by leaving the end tags </tr> at the end of the table. So far:
1.- build the cloneNodes of the rows as an array, and each index as a paralel array:
//some needed variables on later
t=document.getElementById('tab');
nr=t.rows;
nc=t.rows[0].cells;
//array of rows and rows indexes
var oRows = new Array()
var iRows = new Array()
for(var i=1;i<nr.length;i++){
oRows[i]=t.rows[i].cloneNode(true);
iRows[i]=t.rows[i].rowIndex;
//so far so good, alert shows me what i needed
alert(oRows[i].innerHTML)
}
2. - build an array with the content of the correspondent cells on column and sort this array. The array is double and keep the genuine row's index for later use as each second element. Code:
I'm playing around with some AJAX-ish stuff and encountered some problem in the JS side of the universe. Maybe someone here can suggest an alternative that works.
I have developed a simple ASP.NET application with a web page that should display a list of users. This list page is designed to start with an empty table (with columns defined), and, onload, send an XmlHttp request to a server component (a.k.a. ListServer). This ListServer is currently simulating a long-running operation. So, it sleeps for 3 seconds, and then grabs a list of 4 users from an xml file. It applies an xsl transformation and returns the result.
The xslt is designed to take the xml data and convert it to a <ListChunkroot element containing a <trfor each user in the XML data. Each row contains 4 columns (Id, Login, Password, Name). The javascript in the list page grabs the responseXML from the XmlHttp object and should, for each <trin it, create a copy of the row coming from the server and adding it to the list on the client.
I actually got all that to work quite fine. The js snipplet dealing with copying the row coming from the server and adding it to the table on the client is: Code:
The problems I am having are with trying to get IE to successfully clone a referenced node from one frame and inport it (with all form values etc) to another frame. Moz works fine with
I have tried iterating the specified node and using createElement to create a copy in the desired place, which works fine with simple input type text or hidden. The first snag comes when trying the same with textareas. The cloned form doesn't submit the values :(
I'm developing an AJAX toolkit in which I needed a way to write a subset of a markup language to modify the running copy of the document. When implementing part of the append parser I came against a problem. What I'm basically doing is reading the append XML tag, looking where it says It has to add code and then clone the nodes inside that tag and attempt to insert them in the document. The problem comes when I'm trying to append, it seems like all my cloned nodes lose all it's style properties, for example several <li> items would come one next to the other instead of one below the other with the round bullet separation, or an image won't load the actual image. Code:
This is a shortened version of my problem. Below I am cloning the first data row and appending it to create a new row. If you make selections/add values and then press Add Row, the text box value is carried to the new row's text element also (the select doesn't retain it's selected value). How can I create a new row with the form elements in the original no value state? I tried cloning the Node on page load, but then it only allows me to add one row. Is there a way to clone the row and retain it to add as many rows as I like. I know I can clear all the values of the row after I create it, but that seems like a long way around especially since I have many fields in my actual code. Code:
I am finding that when I use the cloneNode method to copy an HTML element that contains a <script> tag, the contents of the <script> tag, (ie. the javascript) are removed.
If I do this: var form1 = document.getElementById(sID).firstChild.cloneNode( true); alert(form1.outerHTML);
I can see the empty <script> tags. I am wondering if there is a reasonable workaround for this, because I need the script tag with its javascript content.
I trying to figure out why CloneNode on an Iframe does not correctly clone the IFRAME with its contents and is there a workaround I can use to get pass this?. Basically what I am doing is dynamically building a table with Iframes inside it. The problem is I just want to build one Iframe because the contents of it can be very complex. After my Iframe is built I just want to clone the iframe as many times as I need later. I cannot use an HTML file and point the src of the Iframe to it. I have to put into the Iframe a very dynamic HTML document I get back form an Ajax call. This is truly the key of the problem. Since my pages can be complicated it can take around 2000ms to render. I don’t want to make each Iframe render every time when I already have the document ready to display. I just want to clone it very fast. I can not use the ‘scr’ of the iframe.
Here is a very simple example of my problem. Look near the end of the code to see the problem. Try this code and you can see the IFRAME does not Clone its contents. Is there any way around this problem? Please note that I also cannot use innerHTML to populate the cloned Iframe with my master Iframe’s contents. Because if I do this the page still takes 2000ms to render. I just want this thing to clone as it is. Code:
I have a table where the user can press an "add more" button which duplicates the row and displays it on the next line. I use this for my site to have the user input stock prices which may be split in multiple orders after they execute them. Here is my JS code:[code]I am submitting this with a form I need each cell id to have its own unique identifier. The way the code is now, the cloned cell has the same id as the original and only the data for one gets submitted.
I have a table where the user can press an "add more" button which duplicates the row and displays it on the next line. I use this for my site to have the user input stock prices which may be split in multiple orders after they execute them. Here is my JS code:
Code: <script> function insert(button) {var cell, newRow, row, sect; if((cell = button.parentNode) && (row = cell.parentNode) && row.cloneNode && (sect = row.parentNode) && sect.insertBefore){ newRow = row.cloneNode(true); /* If you need to alter the new row * or its contents, do it here. */ sect.insertBefore(newRow, row.nextSibling); }} </script>
This works fine. However, since I am submitting this with a form I need each cell id to have its own unique identifier. The way the code is now, the cloned cell has the same id as the original and only the data for one gets submitted.
The script works if the images are stored within the HTML but when I try to store them in the JS array, it fails. Is there any way to store the images in JS with this script?
I cannot get an appendChild(img) in the following code snippet to work in IE. However, the same script works without any problems in Firefox and Netscape 7.0 The error that is produced in IE is invalid argument. I have used a try/catch block in expectation of producing a better error message however the error message that is received is [objectError].
var pageDiv = window.parent.fraTop.document.getElementById('pageTitle'); if(pageDiv!=null) { while(pageDiv.hasChildNodes()) { pageDiv.removeChild(pageDiv.firstChild); }
var img = document.createElement('img'); img.src='/wp2f/images/please_wait.gif' pageDiv.appendChild(img); }
Can anyone tell me: 1) why my string appears twice; 2) how to make it appear just once?
I'm trying to insert code at the top of every viewed page. Obviously, document.body appends the string to the closing body tag which is not what I want. What could I use to insert my code as the first childnode under 'body'?
I'm trying to spread a table across a frameset. So I have index.htm that has an iframe sourcing the frameset. What I'm trying to do is create a table in index.htm to spread across the whole brower window. Code:
var newText = parent.frames[1].document.createTextNode("some text"); var theBody= parent.frames[1].document.getElementById("theBody"); theBody.appendChild(newText);
This will insert an element after the last <p>, can I insert one after the body but before the first <p>?
Over the last couple years I've built up a DOM library. Nothing fancy, you can just create an element with all its attributes in one function. What I've wanted to do is make it so you can determine the parent element of the newly created element. Works supa in firefox, not so supa in IE.This is my code....
Code: pollOptions = document.getElementById("pollOptionsContainer");/*new divs to organize it in*/ pollOptionsGroupContainer = buildHtml.createDivHTMLElement(pollOptions);
Why doesn't the following code work in firefox: var e = document.createElement("Div"); e.innerHTML = "<p>Hi</p>"; GP.appendChild(e); ..GP is a div.. It works in IE. What is the correct code for FF.
i'm trying to generate a calendar using dom to create a table. it works in firefox and opera, but ie won't show it, and sometimes gives me an alert saying it can't display the page, and then shows a 404 page. here's the code:
I have a simple two frame page (top and bottom; parent called index). and I am trying to dynamically create forms in the bottom frame when buttons are clicked on the top page. But I keep getting an error in the line labelled * below inside addBlock1(). Here is my code (which is in top.html): Code:
FYI the $ is just a prototype function for getElementByID the error i keep getting says that "targetDIV has no properties" not sure what that means exacly. Any ideas?
I am trying to create one image using JavaScript; then later in the script remove the image - not just remove the src. The following creates the image, but I have been unable to remove it.
How do I structure document.getElementById('num1').removeChild(image_ display); ?
