Delete selected item from DropdownList / Select List Using JQuery

In this article i will show you how to delete selected item from DropdownList/Select List Using JQuery. We all know that select/DropdownList contain option tag for value. So, the main logic behind the question is first to get the select list by using their id property then use option tag with selected attribute after that remove.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default10.aspx.cs" Inherits="Default10" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="Scripts/jquery-1.10.2.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script>

        $(function () {
            $("#btdel").bind("click", function () {
                $("#fruitlist option:selected").remove();
            });
                    });


    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <select id="fruitlist">

        <option value="1">Mango</option>
        <option value="2">Apple</option>
        <option value="3">Orange</option>
        <option value="4">Grapes</option>



    </select>
        <input type="button" id="btdel" value="Delete" />
    </div>
    </form>
</body>
</html>
Delete selected item from DropdownList / Select List Using JQuery Delete selected item from DropdownList / Select List Using JQuery Reviewed by Jacob Lefore on April 04, 2016 Rating: 5

No comments