How To Remove Option From Select Using JavaScript?


Share:
Published By: Admin, Published On: Nov 09, 2021, Category: Javascript


Hello Friends,

Now let's see example of how to remove option from select example. We will check how to get remove option from select. This is a short guide on get remove option from select in javascript. Let's get started with how to get remove option from select in javascript.

Here i will give you many example how to get remove option from select using javascript.

Example : 1
<!DOCTYPE html>
<html>
    <head>
        <title>How To Remove Option From Select Using JavaScript? - MyWebtuts.com</title>
        <meta name = "viewport" content = "width = device-width, initial-scale = 1">
    </head>
    <body>		   
        <h3>How To Remove Option From Select Using JavaScript? - MyWebtuts.com</h3>                                
        <form id = "frm">
            <select id = "a1">
                <option value = Laravel> Laravel </option>
                <option value = JavaScript > JavaScript </option>
                <option value = Jquery > Jquery </option>
                <option value = PHP > PHP </option>
                <option value = HTML > HTML </option>
                <option value = CSS > CSS </option>
                <option value= C > C </option>
            </select>

            <input type = "button" onclick = "remove()" value = "Remove" >
        </form>
        <p>Select and click the button to remove the selected option.</p>

        <script>
            function remove() {
                var b = document.getElementById("a1");
                b.remove(b.selectedIndex);
            }
        </script>
    </body>
</html>  
Output :
Select and click the button to remove the selected option.
Select JavaScript and click on button:
Laravel
Jquery
PHP
HTML
CSS
C
Example : 2
<!DOCTYPE html>
<html>
    <head>
        <title>How To Remove Option From Select Using JavaScript? - MyWebtuts.com</title>
        <meta name = "viewport" content = "width = device-width, initial-scale = 1">
    </head>
    <body>         
        <h3>How To Remove Option From Select Using JavaScript? - MyWebtuts.com</h3>                                
        <form id = "test">
            <select id = "x1">
                <option value = BCA> BCA </option>
                <option value = Bsc.it > Bsc.it </option>
                <option value = MCA > MCA </option>
                <option value = BBA > BBA </option>
                <option value = MBA > MBA </option>
            </select>

            <input type = "button" onclick = "remove()" value = "Remove" >
        </form>
        <p>Select and click the button to remove the selected option.</p>

        <script>
            function remove() {
                var x2 = document.getElementById("x1");
                x2.remove(x2.selectedIndex);
            }
        </script>
    </body>
</html>    
Output :
Select and click the button to remove the selected option.
Select BBA and click on button:
BCA
Bsc.it
MCA
MBA

It will help you...

Share: