How to prevent a dropdownlist from postback or upd

Question

How to prevent a dropdownlist from postback or updating inside an updatepanel when button is clicked. I am doing this because i have java script to make ddl a searchable dropdownlist. i have a few labels, textboxes, gridviews and dropdownlist inside an update panel. when i click view button dropdownlist turns back into normal dropdown insteads of searchable dropdown.

<div>
    <asp:DropDownList ID="ddlSector" runat="server" Width="150px"></asp:DropDownList>
    <asp:DropDownList ID="ddlCity" runat="server" Width="150px"></asp:DropDownList>
    <asp:TextBox ID="txtStdID" runat="server" Width="92px" MaxLength="5"></asp:TextBox>
    <asp:Button ID="btnView" runat="server" Text="View" onclick="btnView_Click" AccessKey="V"/>
<table>
    <tr><td><b>Qualification</b></td><td><b>Exemption Type</b></td></tr>
    <tr>              
    <td><asp:DropDownList ID="ddlQualification" class="chzn-select" runat="server" Width="225px" onselectedindexchanged="ddlQualification_SelectedIndexChanged" 
    AutoPostBack="false"></asp:DropDownList></td>
    <td>
    <asp:DropDownList ID="ddlExemType" runat="server" Width="225px">
    </asp:DropDownList></td>        
    </tr>
</table>
</div>
<script src="../Searchable DDL/jquery.min.js"type="text/javascript"></script>  
<script src="../Searchable DDL/chosen.jquery.js"type="text/javascript"></script>  
<script type="text/javascript">
     $(".chzn-select").chosen(); 
 $(".chzn-select-deselect").chosen({ allow_single_deselect: true });</script>

Answer 1

Even though there is no full PostBack, everything inside the UpdatePanel still gets refreshed and so the DOM loses the elements that were modified with jquery.

You need to call the function that created the searchable dropdownlists after a async PostBack also.

<script type="text/javascript">
    $(document).ready(function () {
        createSearchDropDown();
    });

    var prm = Sys.WebForms.PageRequestManager.getInstance();

    prm.add_endRequest(function () {
        createSearchDropDown();
    });

    function createSearchDropDown() {
        $(".chzn-select").chosen(); 
        $(".chzn-select-deselect").chosen({ allow_single_deselect: true });
    }
</script>

Answer 2

Write your javascript function in pageLoad event of javascript.

It will always be executed in postback as well as partial postbacks also.

Find below code for your functions

 function pageLoad() {
             //This will ensure your code will run all the time
             CreateDropdown();
             InitializeDatePickers();
             AssignPlugins();

        }