WedX - журнал о программировании и компьютерных науках

JavaScript перестает работать после частичного обновления

Я разместил JavaScript на панели обновлений в надежде, что он запустится. Один конкретный сценарий применяет загрузочную разбивку на страницы к сетке. Однако при нажатии кнопки страницы и обновлении панели обновления сценарий перестает работать, и кнопки возвращаются к ссылкам. Я пробовал несколько вещей, таких как переключение режима панели обновлений на «всегда», к сожалению, ничего не работает.

Я не силен, когда дело доходит до JavaScript. Было бы очень признательно, если бы вы могли чем-то помочь.

    <asp:UpdatePanel ID="UpdatePanel13" runat="server" UpdateMode="Always" >

             <ContentTemplate>

          <script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
    <!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script> 
        <script src="Scripts/js/bs.pagination.js"> </script>


             </ContentTemplate>

         </asp:UpdatePanel>

С кнопками

без кнопок


  • возможный дубликат Выполнение скрипта после панели обновления AJAX asp.net 11.03.2015
  • Я проверил ссылку, которую вы предоставили, но я не разбираюсь в java-скрипте, поэтому я не знаю, как его применять. пожалуйста помоги 11.03.2015
  • @ user3052409, можете ли вы обновить свой вопрос, объяснив, почему это не дубликат? Если вы не можете решить это с помощью другого вопроса, возможно, вам потребуется дополнительная информация, но какая именно? 11.03.2015
  • Я посмотрел на другой вопрос, и в нем говорится, что нужно применить этот код ‹script› ///‹summary› /// Это будет срабатывать при начальной загрузке страницы, /// и всех последующих частичных обновлениях страниц, выполненных /// любой панелью обновлений на странице ///‹/summary› function pageLoad(){ alert('страница загружена!') } ‹/script› 11.03.2015
  • будет ли это единственное, что мне нужно сделать, чтобы скрипты в панели обновлений работали? 11.03.2015

Ответы:


1

У вас должен быть включен скрипт вне панели обновления, поместите его обратно в тег head.

Вы можете попробовать вручную вызвать javascript, вы можете сделать это следующим образом:

protected void Page_Load(object sender, EventArgs e)
{
    [...]
    ScriptManager.RegisterStartupScript(this, typeof(UpdatePanel), Guid.NewGuid().ToString(), "NameOfFunctionToInitialiseJavaScript()", true);
    [...]
}

NameOfFunctionToInitialiseJavaScript(), вероятно, должно быть pageLoad() или что-то другое, что использует bs.pagination.js.

ОТРЕДАКТИРОВАНО ДОБАВИТЬ:

Существует еще одно решение, взятое из здесь: добавьте некоторые стили css либо на страницу, либо в отдельный файл CSS (не добавляйте в Bootstrap.css, изменять его в случае изменения неразумно):

.pagination-ys {
    /*display: inline-block;*/
    padding-left: 0;
    margin: 20px 0;
    border-radius: 4px;
}

.pagination-ys table > tbody > tr > td {
    display: inline;
}

.pagination-ys table > tbody > tr > td > a,
.pagination-ys table > tbody > tr > td > span {
    position: relative;
    float: left;
    padding: 8px 12px;
    line-height: 1.42857143;
    text-decoration: none;
    color: #dd4814;
    background-color: #ffffff;
    border: 1px solid #dddddd;
    margin-left: -1px;
}

.pagination-ys table > tbody > tr > td > span {
    position: relative;
    float: left;
    padding: 8px 12px;
    line-height: 1.42857143;
    text-decoration: none;    
    margin-left: -1px;
    z-index: 2;
    color: #aea79f;
    background-color: #f5f5f5;
    border-color: #dddddd;
    cursor: default;
}

.pagination-ys table > tbody > tr > td:first-child > a,
.pagination-ys table > tbody > tr > td:first-child > span {
    margin-left: 0;
    border-bottom-left-radius: 4px;
    border-top-left-radius: 4px;
}

.pagination-ys table > tbody > tr > td:last-child > a,
.pagination-ys table > tbody > tr > td:last-child > span {
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
}

.pagination-ys table > tbody > tr > td > a:hover,
.pagination-ys table > tbody > tr > td > span:hover,
.pagination-ys table > tbody > tr > td > a:focus,
.pagination-ys table > tbody > tr > td > span:focus {
    color: #97310e;
    background-color: #eeeeee;
    border-color: #dddddd;
}

Затем все, что вам нужно сделать, это добавить стиль в GridView:

<asp:GridView ID="MyGridView" runat="server">
    <PagerStyle CssClass="pagination-ys" />
</asp:GridView>
11.03.2015
  • Я взял код из файла java-скрипта и поместил его в раздел заголовка между тегами скрипта, и это сработало. Во всяком случае, ваш ответ приведет меня в правильном направлении. Спасибо брада! 11.03.2015
  • Новые материалы

    Как проанализировать работу вашего классификатора?
    Не всегда просто знать, какие показатели использовать С развитием глубокого обучения все больше и больше людей учатся обучать свой первый классификатор. Но как только вы закончите..

    Работа с цепями Маркова, часть 4 (Машинное обучение)
    Нелинейные цепи Маркова с агрегатором и их приложения (arXiv) Автор : Бар Лайт Аннотация: Изучаются свойства подкласса случайных процессов, называемых дискретными нелинейными цепями Маркова..

    Crazy Laravel Livewire упростил мне создание электронной коммерции (панель администратора и API) [Часть 3]
    Как вы сегодня, ребята? В этой части мы создадим CRUD для данных о продукте. Думаю, в этой части я не буду слишком много делиться теорией, но чаще буду делиться своим кодом. Потому что..

    Использование машинного обучения и Python для классификации 1000 сезонов новичков MLB Hitter
    Чему может научиться машина, глядя на сезоны новичков 1000 игроков MLB? Это то, что исследует это приложение. В этом процессе мы будем использовать неконтролируемое обучение, чтобы..

    Учебные заметки: создание моего первого пакета Node.js
    Это мои обучающие заметки, когда я научился создавать свой самый первый пакет Node.js, распространяемый через npm. Оглавление Глоссарий I. Новый пакет 1.1 советы по инициализации..

    Забудьте о Matplotlib: улучшите визуализацию данных с помощью умопомрачительных функций Seaborn!
    Примечание. Эта запись в блоге предполагает базовое знакомство с Python и концепциями анализа данных. Привет, энтузиасты данных! Добро пожаловать в мой блог, где я расскажу о невероятных..

    ИИ в аэрокосмической отрасли
    Каждый полет – это шаг вперед к великой мечте. Чтобы это происходило в их собственном темпе, необходима команда астронавтов для погони за космосом и команда технического обслуживания..


    Для любых предложений по сайту: [email protected]