Django/JavaScript: генерирование кода HTML

Question

мир. Я все еще новичок в Python и JavaScript, поэтому мой код и мои методы могут выглядеть немного странно для опытных разработчиков, но будем надеяться, что сегодня я узнаю кое-что.

У меня есть страница HTML, где некоторый код был создан Джанго:

Джанго код функции генерирование HTML таблица:

def calendar_days_define(cMonth, cYear): 
    Calendar = [] 
    calendarMatrix = calendar.monthcalendar(cYear, cMonth) 
     for element in calendarMatrix: 
      Calendar.append('<tr>') 
      weekday = 0 
      for i in element: 
       weekday += 1 
        if weekday > 5: 
         if i > 0: 
          Calendar.append('<td class="days_Weekends_days">{0}</td>'.format(i)) 
         else: 
          Calendar.append('<td class="days_Weekends_days"></td>') 
        else: 
         if i > 0: 
          Calendar.append('<td class="days_Works_days">{0}</td>'.format(i)) 
         else: 
          Calendar.append('<td class="days_Works_days"></td>') 
      Calendar.append('</tr>') 
     DoneCalendar = ''.join(Calendar) 
     DoneCalendar = '<table id="calendar_Inside_Changeable_Mesh">{0}</table>'.format(DoneCalendar) 
     return DoneCalendar 

Это создает хороший календарь, завернутый в HTML-таблице, как именно мне нужно Это. Проблема возникает, когда я хочу создать новую таблицу для другого месяца. Мне нужно создать новую таблицу календаря, поэтому я использую AJAX вызова JavaScript, чтобы Джанго генерировать мне новый код HTML таблицы, а затем заменить старую таблицу с новым:

function redrawCalendar(cMonth, cYear) { 
$.ajax({ 
    type: 'POST', 
    url: '/edit/ajax_change_calendar', 
    data: {cMonth: cMonth, cYear: cYear}, 
    success: function (data) { 
    $('#calendar_Inside_Changeable_Mesh').replaceWith(data); 
    } 
}) 
} 

Получить мне хороший новый стол но проблема в том, что я не могу получить доступ к этой новой таблице. Например:

$('.days_Work_days').css("color","red") 

больше не работает. Зачем? У меня возникает ощущение, что более подходящий метод заключается в том, чтобы генерировать код для таблицы JavaScript на стороне клиента, если это так, я буду переписывать его, но все же вопрос меня беспокоит. Если кто-нибудь может мне помочь, я бы очень признателен, спасибо.

UPDATE

Вот часть моего первоначального HTML страницы, где происходят изменения:

<table><tr><td> {{ defineCalendar|safe }} </td></tr></table> 

При загрузке страницы Джанго заполнить эту переменную с календарной таблицы с идентификатором = «calendar_Inside_Changeable_Mesh» и исходной страницы затем смотрит как

<table><tr><td> 
<table id="calendar_Inside_Changeable_Mesh"> ...a bunch of <tr> and <td> with days numbers as value... </table> 
</td></tr></table> 

я могу получить доступ к этой таблице в JS, как $ ('# calendar_Inside_Changeable_Mesh'). Например:

$('#calendar_Inside_Changeable_Mesh').css('border-collapse','collapse') 

Все в порядке. Когда я хочу создать новую таблицу календаря без перезагрузки всей страницы, я вызываю функцию ajax JS, которую я показал ранее. После этого HTML часть выглядит следующим образом:

<table><tr><td> 
<table id="calendar_Inside_Changeable_Mesh"> ...a bunch of <tr> and <td> with different days numbers as value... </table> 
</td></tr></table> 

Выглядит так же, но когда я снова к примеру:

$('#calendar_Inside_Changeable_Mesh').css('border-collapse','collapse') 

бездельники происходит.

JS происходит, когда я нажимаю кнопку:

$('#calendarBtn_Back').click(function() { 
    redrawCalendar(cMonth, cYear) 
)} 

Кнопка находится вне calendar_Inside_Changeable_Mesh таблицы, но внутри таблицы, которая содержит его.

FINAL UPDATE

Хорошо, что это было довольно глупым с моей стороны. Мне потребовалось 2 дня ради бога. Моя ошибка заключалась в том, что я не показывал вам, ребята, точно, что я делаю.Я сказал, что я использовал

$('#calendar_Inside_Changeable_Mesh').css('border-collapse','collapse') 

, когда в реальности это выглядело так:

var calendar_Inside_Changeable_Mesh = $('#calendar_Inside_Changeable_Mesh'); 

, а затем эта глобальная переменная использовалась в некоторой функции, как:

calendar_Inside_Changeable_Mesh.css('border-collapse','collapse'); 

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

Answer 1

Несколько возможностей я могу думать, вы должны устранить их один за другим:

• Bad HTML
• Сценарий работы с CSS никогда не был призван после замены HTML
селектор
• CSS неправильно или XPATH из целевой элемент DOM изменен

Используйте консоль отладки и вставьте дополнительную информацию, если вам нужна дополнительная помощь.

Answer 2

Причина, по которой эта строка не работает, состоит в том, что вы неправильно назвали имя класса.

$('.days_Work_days').css("color","red") 

В питона код, который вы ищете days_Works_day

if i > 0: 
    Calendar.append('<td class="days_Works_days">{0}</td>'.format(i)) 
else: 
    Calendar.append('<td class="days_Works_days"></td>') 

Измените JS быть:

$('.days_Works_days').css("color","red")