Uncaught Error: не может вызывать методы до инициализации;

Question

Я звоню форму в всплывающем окне с помощью bootbox

bootbox.alert(myform, function() { 
    }).find("div.modal-dialog").addClass("largeWidth"); 

в форме есть аа палитра Collor подборщика (эвол ColorPicker)

$(document).ready(function() { 
    $("#cd_bundle_entitiesbundle_call_Color").colorpicker(); 
}); 

В первый раз форма всплывающее окно открывает палитру для цвета выбрать дисплеи в порядке, но только за один раз. После этого, если я закрою всплывающее окно и откройте его снова, когда нажимаем для палитры выбора цвета, получив ошибку
Ошибка при отсутствии: не удается вызвать методы на colorpicker до инициализации; пытался вызвать метод

Чтение подобные вопросы «hidePalette» Я думаю, что я ве уничтожить bootbox всплывающее окно, так в обратного вызова bootbox пытался $ (это) .empty или $ (это) .remove(), но не работали

Это моя форма в HTML-файл с некоторыми JS

<div class="col-lg-6"> 

     {{ form_start(form, {'action': path('calls_edit_exec'),'attr': {'class': 'callform'} }) }} 
     <fieldset> 

      {{ form_errors(form) }} 
      <div class="row"> 
       <label class="col-md-3">Requestor</label> 
       <label class="input col-md-5">{{ form_widget(form.Requestor) }}</label> 
       <span id="inforeq" class="inforeq fade info alert-success" ></span> 

      </div> 

      <div class="row"> 
       <label class="col-md-3">CallStatus</label> 
       <label class="input col-md-5">{{ form_widget(form.CallStatus) }}</label> 
      </div> 

      <div class="row"> 
       <label class="col-md-3">Color</label> 
       <label class="input col-md-5">{{ form_widget(form.Color) }}</label> 
      </div> 

      <span class="fade"> 
       <input id="mycolor" class="colorPicker evo-cp0" /> 
      </span> 

      <div class="row"> 
       <label class="col-md-3">AssignedTo</label> 
       <label class="input col-md-5">{{ form_widget(form.AssignedTo) }}</label> 
       <span id="infouser" class="infouser fade info alert-success" ></span> 
      </div> 

      <div class="row"> 
       <label class="col-md-3">Category</label> 
       <label class="input col-md-5">{{ form_widget(form.CallCategory) }}</label> 
       <span id="infouser" class="infouser fade info alert-success" ></span> 
      </div> 

      <div class="row col-lg-12"> 
       <div class="row"> 
        <label class="col-md-3">Call Problem</label> 
       </div> 
       <div class="row"> 
        <label class=" textarea col-md-12">{{ form_widget(form.CallProblem) }}</label> 
       </div> 
       <div class="row"> 
        <label class="col-md-3">Call Solution</label> 
       </div> 
       <div class="row" > 
        <label class="textarea col-md-12">{{ form_widget(form.CallSolution) }}</label> 
       </div> 
       <div class=" form-control"> 
        <input class="form" type="checkbox" name="createready" id="createready">Make this Ready Call/Solution<br> 
       </div> 
      </div> 

     </fieldset> 
     {{ form_end(form) }} 
    </div> 
<script> 
     $(document).ready(function() { $("#cd_bundle_entitiesbundle_call_Color").colorpicker(); 
    }); </script> 

с нажмите форму возвращается из АЯКСА вызова

$.ajax({ 
           url: url, 
           success: function (data) { 
            bootbox.alert(data, function() { 

             // $this.empty(); 
            }).find("div.modal-dialog").addClass("largeWidth"); 

           } 
          }); 

Чтобы получить форму в всплывающих им USI нг bootbox

Answer 1

Я предполагаю, что вы используете это для загрузки модального с удаленными содержимым:

$.ajax({ 
    url: url, 
    success: function (data) { 
     bootbox.alert(data, function() { 
      // $this.empty(); 
     }).find("div.modal-dialog").addClass("largeWidth"); 
    } 
}); 

Если да, то я хотел бы использовать метод show.bs.modal как точки, где вы вызвать ColorPicker:

$.ajax({ 
    url: url, 
    success: function (data) { 
     bootbox.alert({ 
      message: data, 
      callback: function() { 
       // do something when dismissing the alert 
      }, 
      className: 'largeWidth' 
     }) 
     .on('show.bs.modal', function(){ 
      $("#cd_bundle_entitiesbundle_call_Color").colorpicker(); 
     }); 

    } 
}); 

Я также подстроил ваш пример, чтобы использовать объект опций, как показано на рисунке documentation.

Стоит отметить, что есть size options для Bootstrap модальностей как из 3.1.0, который можно применять, как вы были с вашим largeWidth класса, или вы можете использовать эквивалентную size вариант, как указано в документации Bootbox I, связанных с ранее ,