SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Enthusiast
    Join Date
    Jul 2006
    Posts
    33
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    updating a variable onclick

    i have a file which includes php and javascript. here is my javascript:
    Code:
    	<script language="JavaScript">
    
    		function AddToIngList (form)
    		{
    
    			var Ingredient = form.ingredienttoadd.value;
    			form.ingredients_added.value += Ingredient + "\n";
    
    			var objHTML, objText, objinput;
    
    			objHTML = document.createElement('P');
    
    			objHTML.setAttribute('NAME', 'txtTest');
    			objHTML.setAttribute('ID', 'txtTest');
       
    			var strTest = form.ingredienttoadd.value;
      			objText = document.createTextNode(strTest);
    
    			objinput = document.createElement
    ('INPUT');
    		
    			objinput.name = "input"
    			objinput.value = "";
    
    			document.body.appendChild(objHTML);
    		
    			objHTML.appendChild(objText);
    			objHTML.appendChild(objinput);
    
    
    		
    		}
    	</script>
    this function is called here:
    PHP Code:
                    echo"<input type=\"button\" name=\"button\" Value=\"add\" onClick=\"AddToIngList(this.form)\">"
    which is a submit button (generated by php for reasons i wont go into here)

    so basically everytime someone clicks "button" a new input box is created with the name "input". obviously i want each box to have a unique name which is where my problem lies. is there a way that i can call the newly created input box "input1" and then on the next click, since input1 already exists call it "input2"?
    etc...
    can anyone help?
    thanks

  2. #2
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You can attach a custom property to the function itself(since functions are objects in js):

    if(!AddToIngList.count) AddtoIngList.count = 0;
    ++AddtoIngList.count;

  3. #3
    SitePoint Enthusiast
    Join Date
    Jul 2006
    Posts
    33
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i dont understand. where would i write that? in the onclick line?

  4. #4
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i want each box to have a unique name which is where my problem lies. is there a way that i can call the newly created input box "input1" and then on the next click, since input1 already exists call it "input2"?
    i dont understand. where would i write that?
    Where do you name your elements?

    The simplest way is to declare a global variable(i.e. outside any function definitions):

    var count = 0;

    and then inside your function increment its value:
    Code:
    function AddToIngList (form)
    {
          //code
    
         objectinput.name = "input" + ++count;
    
         //code
    }
    A more clever way is to do it like this:
    Code:
    function AddToIngList (form)
    {
          //code
    
         if(!AddToIngList.count) AddtoIngList.count = 1;  //if doesn't already exist, creates a variable named 'count'
                                                                     // and attaches it to the function name
         objectinput.name = "input" + addToIngList.count++;
    
         //code
    }

  5. #5
    SitePoint Zealot
    Join Date
    Mar 2007
    Posts
    191
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    7Stud, you sound like u could help me make something that counts up clicks and records them on a server. I think I need javascript like your example to count up... Could you please look at my thread?

    http://www.sitepoint.com/forums/showthread.php?t=464945


Bookmarks

Posting Permissions

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