Блог

У меня есть веб-проект MVC3, который включает в себя очень простую форму поиска. Он использует ненавязчивый AJAX для возврата фрагмента HTML, содержащего результаты в табличной форме, и заменяет существующую таблицу. Моя проблема в том, что я хочу использовать jQuery-плагин DataTables в таблице для сортировки, подкачки и т.д. Но я не могу понять правильный способ вызова кода инициализации подключаемого модуля в таблице.

На данный момент у меня есть вот что (this.Html.Script — это просто метод расширения, который я написал для автоматической генерации тегов скрипта):

Search.cshtml:

 @section ScriptSection 
{
    @this.Html.Script("libs/jquery.unobtrusive-ajax.min.js")
    @this.Html.Script("libs/jquery.validate.js")
    @this.Html.Script("libs/jquery.validate.unobtrusive.js")
    @this.Html.Script("libs/jquery.dataTables.js")

    <script type="text/javascript">
        function initTable() {
            $("table.datatable").dataTable();
        }
    </script>
}

@using ( this.Ajax.BeginForm("DoSearch", "Case", new AjaxOptions
{
    HttpMethod = "GET",
    InsertionMode = InsertionMode.Replace,
    UpdateTargetId = "results",
    OnSuccess = "initTable"
}) )
{
    <button type="submit" name="SearchType" value="date">Search</button>
}

<table id="results" class="datatable">
</table>
  

Проблема в том, что initTable(), по-видимому, вызывается перед тем, как нужная мне таблица фактически находится в DOM. Результатом является то, что таблица результатов вставляется на страницу полностью без стиля и ни с одной из включенных функций DataTable.

Правильно ли я это делаю, или есть другой способ запустить jQuery после обновления DOM?

поместите свой код в:

$(документ).готово(функция() {
 / Вызывается обработчик для .ready().
});

и посмотрите, поможет ли это вам — тогда DOM должен быть полностью загружен.

Блин, глупая ошибка. jQuery DataTables нуждается в тегах, которые я не использовал. Извините за шум.