<div> switching and Creating

**LevJames** · 10-17-2004 01:51 PM

I was wondering if there is anyway to make the function newFields to change

Code:

 <img onClick="test('test_1', this)" src="graphics/buttons/crossout.gif">

and

Code:

<div id="test_1" style="display: block">

and make it so the _1 will change with the fields. using the counter varible.

test.js

Code:

function test(section, obj)
{
	var obj;
	
	if(obj.id == 'on')
	{
  document.getElementById(section).style.display = 'none';
  obj.id = 'off';

	}
	else
	{
  document.getElementById(section).style.display = 'block';
  obj.id = 'on';
	}
}

var counter = 0;

function moreFields()
{
	counter++;
	var newFields = document.getElementById('readroot').cloneNode(true);
	newFields.id = '';
	newFields.style.display = 'block';
	var newField = newFields.childNodes;
	for (var i=0;i<newField.length;i++)
	{
  var theName = newField[i].name
  if (theName)
  	newField[i].name = theName + counter;
	}
	var insertHere = document.getElementById('writeroot');
	insertHere.parentNode.insertBefore(newFields,insertHere);
}

window.onload = moreFields;

test.html

Code:

<head>
<script src="lib/test.js" type="text/javascript" language="javascript"></script>
</head>
<form>
<div id="readroot"  style="display: none">

	<table width="100%" border="1" cellspacing="0" cellpadding="0">
  <tr>
          <td><img onClick="test('test_1', this)" src="graphics/buttons/crossout.gif"></td>
  </tr>
 
  <tr>
        <td height="25"> 
          <div id="test_1" style="display: block"><select name="rankingsel_1">
  <option>Rating</option>
  <option value="excellent">Excellent</option>
  <option value="good">Good</option>
  <option value="ok">OK</option>
  <option value="poor">Poor</option>
  <option value="bad">Bad</option>
	</select></div></td>
  </tr>
</table>

</div>


<span id="writeroot"></span>

<input type="button" value="Give me more fields!" onClick="moreFields()">
<input type="button" value="Send form" onClick="alert('Fake submit')">

</form>

**David Harrison** · 10-17-2004 02:21 PM

Originally posted by LevJames
I was wondering if there is anyway to make the function newFields to change

I really don't understand you, can you describe more clearly please?

**LevJames** · 10-17-2004 02:28 PM

ok, as you can see, the fucntion moreFields will add the exact fields that are in <div id="readroot>, but the new fields will be 1 number higher than the last:

EXAMPLE:
First <div>:
test_1
Second <div>:
test_2

Now, I need the function to also change that number on

Code:

<img onClick="test('test_1', this)" src="graphics/buttons/crossout.gif">

and

Code:

<div id="test_1">

**David Harrison** · 10-17-2004 05:13 PM

I don't see any function called moreFields...

Thread: <div> switching and Creating

Thread Tools

Display

<div> switching and Creating

Re: <div> switching and Creating

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions