Работа с огромными фрагментами HTML-строк в JavaScript может очень быстро стать очень некрасивой. По этой причине, возможно, стоит подумать о «движке шаблонов» JavaScript. Они не должны быть сложными - посмотрите этот Резига.
Если вы не готовы к этому, то, вероятно, можно просто продолжить, как есть. Просто помните, что манипуляции с DOM обычно довольно медленны по сравнению со строками.
Пример этого разрыва в производительности:
// DOM manipulation... slow
var items = ['list item 1', 'list item 2', 'list item 3'];
var UL = $('<ul/>');
$.each(items, function(){
UL.append('<li>' + this + '</li>');
});
// String manipulation...fast
var items = ['list item 1', 'list item 2', 'list item 3'];
var UL = $('<ul/>').append( '<li>' + items.join('</li><li>') + '</li>' );
Возможно, не самый популярный подход.
Создайте HTML-код в серверной части. Диалог будет в скрытом div css. Если вы хотите, чтобы он "всплывал", просто примените разные стили CSS и измените скрытое входное значение (я предполагаю, что диалог взаимодействует с этой определенной датой).