Re: Can't getElementById on document.createElement dynamically

Tuesday, October 15, 2013

Hi Mike:


I'm at the finishing gate of one of the huge forms that have 2 other forms combines which means I have to write code for
six buttons.  I'm down to the last button and something really stupid is happening and I can't figure out why so I figure
that maybe I need another set of eyes.

I'm creating to labels the first one works find but the second one is bombing out on me.  I did everything the same, code below:

var firstInput = document.createElement('input');
    firstInput.name = "description";
    firstInput.setAttribute('value', des);
    firstInput.setAttribute("style"," position:absolute; left:150px; top:30px;");
    //formInput.value ="";//getvalue from document.creditCardRegister.description.value;
    firstInput.type ="text";
    firstInput.required ="true";
   
    var formLabel =document.createElement('label');
    formLabel.setAttribute("for", description);
    formLabel.innerHTML = "* Card Description: ";
    formLabel.setAttribute("style"," position:absolute; left:18px; top:37px;");  //This works fine

I'm appending everything of course

var formInput = document.createElement('input');
    formInput.name = "expiration";
   // formInput.setAttribute('value', expyear);
    //formInput.style.width = "50px";
    //formInput.value =""           
   // formInput.type ="text";
    formInput.required ="true";
    formInput.setAttribute("style"," position:absolute; left:150px; top:65px;");
   
    newElement.appendChild(formInput);
    alert("Is this append working for formInput");
   
    var nextLabel=document.createElement('label');
    alert("what wrong with label");
      nextLabel.setAttribute("for", expiration);      //This is breaking
      alert("Can't find problem");
      nextLabel.innerHTML = "* Expiration: ";
      nextLabel.setAttribute("style"," position:absolute; left:150px; top:50px;");


I'm sure its something small but can't find it.

Thanks In Advance
PH

On Sunday, October 13, 2013 3:03:13 PM UTC-5, pame...@aol.com wrote:
 
On my research it points out that you can not get element by id on an element created dynamically is there anyway around it?
  Here is  what I'm trying to do.  I'm aware that I don't have the createElement(select) in yet.  I was trying to get things working first.

 /**************Create Form******************/
 
 var element = document.createElement('div');   //parent
 element.id = "updateCCdialog";
 
 
                 
 
   var parent= element.parentNode;

   
 
    element.innerHTML = "Update Credit Card";
    element.style.height = "20px";
    element.style.width = "300px";
    element.setAttribute("style"," border:1px solid #06478c;");
  
   
    alert("Debugging");
   
   
    var nextDiv = document.createElement('div');
    nextDiv.className ="dialogWrapper";
   
 
   
    alert("Appending Divs");
   
    var regupdateForm=document.createElement('form');
    regupdateForm.id ="";  
    regupdateForm.method='';
    regupdateForm.action='';
   
    element.appendChild(nextDiv);
    nextDiv.appendChild(regupdateForm);
   
    alert("Start of form creation");
   
   
    var form_Msg = document.createElement('p');
    var msg_Node =document.createTextNode("Are you sure you want to update this card?");
   
    var formLabel =document.createElement('label');
    formLabel.style.font ="red";
    formLabel.setAttribute("for", description);
    formLabel.innerHTML = "Card Description: ";
   
    form_Msg.appendChild(msg_Node);
    form_Msg.appendChild(formLabel);
 
   
    alert("Start of form creation 0");
   
    var formInput = document.createElement('input');
    formInput.name = "discription";
    formInput.setAttribute('value', des);
    //formInput.value ="";//getvalue from document.creditCardRegister.description.value;
    formInput.type ="text";
    formInput.required ="true";
   
    var formLabel2 = document.createElement('label');
    formLabel2.style.font ="red";
    //formLabel2.setAttribute("for", expiration);
    formLabel2.innerHTML = "Expiration: ";
   
    formInput.appendChild(formLabel2);
    form_Msg.appendChild(formInput);
    nextDiv.appendChild(form_Msg);
   
    alert("Start of form creation2");
   
    var formselectMonth =  document.createElement('select');
    formselectMonth.id = "expirationMonth";
    formselectMonth.className = "expirationMonth";
    formselectMonth.setAttribute("style"," width:80px;  align:left; ");
     for(var i = 1; i <= 12; i++){
       var option = document.createElement('option');
         option.setAttribute('value','0'+i);
         option.appendChild(document.createTextNode('0' + i));
         //formselectMonth.appendChild(option); 
        }
   
    alert("Start of form creation3");
   
   
    var nnextDiv = document.createElement('div');
    nnextDiv.className ="UpdateCreditCardActions";
    var formbuttonUpdate = document.createElement('input');
    formbuttonUpdate.type= "submit";
    formbuttonUpdate.value="Update";
   
    var formbuttonCancel =document.createElement('input');
    formbuttonCancel.type="reset";
    formbuttonCancel.value ="Cancel";
   
    alert("Is this appending");
   
    nnextDiv.appendChild(formbuttonUpdate);
    alert("Is this appending0");
    nnextDiv.appendChild(formbuttonCancel);
     alert("Is this appending2");
 
     nextDiv.appendChild(nnextDiv);
   
    
   
    var formselectYear = document.createElement('select');
    formselectYear.id="experationYear";
    formselectYear.name="expirationYear";
    formselectYear.setAttribute("style"," width:50px;  align:left; ");
     for(var i = 2013; i <= 2024; i++){
            var option = document.createElement('option');
            option.setAttribute('value','0'+i);
            option.appendChild(document.createTextNode('0' + i));
             //formselectYear.appendChild(option);
        }   
  
   alert("Start of form creation4");
  
  
  
  
   parent.insertBefore(nextDiv, element);  //not working never hits my last alert
  
   alert("Am I making it to the  end")
 
    };

Thanking you in advance
PH

--
You received this message because you are subscribed to the Google Groups "JavaScript Forum" group.
To unsubscribe from this group and stop receiving emails from it, send an email to javascript-information+unsubscribe@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.

0 comments:

Post a Comment

Note: Only a member of this blog may post a comment.

Copyright © 2010 Web Design | Free Blogger Templates by Splashy Templates | Layout by Atomic Website Templates

Vida de bombeiro Recipes Informatica Humor Jokes Mensagens Curiosity Saude Video Games Animals Diario das Mensagens Eletronica Rei Jesus News Noticias da TV Artesanato Esportes Noticias Atuais Games Pets Career Religion Recreation Business Education Autos Academics Style Television Programming Motosport Humor News The Games Home Downs World News Internet Design Entertaimment Celebrities 1001 Games Doctor Pets Net Downs World Enter Jesus Mensagensr Android Rub Letras Dialogue cosmetics Genexus lasofia thebushrajr wingshock tripedes gorduravegetal dainfamia dejavu-transpersonal jsbenfica republicadasbadanas ruiherbon iranianforaryans eaystcheyl fotosdanadir Só Humor Curiosity Gifs Medical Female American Health Madeira Designer PPS Divertidas Estate Travel Estate Writing Computer Matilde Ocultos Matilde futebolcomnoticias girassol lettheworldturn topdigitalnet Bem amado enjohnny produceideas foodasticos cronicasdoimaginario downloadsdegraca compactandoletras newcuriosidades blogdoarmario arrozinhoii