Create a postback in javascript

Question

I have a Checkbox and a Dropdownlist (with a 'All' as first element) like so :

<td style="width: 15px">
   <asp:CheckBox ID="isAdvertiserFilter" runat="server" AutoPostBack="false"/>
</td>
<td style="width: 330px">
    <asp:DropDownList ID="AdvertiserFilterList" runat="server" DataTextField="Name" DataValueField="Id" AutoPostBack="true" Enabled="false"/>
</td>

The checkbox enable/disable the dropdownlist.

When enabled, the user can select any item in the list (All, Item1, Item2...) The event is handled in the code behind :

this.AdvertiserFilterList.SelectedIndexChanged += new EventHandler(SearchFilter);

So, when the user Uncheck the checkbox I want the dropdownlist to be set to 'All' and be disabled. In my javascript when I set to "All" (value -1, index 0) It doesn't trigger the event of the code behind to call my SearchFilter function.

$(document).on({
click: function (event) {
    if ($(event.target).is('#isAdvertiserFilter'))
    {
        // Enable or disable the dropdowlist
        $('select[id*="AdvertiserFilterList"]').attr("disabled", !$('input[id*="isAdvertiserFilter"]').prop("checked"));
        // When UNcheck
        if (!$('input[id*="isAdvertiserFilter"]').prop("checked")) {
            // Set to the dropdownlist to All
            $('select[id*="AdvertiserFilterList"]').val("-1");
            // Trying to fire the event
            $('select[id*="AdvertiserFilterList"]').trigger("change");

        }
    }
},
});

How to call my codebehind or trigger the event as if the user did it ?

I want to PostBack only when the checkbox is UNcheck (and not check) or when the dropdowlist 'SelectIndexChanged'

Possible duplicate of [ASP.NET postback with JavaScript](https://stackoverflow.com/questions/1305954/asp-net-postback-with-javascript) — Liam, Nov 29 '18 at 09:12

score 0 · Answer 1 · answered Nov 29 '18 at 09:15

You will need to enable Auto Postback property from Visual Studio for any control that you want to call the code behind.

But beware, that auto-postback events will cause your Page Load to get executed again. If in your logic, you are populating this combo box, you will lose the selected value and will propably end up with a duplicated set of values.

To fix that, you also need to work with isPostBack page variable

if (!isPostBack) {
 .. code to populate combo box
} else {
    .. code to handle user selection
}

I would like to avoid a postback on my checkbox just for enabling a checkbox — Benoît, Nov 29 '18 at 09:18

score 0 · Answer 2 · answered Nov 29 '18 at 09:58

To fire the PostBack whenever I wanted I still set the AutoPostBack property to False and In Javascript :

$(document).on({
click: function (event) {
    if ($(event.target).is('#isAdvertiserFilter'))
    {
        $('select[id*="AdvertiserFilterList"]').attr("disabled", !$('input[id*="isAdvertiserFilter"]').prop("checked"));
        // When The checkbox is Uncheck
        if (!$('input[id*="isAdvertiserFilter"]').prop("checked")) {
            // Do a PostBack
            __doPostBack($('input[id*="isAdvertiserFilter"]'), '');
        }
    }
},

});

In the code behind I reset the dropdownlist value :

private void AdvertiserFilterCheckChanged(object sender, EventArgs e)
    {
        AdvertiserFilterList.Enabled = isAdvertiserFilter.Checked;
        if (!isAdvertiserFilter.Checked)
        {
            AdvertiserFilterList.SelectedIndex = -1;
            FindByFilter();
        }
    }

Create a postback in javascript

2 Answers2