The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Doesn't work in chrome - Select+JavaScript
James432213
post Mar 16 2019, 08:44 PM
Post #1





Group: Members
Posts: 7
Joined: 16-March 19
Member No.: 26,853



Hi the follow code doesn't work in Chrome but it does in Internet Explorer, in that when option "W30 L30" is picked, "Low stock" doesn't display like it does in IE . Any ideas?
Thank you

CODE
        <select id="myJeanSize">      
            <option value="" onclick="checkStock();">Please select</option>
            <option value="Not in stock" onclick="checkStock();" disabled="disabled">W26 L30 - Not available</option>
            <option value="" onclick="checkStock();">W26 L32</option>
            <option value="" onclick="checkStock();">W28 L30</option>
            <option value="" onclick="checkStock();">W28 L32</option>
            <option value="" onclick="checkStock();">W29 L30</option>
            <option value="" onclick="checkStock();">W29 L32</option>
            <option value="Low stock" onclick="checkStock();">W30 L30</option>
            <option value="Not in stock" onclick="checkStock();" disabled="disabled">W30 L32 - Not available</option>
            <option value="Not in stock" onclick="checkStock();" disabled="disabled">W30 L34 - Not available</option>
            <option value="" onclick="checkStock();">W31 L30</option>
            <option value="Only a few left!" onclick="checkStock();">W31 L32</option>
            <option value="" onclick="checkStock();">W31 L34</option>
            <option value="Not in stock" onclick="checkStock();" disabled="disabled">W32 L30 - Not available</option>
            <option value="" onclick="checkStock();">W32 L32</option>
            <option value="" onclick="checkStock();">W32 L34</option>
            <option value="Not in stock" onclick="checkStock();" disabled="disabled">W33 L30 - Not available</option>
            <option value="Low stock" onclick="checkStock();">W33 L32</option>
            <option value="Not in stock" onclick="checkStock();" disabled="disabled">W33 L34 - Not available</option>
            <option value="Only a few left!" onclick="checkStock();">W34 L30</option>
        </select>
        
        <p id="stockLevel"></p>
        
        <script>
            function checkStock(){
             var displayResult = document.getElementById("stockLevel");
             var mySelection = document.getElementById("myJeanSize").value;
            
             displayResult.innerHTML=mySelection;
            }
        </script>


This post has been edited by James432213: Mar 16 2019, 08:45 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
CharlesEF
post Mar 16 2019, 09:23 PM
Post #2


Programming Fanatic
********

Group: Members
Posts: 1,672
Joined: 27-April 13
From: Edinburg, Texas
Member No.: 19,088



Try moving the onclick action from the <option> to the <select> element.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
James432213
post Mar 16 2019, 09:39 PM
Post #3





Group: Members
Posts: 7
Joined: 16-March 19
Member No.: 26,853



QUOTE(CharlesEF @ Mar 17 2019, 03:23 PM) *

Try moving the onclick action from the <option> to the <select> element.


Yes! it works, and it makes the code tidier too.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
CharlesEF
post Mar 17 2019, 12:43 AM
Post #4


Programming Fanatic
********

Group: Members
Posts: 1,672
Joined: 27-April 13
From: Edinburg, Texas
Member No.: 19,088



Glad it worked out for you. Yes, the <select> element supports the onclick action, not the <option> element.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
2 User(s) are reading this topic (2 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 19th October 2019 - 11:33 PM