Класс Css переходит в исходное состояние, когда срабатывает панель обновления asp.net

Привет, у меня есть блок управления поиском, который отображается только тогда, когда я нажимаю на тег привязки для отображения блока поиска. В то же время, когда я меняю значок фильтра, помещенный в тег привязки, он обновляется до значка закрытия. Я достиг этого, используя метод toggleClass. Моя проблема заключается в том, что всякий раз, когда панель обновления обновляет свое содержимое или происходит обратная передача, значок сбрасывается до первого значка фильтра, что не соответствует логике его собственного существования. Обратите внимание, что я добавил все эти элементы управления в панель обновления asp.net. Вот мой фрагмент кода.

 <asp:UpdatePanel runat = "server" ID = "Up1">
        <ContentTemplate>

            <div class = "row">
                <div class = "col-lg-4">
                </div>
                <div class = "col-lg-4">
                </div>
                <div class = "col-lg-4 text-right">
                    <a id = "SearchControl" href = "#"><i id = "SearchIcon" class = "fa fa-filter"></i>&nbsp;Search</a>
                </div>
            </div>
            <div id = "filterControlDiv" class = "row">
                <div class = "col-lg-12 bg-secondary" style = "height: 150px;">
                </div>

            </div>
            <div class = "row">
                <div class = "col-lg-12">
                    <asp:GridView runat = "server" ID = "grdAirportList" AllowPaging = "true" PageSize = "5" AutoGenerateColumns = "true">
                    </asp:GridView>
                </div>
            </div>
        </ContentTemplate>
    </asp:UpdatePanel>

и используемый сценарий,

 [![<script>
        $(function () {
            InitialSearch();

            $('#SearchControl').click(function ()
            {
                $('#filterControlDiv').slideToggle();
                $('#SearchIcon').toggleClass("fa-filter fa-times");
            });
        });
        var prm = Sys.WebForms.PageRequestManager.getInstance();
        prm.add_endRequest(function () {
            $('#SearchControl').click(function () {
                $("#filterControlDiv").slideToggle();
                $('#SearchIcon').toggleClass("fa-filter fa-times");
            });
        }); 
        function InitialSearch() {
            $('#filterControlDiv').hide();
        }
    </script>][1]][1]

Заранее спасибо. Класс Css переходит в исходное состояние, когда срабатывает панель обновления asp.net

Класс Css переходит в исходное состояние, когда срабатывает панель обновления asp.net

Как конвертировать HTML в PDF с помощью jsPDF
Как конвертировать HTML в PDF с помощью jsPDF
В этой статье мы рассмотрим, как конвертировать HTML в PDF с помощью jsPDF. Здесь мы узнаем, как конвертировать HTML в PDF с помощью javascript.
0
0
427
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Поскольку это только изменение на стороне клиента, сервер не распознает его и возвращает обратно к оригиналу. Вы должны либо изменить это со стороны сервера, либо переместить часть за пределы панели обновлений. Я предполагаю, что вы используете панель обновлений для просмотра сетки, так что вы можете просто это сделать.

<asp:UpdatePanel runat = "server" ID = "Up1">
   <ContentTemplate>
       <div class = "row">
         <div class = "col-lg-12">
            <asp:GridView runat = "server" ID = "grdAirportList" AllowPaging = "true" PageSize = "5" AutoGenerateColumns = "true">
             </asp:GridView>
         </div>
      </div>
   </ContentTemplate>
</asp:UpdatePanel>

Другие вопросы по теме