• InnerHTML quirks

    From =?UTF-8?Q?Jonas_Th=C3=B6rnvall?=@jonas.thornvall@gmail.com to comp.lang.javascript on Wed Jun 26 22:51:48 2019
    From Newsgroup: comp.lang.javascript

    Given i have an option list generated dynamically and then inserted to my main HTML file with using div.

    <div id="bankOptList"></div>

    And inserted using javascript.
    function bankOptionList(){
    bankOptNames="";
    bankSelect ="<font color=white><b>BANK:</b></font> <select id='selBank' onChange='bankSelection()'>\n";
    for (var r=0;r<bankName.length;r++){
    bankOption=bankName[r];
    //alert(bankName[r]);
    bankOptNames+="<option value="+r+"> "+r+" "+bankOption+"</option>\n";
    }
    bankOptEnd="</select> \n";
    bankOptionString=bankSelect+bankOptNames+bankOptEnd;
    //alert(bankOptionString); document.getElementById("bankOptList").innerHTML=bankOptionString;
    }


    How can i set selected index?
    The usual way below do not work. document.getElementById("selBansk").selectedIndex;

    I must somehow also refer to "bankOptList" to set index of option list?
    How is this done in most obvious straightforward way.

    I find it weird though that the innerHTML part has no problem reach functions in main. But main seem unaware of the id's within innerHTML.

    "well expcept for the container id" bankOptList.

    --- Synchronet 3.17c-Linux NewsLink 1.110
  • From =?UTF-8?Q?Jonas_Th=C3=B6rnvall?=@jonas.thornvall@gmail.com to comp.lang.javascript on Wed Jun 26 23:00:40 2019
    From Newsgroup: comp.lang.javascript

    Den torsdag 27 juni 2019 kl. 07:51:54 UTC+2 skrev Jonas Thörnvall:
    Given i have an option list generated dynamically and then inserted to my main HTML file with using div.

    <div id="bankOptList"></div>

    And inserted using javascript.
    function bankOptionList(){
    bankOptNames="";
    bankSelect ="<font color=white><b>BANK:</b></font> <select id='selBank' onChange='bankSelection()'>\n";
    for (var r=0;r<bankName.length;r++){
    bankOption=bankName[r];
    //alert(bankName[r]);
    bankOptNames+="<option value="+r+"> "+r+" "+bankOption+"</option>\n";
    }
    bankOptEnd="</select> \n"; bankOptionString=bankSelect+bankOptNames+bankOptEnd; //alert(bankOptionString); document.getElementById("bankOptList").innerHTML=bankOptionString;
    }


    How can i set selected index?
    The usual way below do not work. document.getElementById("selBansk").selectedIndex;

    I must somehow also refer to "bankOptList" to set index of option list?
    How is this done in most obvious straightforward way.

    I find it weird though that the innerHTML part has no problem reach functions in main. But main seem unaware of the id's within innerHTML.

    "well expcept for the container id" bankOptList.
    I have tried
    document.getElementById('selBank').selectedIndex.innerHTML = 4 ;
    It does not protest, but it does not change the selected option....
    --- Synchronet 3.17c-Linux NewsLink 1.110
  • From Arno Welzel@usenet@arnowelzel.de to comp.lang.javascript on Thu Jun 27 10:18:23 2019
    From Newsgroup: comp.lang.javascript

    On 27.06.19 07:51, Jonas Thörnvall wrote:
    Given i have an option list generated dynamically and then inserted to my main HTML file with using div.

    <div id="bankOptList"></div>

    And inserted using javascript.
    function bankOptionList(){
    bankOptNames="";
    bankSelect ="<font color=white><b>BANK:</b></font> <select id='selBank' onChange='bankSelection()'>\n";
    for (var r=0;r<bankName.length;r++){
    bankOption=bankName[r];
    //alert(bankName[r]);
    bankOptNames+="<option value="+r+"> "+r+" "+bankOption+"</option>\n";
    }
    bankOptEnd="</select> \n"; bankOptionString=bankSelect+bankOptNames+bankOptEnd; //alert(bankOptionString); document.getElementById("bankOptList").innerHTML=bankOptionString;
    }


    How can i set selected index?

    By setting the "selected" attribute for the option, which should be
    selected intially.

    Also see:
    <https://developer.mozilla.org/de/docs/Web/HTML/Element/option>

    The usual way below do not work. document.getElementById("selBansk").selectedIndex;

    This does nothing.

    If you want to *set* the index you have to assign it:

    document.getElementById("selBansk").selectedIndex = 1;

    Also see <https://developer.mozilla.org/en-US/docs/Web/API/HTMLSelectElement/selectedIndex>



    --
    Arno Welzel
    https://arnowelzel.de
    --- Synchronet 3.17c-Linux NewsLink 1.110
  • From Arno Welzel@usenet@arnowelzel.de to comp.lang.javascript on Thu Jun 27 10:20:51 2019
    From Newsgroup: comp.lang.javascript

    On 27.06.19 08:00, Jonas Thörnvall wrote:

    I have tried
    document.getElementById('selBank').selectedIndex.innerHTML = 4 ;

    This is nonsense!

    You can either read it the index:

    myindex = document.getElementById('selBank').selectedIndex;

    or set it:

    document.getElementById('selBank').selectedIndex = 4;

    But using "innerHTML" is nonsense! Why do you even think, that
    "innerHTML" is used to set the index?



    --
    Arno Welzel
    https://arnowelzel.de
    --- Synchronet 3.17c-Linux NewsLink 1.110
  • From =?UTF-8?Q?Jonas_Th=C3=B6rnvall?=@jonas.thornvall@gmail.com to comp.lang.javascript on Thu Jun 27 01:43:05 2019
    From Newsgroup: comp.lang.javascript

    Den torsdag 27 juni 2019 kl. 10:18:30 UTC+2 skrev Arno Welzel:
    On 27.06.19 07:51, Jonas Thörnvall wrote:
    Given i have an option list generated dynamically and then inserted to my main HTML file with using div.

    <div id="bankOptList"></div>

    And inserted using javascript.
    function bankOptionList(){
    bankOptNames="";
    bankSelect ="<font color=white><b>BANK:</b></font> <select id='selBank' onChange='bankSelection()'>\n";
    for (var r=0;r<bankName.length;r++){
    bankOption=bankName[r];
    //alert(bankName[r]);
    bankOptNames+="<option value="+r+"> "+r+" "+bankOption+"</option>\n";
    }
    bankOptEnd="</select> \n"; bankOptionString=bankSelect+bankOptNames+bankOptEnd; //alert(bankOptionString); document.getElementById("bankOptList").innerHTML=bankOptionString;
    }


    How can i set selected index?

    By setting the "selected" attribute for the option, which should be
    selected intially.

    Also see:
    <https://developer.mozilla.org/de/docs/Web/HTML/Element/option>

    The usual way below do not work. document.getElementById("selBansk").selectedIndex;

    This does nothing.

    If you want to *set* the index you have to assign it:

    document.getElementById("selBansk").selectedIndex = 1;

    Also see <https://developer.mozilla.org/en-US/docs/Web/API/HTMLSelectElement/selectedIndex>



    --
    Arno Welzel
    https://arnowelzel.de
    The whole point with my post is that it does not work for innerHTML Arno.
    "yes i missed the =1"; that you posted sorry.
    What worse is
    document.getElementById('selBank').selectedIndex.innerHTML = 1;S
    does not work either.
    So the question is howto set the selected index for an option list "within a segment of innerHTML".
    --- Synchronet 3.17c-Linux NewsLink 1.110
  • From =?UTF-8?Q?Jonas_Th=C3=B6rnvall?=@jonas.thornvall@gmail.com to comp.lang.javascript on Thu Jun 27 01:53:20 2019
    From Newsgroup: comp.lang.javascript

    Den torsdag 27 juni 2019 kl. 10:20:56 UTC+2 skrev Arno Welzel:
    On 27.06.19 08:00, Jonas Thörnvall wrote:

    I have tried
    document.getElementById('selBank').selectedIndex.innerHTML = 4 ;

    This is nonsense!

    You can either read it the index:

    myindex = document.getElementById('selBank').selectedIndex;

    or set it:

    document.getElementById('selBank').selectedIndex = 4;

    But using "innerHTML" is nonsense! Why do you even think, that
    "innerHTML" is used to set the index?



    --
    Arno Welzel
    https://arnowelzel.de
    When you generate an option list dynamically and insert it with innerHTML
    HTML document
    <div id="bankOptList"></div>
    Javascript
    document.getElementById("bankOptList").innerHTML=bankOptionString;
    The "dynamically generated id selBank" is not available from main
    Thus your suggested.
    document.getElementById("selBansk").selectedIndex = 1;
    Will not work...
    --- Synchronet 3.17c-Linux NewsLink 1.110
  • From Arno Welzel@usenet@arnowelzel.de to comp.lang.javascript on Thu Jun 27 10:55:10 2019
    From Newsgroup: comp.lang.javascript

    On 27.06.19 10:53, Jonas Thörnvall wrote:

    Den torsdag 27 juni 2019 kl. 10:20:56 UTC+2 skrev Arno Welzel:
    On 27.06.19 08:00, Jonas Thörnvall wrote:

    I have tried
    document.getElementById('selBank').selectedIndex.innerHTML = 4 ;

    This is nonsense!

    You can either read it the index:

    myindex = document.getElementById('selBank').selectedIndex;

    or set it:

    document.getElementById('selBank').selectedIndex = 4;

    But using "innerHTML" is nonsense! Why do you even think, that
    "innerHTML" is used to set the index?



    --
    Arno Welzel
    https://arnowelzel.de

    When you generate an option list dynamically and insert it with innerHTML

    Yes - than it *is* HTML.

    But the index is *not* HTML! It is just a number which you assign to the property "selectedIndex".

    The "dynamically generated id selBank" is not available from main
    Thus your suggested.
    document.getElementById("selBansk").selectedIndex = 1;

    Will not work...

    That's why I also suggested adding the "selected" attribute for the
    selected option when you generate the HTML code.


    --
    Arno Welzel
    https://arnowelzel.de
    --- Synchronet 3.17c-Linux NewsLink 1.110
  • From =?UTF-8?Q?Jonas_Th=C3=B6rnvall?=@jonas.thornvall@gmail.com to comp.lang.javascript on Thu Jun 27 01:59:00 2019
    From Newsgroup: comp.lang.javascript

    Den torsdag 27 juni 2019 kl. 10:53:25 UTC+2 skrev Jonas Thörnvall:
    Den torsdag 27 juni 2019 kl. 10:20:56 UTC+2 skrev Arno Welzel:
    On 27.06.19 08:00, Jonas Thörnvall wrote:

    I have tried
    document.getElementById('selBank').selectedIndex.innerHTML = 4 ;

    This is nonsense!

    You can either read it the index:

    myindex = document.getElementById('selBank').selectedIndex;

    or set it:

    document.getElementById('selBank').selectedIndex = 4;

    But using "innerHTML" is nonsense! Why do you even think, that
    "innerHTML" is used to set the index?



    --
    Arno Welzel
    https://arnowelzel.de

    When you generate an option list dynamically and insert it with innerHTML HTML document
    <div id="bankOptList"></div>
    Javascript
    document.getElementById("bankOptList").innerHTML=bankOptionString;

    The "dynamically generated id selBank" is not available from main
    Thus your suggested.
    document.getElementById("selBansk").selectedIndex = 1;

    Will not work...
    This is just one of a million negative effects of the parent->child methodology used for dynamically generate "HTML text";
    It probably has some uses, but sometimes dynamically generated HTML is just HTML precisely like dynamic pages created in PHP.
    I am not interested in the structure, i just want some fucking text inserted. --- Synchronet 3.17c-Linux NewsLink 1.110
  • From Arno Welzel@usenet@arnowelzel.de to comp.lang.javascript on Thu Jun 27 11:00:40 2019
    From Newsgroup: comp.lang.javascript

    On 27.06.19 10:43, Jonas Thörnvall wrote:

    Den torsdag 27 juni 2019 kl. 10:18:30 UTC+2 skrev Arno Welzel:
    On 27.06.19 07:51, Jonas Thörnvall wrote:
    Given i have an option list generated dynamically and then inserted to my main HTML file with using div.

    <div id="bankOptList"></div>

    And inserted using javascript.
    function bankOptionList(){
    bankOptNames="";
    bankSelect ="<font color=white><b>BANK:</b></font> <select id='selBank' onChange='bankSelection()'>\n";
    for (var r=0;r<bankName.length;r++){
    bankOption=bankName[r];
    //alert(bankName[r]);
    bankOptNames+="<option value="+r+"> "+r+" "+bankOption+"</option>\n";
    }
    bankOptEnd="</select> \n";
    bankOptionString=bankSelect+bankOptNames+bankOptEnd;
    //alert(bankOptionString);
    document.getElementById("bankOptList").innerHTML=bankOptionString;
    }


    How can i set selected index?

    By setting the "selected" attribute for the option, which should be
    selected intially.

    Also see:
    <https://developer.mozilla.org/de/docs/Web/HTML/Element/option>
    [...]
    The whole point with my post is that it does not work for innerHTML Arno.

    It DOES:

    For a selected element - and ONLY for this - use:

    if(r == my_selected_index) {
    selattr = " selected=\""selected\\"";
    } else {
    selattr = ""
    }

    bankOptNames+="<option value="+r+selattr+"> "+r" "+
    bankOption+"</option>\n";


    So the question is howto set the selected index for an option list "within a segment of innerHTML".

    See above. And you should really try to *LEARN* how to use JavaScript
    and HTML and not just do copy & paste.




    --
    Arno Welzel
    https://arnowelzel.de
    --- Synchronet 3.17c-Linux NewsLink 1.110
  • From Arno Welzel@usenet@arnowelzel.de to comp.lang.javascript on Thu Jun 27 11:01:35 2019
    From Newsgroup: comp.lang.javascript

    On 27.06.19 10:59, Jonas Thörnvall wrote:

    This is just one of a million negative effects of the parent->child methodology used for dynamically generate "HTML text";

    Then use the DOM to create elements! You don't have to use innerHTML at all.


    --
    Arno Welzel
    https://arnowelzel.de
    --- Synchronet 3.17c-Linux NewsLink 1.110
  • From =?UTF-8?Q?Jonas_Th=C3=B6rnvall?=@jonas.thornvall@gmail.com to comp.lang.javascript on Thu Jun 27 02:21:26 2019
    From Newsgroup: comp.lang.javascript

    Den torsdag 27 juni 2019 kl. 10:55:17 UTC+2 skrev Arno Welzel:
    On 27.06.19 10:53, Jonas Thörnvall wrote:

    Den torsdag 27 juni 2019 kl. 10:20:56 UTC+2 skrev Arno Welzel:
    On 27.06.19 08:00, Jonas Thörnvall wrote:

    I have tried
    document.getElementById('selBank').selectedIndex.innerHTML = 4 ;

    This is nonsense!

    You can either read it the index:

    myindex = document.getElementById('selBank').selectedIndex;

    or set it:

    document.getElementById('selBank').selectedIndex = 4;

    But using "innerHTML" is nonsense! Why do you even think, that
    "innerHTML" is used to set the index?



    --
    Arno Welzel
    https://arnowelzel.de

    When you generate an option list dynamically and insert it with innerHTML

    Yes - than it *is* HTML.

    But the index is *not* HTML! It is just a number which you assign to the property "selectedIndex".

    The "dynamically generated id selBank" is not available from main
    Thus your suggested.
    document.getElementById("selBansk").selectedIndex = 1;

    Will not work...

    That's why I also suggested adding the "selected" attribute for the
    selected option when you generate the HTML code.
    Honestly Arno why the fuck would one have to do that, and that will only work for initiation, you could never use it to select any

    --
    Arno Welzel
    https://arnowelzel.de
    Well i retract everything i said... It works perfectly well.
    It was some months since i wrote the code and now i found, in code. defaultBank=0;
    document.getElementById("selBank").selectedIndex = defaultBank; ListBankInstruments(defaultBank);
    That is why it refused to change... It changed back...
    --- Synchronet 3.17c-Linux NewsLink 1.110
  • From Silvio@silvio@internet.com to comp.lang.javascript on Thu Jun 27 15:05:00 2019
    From Newsgroup: comp.lang.javascript

    On 27-06-19 11:00, Arno Welzel wrote:
    On 27.06.19 10:43, Jonas Thörnvall wrote:

    Den torsdag 27 juni 2019 kl. 10:18:30 UTC+2 skrev Arno Welzel:
    On 27.06.19 07:51, Jonas Thörnvall wrote:
    Given i have an option list generated dynamically and then inserted to my main HTML file with using div.

    <div id="bankOptList"></div>

    And inserted using javascript.
    function bankOptionList(){
    bankOptNames="";
    bankSelect ="<font color=white><b>BANK:</b></font> <select id='selBank' onChange='bankSelection()'>\n";
    for (var r=0;r<bankName.length;r++){
    bankOption=bankName[r];
    //alert(bankName[r]);
    bankOptNames+="<option value="+r+"> "+r+" "+bankOption+"</option>\n"; >>>> }
    bankOptEnd="</select> \n";
    bankOptionString=bankSelect+bankOptNames+bankOptEnd;
    //alert(bankOptionString);
    document.getElementById("bankOptList").innerHTML=bankOptionString;
    }


    How can i set selected index?

    By setting the "selected" attribute for the option, which should be
    selected intially.

    Also see:
    <https://developer.mozilla.org/de/docs/Web/HTML/Element/option>
    [...]
    The whole point with my post is that it does not work for innerHTML Arno.

    It DOES:

    For a selected element - and ONLY for this - use:

    if(r == my_selected_index) {
    selattr = " selected=\""selected\\"";
    } else {
    selattr = ""
    }

    bankOptNames+="<option value="+r+selattr+"> "+r" "+
    bankOption+"</option>\n";


    So the question is howto set the selected index for an option list "within a segment of innerHTML".

    See above. And you should really try to *LEARN* how to use JavaScript
    and HTML and not just do copy & paste.





    Save your breath. He understands nothing and just copy/pastes shit
    around. Explanation is lost on him, he only wants working code, which
    you provided already.
    --- Synchronet 3.17c-Linux NewsLink 1.110
  • From Arno Welzel@usenet@arnowelzel.de to comp.lang.javascript on Thu Jun 27 17:26:38 2019
    From Newsgroup: comp.lang.javascript

    On 27.06.19 11:21, Jonas Thörnvall wrote:

    Den torsdag 27 juni 2019 kl. 10:55:17 UTC+2 skrev Arno Welzel:
    [...]
    That's why I also suggested adding the "selected" attribute for the
    selected option when you generate the HTML code.

    Honestly Arno why the fuck would one have to do that, and that will only work for initiation, you could never use it to select any

    Well - you first asked how you can set the selected index when
    generating the options list. And this would be one solution.

    If you need to change the index afterwards - then use the selectedIndex property.

    However - you can also use the DOM to create a new select element with
    options as well and *then* using selectedIndex afterwards would work
    fine as well.

    As an example on how to manipulate the DOM: I did this on my own website
    to generate a dynamic chart on the fly:

    <https://arnowelzel.de/en/tools/statistics>

    See the source for how the generic placeholder gets replaced by the
    chart canvas if the browser is able to support canvas elements at all.

    Well i retract everything i said... It works perfectly well.
    It was some months since i wrote the code and now i found, in code.

    defaultBank=0;
    document.getElementById("selBank").selectedIndex = defaultBank; ListBankInstruments(defaultBank);

    That is why it refused to change... It changed back...

    Well - problem solved ;-)


    --
    Arno Welzel
    https://arnowelzel.de
    --- Synchronet 3.17c-Linux NewsLink 1.110