SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Wizard lukeurtnowski's Avatar
    Join Date
    Mar 2003
    Location
    Coronado
    Posts
    1,666
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)

    making an element dissapear/reapear?

    I have a form with an option (yes/no) and a new element should appear if yes is selected and dissapear if no is selected...
    heres my html element
    HTML Code:
        <div class="Container">
        <label for="Visiting">Visiting:</label>
        <select name="Visiting" id="Visiting" onchange="check_visit(this)">
        <option value="No">No</option>
        <option value="Yes">Yes</option>
        </select>
        </div>
    <div style="width:600px; clear: both" id="Optional">
    </div>
    and heres the javascript...
    HTML Code:
            function check_visit(e){
            if(e.value == "Yes"){
        var ni = document.getElementById('Optional');
          var newdiv = document.createElement('div');
          newdiv.setAttribute('id','Vision');
          newdiv.innerHTML = "<div class=\"Container\"><label for=\"date\" style=\"width:80px;\">From:</label><script>DateInput('From', true, 'YYYY-MM-DD')</script></div><div class=\"Container\"><label for=\"date\" style=\"width:80px\">To:</label><script>DateInput('To', true, 'YYYY-MM-DD')</script></div>";    
        ni.appendChild(newdiv);
            } else {
          var d = document.getElementById('Optional');
          var olddiv = document.getElementById('Vision');
          d.removeChild(olddiv);
            }
        }
    Shouldn't it work?
    "Oh, and Jenkins--apparently your mother died this morning."

  2. #2
    SitePoint Enthusiast
    Join Date
    Aug 2007
    Posts
    34
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi there.

    I think the problem is the existence of a closing </script> tag in the innerHTML assignment. Replace <script> and </script> with <"+"script> and <"+"/script> respectively.

  3. #3
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,875
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Alternatively just replace </ with <\/ whereever it appears inside of your JavaScript.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  4. #4
    SitePoint Wizard lukeurtnowski's Avatar
    Join Date
    Mar 2003
    Location
    Coronado
    Posts
    1,666
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    like this?
    HTML Code:
          newdiv.innerHTML = "<div class=\"Container\"><label for=\"date\" style=\"width:80px;\">From:<\/label><script>DateInput('From', true, 'YYYY-MM-DD')<\/script><\/div><div class=\"Container\"><label for=\"date\" style=\"width:80px\">To:<\/label><script>DateInput('To', true, 'YYYY-MM-DD')<\/script><\/div>";    
    cause it not working...Is there a way to clean it up?
    "Oh, and Jenkins--apparently your mother died this morning."


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
  •