Отображение HTML таблицы внутри DIV с помощью Javascript переключателя заявление

Я работаю на отображение таблицы, где перечислены вещи, основываясь на том, что состояние было выбрано в HighMaps во время детализировать:Отображение HTML таблицы внутри DIV с помощью Javascript переключателя заявление

фрагмент кода:

   switch (e.point.name) { 
        case 'California': 
         $('#table').html(''); 
         break; 
        case 'Virginia': 
         $('#table').html(''); 
         break; 
        default: 
         $('#table').html(''); 
         break; 
       } 
<div id="table"></div>

таблица динамически генерируется путем взятия данных из БД для каждого состояния с использованием PHP. Структура таблицы выглядит следующим образом:

<div class="container"> 
      <div class="row"> 
       <div class="col-md-12"> 
        <div class="panel panel-primary"> 
         <div class="panel-heading"> 
          <h3 class="panel-title text-center">Company List - State</h3> 
         </div> 
         <table class="table table-hover" id="dev-table"> 
          <thead> 
           <tr> 
            <th>Company Name</th> 
            <th>County</th> 
            <th>Details</th> 
           </tr> 
          </thead> 
          <tbody> 
           <tr> 
            <td>Company 1</td> 
            <td>Test County</td> 
            <td>Company details.</td> 
           </tr> 
           <tr> 
            <td>Company 2</td> 
            <td>Test County</td> 
            <td>Company details.</td> 
           </tr> 
            <td>Company 3</td> 
            <td>Test County</td> 
            <td>Company details.</td> 
           </tr> 
          </tbody> 
         </table> 
        </div> 
       </div> 
      </div> 
     </div>

Сгенерированная таблица, которая делает внутри .html («») выглядит следующим образом:

$('#table').html('<div class="container"> <div class="row"><div class="col-md-12"><div class="panel panel-primary"><div class="panel-heading"><h3 class="panel-title text-center">Company List - California</h3></div><table class="table table-hover" id="dev-table"><thead><tr><th>Company Name</th><th>County</th><th>Details</th></tr></thead><tbody><tr><td>Company 1</td><td>Test County</td><td>Company details are available to ACMA members only.</td></tr><tr><td>Company 2</td><td>Test County</td><td>Company details are available to ACMA members only.</td></tr><td>Company 3</td><td>Test County</td><td>Company details.</td></tr></tbody></table></div></div></div></div>');

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

Есть ли ограничение на количество символов, которые могут войти внутрь .html(); ? Есть ли более эффективный способ отображения этих таблиц?

источник

2015-02-10 user3088202

Ну, есть пятьдесят штатов. Поэтому предварительная работа в памяти всегда быстрее. Создайте таблицу в памяти с помощью 'documentFragment' и добавьте ее в' table'. – Mouser

Спасибо. Есть ли примерный фрагмент, на который я мог бы взглянуть? Мои знания JS очень ограничены, но когда я вижу примеры, я могу забрать их довольно быстро. – user3088202

Вы строите HTML на PHP? Он возвращается через AJAX? – Mouser

Как использовать функцию добавления в определенном селекторе, например, тот, который вы используете в настоящее время $ ("# table"). Append(); проверьте ссылку, указанную ниже:

http://api.jquery.com/append/

источник

2015-02-10 23:21:52

Отображение HTML таблицы внутри DIV с помощью Javascript переключателя заявление

ответ

Смежные вопросы