SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member
    Join Date
    Aug 2007
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Help on remove elements using removeChild()

    In my form I also want to be able to remove elements based on the selected item in another select box. Here is how it works:

    in another select box, some of the items have sub-categories, when I select them, the select box contains sub-categories will append the the existing select box( this part is working fine).

    But when I select different item in the parent select box, the sub-category select box either will disappear ( no child ) or replaced by different sub-category select box ( different sub-categories ).

    My problem right now is removeChild() is not working for me. Since I am not quite familiar with javascript or DOM, can anyone give me some hints. Thanks in advance
    Code:
    script type="text/javascript" src="[% c.uri_for("/static/js/prototype.js") %]"></script>
    
    
    <script type="text/javascript">
    function getSubCat(PID, Container) {
        var category = $(PID);
        var url = 'http://kewei-desktop:3000/admin/subcategories/category/' + category.value;
        
        new Ajax.Request(url, { 
              method: 'post',
              onSuccess: function(transport) {
                  var response = transport.responseText;
                  var temp = document.createElement("div");
                  if( response.length > 4 ) { 
                      var divIdName = 'category_'+category.value+'_children';
                      temp.setAttribute('id', divIdName);             
                      temp.innerHTML = response;
                      $("linkInfo").appendChild(temp);
                  }
                  else if (response.length == 4){
                      removeElement(divIdName);
                  }
              }
            }
        )
    }
    
    function removeElement(divID) {;
        var olddiv = $(divID);
        alert(olddiv);
        $("linkInfo").removeChild(olddiv);
    }
    $("linkInfo") is the parent

  2. #2
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,159
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Isn't the problem that you construct divIdName in the if clause and then try to use it in your else clause?

    Move the variable declaration up one line:
    Code JavaScript:
    function getSubCat(PID, Container) {
        var category = $(PID);
        var url = 'http://kewei-desktop:3000/admin/subcategories/category/' + category.value;
     
        new Ajax.Request(url, { 
              method: 'post',
              onSuccess: function(transport) {
                  var response = transport.responseText;
                  var temp = document.createElement("div");
                  var divIdName = 'category_'+category.value+'_children';
                  if( response.length > 4 ) { 
                      temp.setAttribute('id', divIdName);             
                      temp.innerHTML = response;
                      $("linkInfo").appendChild(temp);
                  }
                  else if (response.length == 4){
                      removeElement(divIdName);
                  }
              }
            }
        )
    }
    Birnam wood is come to Dunsinane

  3. #3
    SitePoint Member
    Join Date
    Aug 2007
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I tried the modification, it is still not working for me. I think I didn't explain the problem well. The "SubCategory" select box is created on the fly, so the variable "divIdName" will only have value after " $("linkInfo").appendChild(temp)", it is null before this statement.

    what I am trying to do is to carry the value of divIdName into the "else if" statement. I tried make divIdName a global variable, it didn't help too.


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
  •