Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Oct 2002
    Posts
    95
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Post Adding Elements (form fields) to a page with JS or DHTML

    Hey there yall....youve been a great help in the past and now i think someone can help me again....

    I need a way to have a page add more form elements to itself when the user clicks a "+" button. basically, we're making a newsletter and making 3 paragraphs or so available....if they click the "+", it'll add another, and another, and another...up to 15...without REFRESHING the page....ive include the mockup i did...has anyone seen this?
    thanks a million to all of you!

    robocop


  • #2
    Regular Coder
    Join Date
    Jun 2002
    Location
    Cincinnati, OH
    Posts
    545
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Code:
    <HTML>
    <HEAD>
    <TITLE> New Document </TITLE>
    
    <script language="Javascript">
    	var _iCounter =0;
    	function AddElement() {
    		_iCounter += 1;
    		if (_iCounter <= 15) {
    			var o = document.getElementById("txtBoxHolder");
    			var txtFld = document.createElement("input");
    			txtFld.setAttribute("type","text");
    			txtFld.setAttribute("name","txtNew")
    			//txtDT.setAttribute("value",o.innerText);
    
    			o.appendChild(txtFld);		
    		} else {
    			alert("Sorry but no more fields can be added (15 is the Max).");
    		}
    
    	}
    </script>
    </HEAD>
    
    <BODY>
    <form>
    	Add a Textbox:<input type="button" value="+" onClick="AddElement()"><br/>
    	<p id="txtBoxHolder" style="width:25px;">
    	</p>
    	
    </form>
    </BODY>
    </HTML>

    To add a textarea are you would just do:
    var txtArea= document.createElement("textarea")
    txtArea.setAttribute("name","txtStatLog");
    txtArea.setAttribute("value","fill er up"
    txtArea.setAttribute("cols","30");
    txtArea.setAttribute("rows","10");


    Hope this is enough to get you started.
    Last edited by allida77; 10-01-2003 at 07:11 PM.
    does this sig match?

  • #3
    New Coder
    Join Date
    Oct 2002
    Posts
    95
    Thanks
    0
    Thanked 0 Times in 0 Posts
    wow....cool man, ill keep that as an option....

    do you know how to include a variable in something like

    document.all.row1.style.display = 'none';

    but where the "1" is, id like to dynamically put in something...like a variable name

    would it be like this?

    document.all.row[currentRow].style.display = ' ';


    anyone got any pointers?

  • #4
    Senior Coder
    Join Date
    Aug 2002
    Location
    UK
    Posts
    2,789
    Thanks
    2
    Thanked 14 Times in 14 Posts
    Just like to point out that

    document.all.row[currentRow].style.display = ' ';

    is IE4

    you should be going

    document.getElementById("currentRow").style.display = ' ';

    for later versions and cross browser


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •