Блог

Главная - Вопросы по программированию - Turn.js

Turn.js

#javascript #jquery #ajax #asp.net-mvc #turn.js

Вопрос:

Я работал над turn.js но не нашел ни одного примера, касающегося загрузки динамических страниц с контентом через ajax, страница загружается, но не со всеми результатами json от контроллера

 lt;div class="sample-flipbook" id="BookViewer"gt;  lt;div id="book-js" class="text-center"gt;  lt;div class="hard"gt;  lt;img src="~/Theme/OtherAssets/Images/temp-img.jpg" class="img-fluid" style="width:100%; height:100%"gt;  lt;/divgt;  lt;div class="hard"gt;lt;/divgt;  lt;div id="Page-Loader"gt;lt;/divgt;  lt;div class="hard"gt;lt;/divgt;  lt;/divgt;  lt;/divgt;   lt;script type="text/javascript"gt;  $(document).ready(() =gt; {  $('#book-js').turn({  width: 900,  height: 600,  autoCenter: true  });  });  function LoadBook(HBID, ChapterNo, TableRef) {  $.ajax({  url: '@Url.Action("GetData", "Books")',  type: "GET",  data: { HadithBookID: HBID, ChapterNo: ChapterNo, TableRefNo: TableRef },  success: (response) =gt; {   console.log(response.length);  for (var i = 0; i lt; response.length; i  ) {  var Html = "lt;divgt;";  Html  = 'lt;p class="urdu-font-fm container-fluid mt-3"gt;'   response[i].ArabicText 'lt;/pgt;';  Html  = 'lt;p class="container-fluid"gt;'   (response[i].EnglishText != null ? response[i].EnglishText == null : "")   'lt;/pgt;';  Html  = 'lt;p class="urdu-font-fm container-fluid"gt;'   response[i].UrduText 'lt;/pgt;';  Html  = 'lt;p class="urdu-font-fm container-fluid"gt;'   (response[i].Language1 != null ? response[i].Language1 == null : "")   'lt;/pgt;';  Html  = "lt;/divgt;";   $('#Page-Loader').html(Html);  }  },  error: (response) =gt; { console.log(response); }  });  } lt;/scriptgt;

Комментарии:

1. $(‘#Загрузчик страниц’). html(Html); эта строка не работает?

2. Эта строка работает и загружает только 1 элемент массива на страницу, но мне нужна страница для каждого результата массива

3. Я изменил код, теперь он показывает все страницы, но поверх напишите первую страницу и последние 2 титульные страницы.

4. не понимаете, как переписать первую и последнюю страницы?

5. Извините за недопонимание, титульная страница на первый взгляд в порядке, но после привязки страниц из js титульные страницы были удалены с помощью .turn(«Добавить страницу»)

Ответ №1:

ты должен измениться

 $('#Page-Loader').html(Html);

эта строка для

 $('#Page-Loader').append(Html);

если использовать его внутри цикла для получения всего html в результате вывода. Теперь происходит то, что ваш предыдущий html заменяется новым html после завершения каждого цикла.

Метки: