在 <script> 中的 Django 模板中从模型数据创建数组答案

【问题标题】：Create Array from Model Data in Django Template in <script>在 <script> 中的 Django 模板中从模型数据创建数组
【发布时间】：2022-10-04 19:06:24
【问题描述】：

我正在尝试使用 JQuery 日期选择器，并且我想使用 beforeShowDay 方法来阻止日期选择器中的日期。我已经能够让小部件工作，如果我定义了一个数组，那么 beforeShowDay 方法可以完美地工作。但我的问题是从我的 Django 模型中传递数据以创建一个数组。有没有办法在模板中的元素内创建一个数组来实现这一点？

模板

 <script>
            # works as intended when the array is defined manually
            var array = [
              "2022-10-01"
            ]

            # this is where I am having trouble creating an array from the model data
            var array = [
              {% for x in listing_reservations %}
                {{x.dates}}
              {% endfor %}
            ]

            $(function() {
              $( "#id_start_date" ).datepicker(
                {
                  beforeShowDay: function(date){
                    var string = jQuery.datepicker.formatDate('yy-mm-dd', date);
                    return [ array.indexOf(string) == -1 ];
                }
                }
              );
            });
</script>

【问题讨论】：

标签： javascript python django

【解决方案1】：

如果我理解正确，您只需要数组中的实例日期。您可以尝试创建一个空数组并用值填充它

var array = [];

{% for x in listing_reservations %}
array.push({{x.dates}})
{% endfor %}

如果这不起作用，请尝试将 {{x.dates}} 分配到另一个变量中，然后将该变量附加到您的数组中

【讨论】：

谢谢回复。我试过 var array = []; {% for x in listing_reservations %} date = {{x.dates}} array.push(date) {% endfor %}。但是，我收到一个错误“意外的数字'1'。在''之后需要一个属性名称。我认为这可能是因为日期格式，因为它们是日期中的逗号。例如日期 = 1 月 1 日， 2022，这就是为什么它没有添加到数组中。它正在调用正确的数据，但没有附加到数组中。我尝试了 date = Date({{x.dates}}) ，但出现了同样的错误。
认为我更接近 {% for x in listing_reservations %} date = new Date({{x.start_date|date:'m/d/y'}}); array.push(日期); {% endfor %}。日期现在返回并创建一个数组，但是数组中的所有日期都是 Wed Dec 31 1969 19:00:00 GMT-0500 (EST)。
当您尝试将“django 日期格式”引入 javascript 时，就会发生这种情况。如果对您有帮助，您可以尝试查看 stackoverflow.com/questions/27869606/… 这个。

【解决方案2】：

终于弄明白了，希望对以后的人有所帮助！感谢 Haduki 的帮助 :)

          <script>

            var array = [];

            {% for x in reservations %}
              var date = new Date("{{x.isoformat}}").toISOString().split('T')[0];
              array.push(date);
            {% endfor %}

            console.info(array)

            $(function() {
              $( "#id_start_date" ).datepicker(
                {
                  beforeShowDay: function(date){
                    var string = jQuery.datepicker.formatDate('yy-mm-dd', date);
                    return [ array.indexOf(string) == -1 ];
                }
                }
              );
            });

          </script>

【讨论】：