Results 1 to 6 of 6

Thread: Infinite divs/items?

  1. #1
    Join Date
    Jan 2007
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Infinite divs/items?

    I might be overlooking something, but this is what I want to do:

    Have a button or drop down option, that spawns or creates a new div which has more options of it's own.

    I've seen and can make stuff like:
    Change the number of options inside a subsequent drop down with a drop down choice
    http://www.quirksmode.org/js/options.html#support

    And also it's easy to make 100 divs or select option lists HIDDEN and then reveal them one by one pretending to "add" them.

    But, what about spawning, or basically writing HTML on the fly?

    Doable?

    Trying to really understand the max capability of JS and move into Ajax(yeah, I know hated buzzword) stuff.

  2. #2
    Join Date
    Mar 2006
    Location
    Illinois, USA
    Posts
    12,164
    Thanks
    265
    Thanked 690 Times in 678 Posts

    Default

    Well... I don't know JS that well, but I suppose you could just do this...

    Code:
    var newdiv;
    newdiv = '<div>' + divcontent + '</div>';
    var divcontent;
    divcontent = '<input type="button" onClick="this.innerText = this.innerText + divcontent2">';
    Seems like it could work out alright. Untested. Also... serves no real purpose. ...just makes a ton of divs.


    EDIT: Well... since I don't know JS that well, I can't finish the code. I was testing it an realized I just messed up putting 'this' which would refer to the button, not the div. So.... this.parentdiv would be great, but I don't know what the right code is to select that. Perhaps someone else can suggest something.
    Last edited by djr33; 01-24-2007 at 12:13 PM.
    Daniel - Freelance Web Design | <?php?> | <html>| espa˝ol | Deutsch | italiano | portuguŕs | catalÓ | un peu de franšais | some knowledge of several other languages: I can sometimes help translate here on DD | Linguistics Forum

  3. #3
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,878
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    Ajax(yeah, I know hated buzzword)
    It's not hated so much as misleading. AJAX stands for Asynchronous Javascript And XML. However, many scripts labelled "AJAX" (like the "AJAX Content" script here on DD) are neither asynchronous nor XML-based.
    But, what about spawning, or basically writing HTML on the fly?

    Doable?
    Certainly. Don't use innerHTML as the start of djr33's script suggested he was about to do, though: this will erase the contents of all existing elements in the form, as well as wiping out their event handlers. Instead, use the DOM methods:
    Code:
    function addDivToForm(frm) {
      var d = document.createElement("div");
      d.style.border = "3px solid red";
      frm.appendChild(d);
    }
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  4. #4
    Join Date
    Jan 2007
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by Twey View Post
    It's not hated so much as misleading. AJAX stands for Asynchronous Javascript And XML. However, many scripts labelled "AJAX" (like the "AJAX Content" script here on DD) are neither asynchronous nor XML-based.Certainly. Don't use innerHTML as the start of djr33's script suggested he was about to do, though: this will erase the contents of all existing elements in the form, as well as wiping out their event handlers. Instead, use the DOM methods:
    Code:
    function addDivToForm(frm) {
      var d = document.createElement("div");
      d.style.border = "3px solid red";
      frm.appendChild(d);
    }
    that looks hot

    thanks, I'll test this out

    I'm intent on making some sort of totally interactive demonstration, that doesn't necessarily refresh or use the database much. I think it's the future and have seen some crazy examples, check this example out I found:

    http://www.propeller-head.biz/demo/desktop/

  5. #5
    Join Date
    Mar 2006
    Location
    Illinois, USA
    Posts
    12,164
    Thanks
    265
    Thanked 690 Times in 678 Posts

    Default

    Note: Listen to twey. Mine was a stab in the dark that was at least somewhat well guessed... it almost worked

    I hope the solution works for you.
    Daniel - Freelance Web Design | <?php?> | <html>| espa˝ol | Deutsch | italiano | portuguŕs | catalÓ | un peu de franšais | some knowledge of several other languages: I can sometimes help translate here on DD | Linguistics Forum

  6. #6
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,878
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    I'm intent on making some sort of totally interactive demonstration, that doesn't necessarily refresh or use the database much. I think it's the future and have seen some crazy examples, check this example out I found:
    Also check out http://eyeos.org/. However, do provide plain server-side fallbacks wherever possible.
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

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
  •