当尝试基于由另一个下拉列表(我们称之为一个)更改触发的Django模型更新我的下拉列表(元素)时,我遇到了一个问题。
我遵循了这个教程:https://simpleisbetterthancomplex.com/tutorial/2018/01/29/how-to-implement-dependent-or-chained-dropdown-list-with-django.html
当我更改下拉列表A时,我得到以下错误:
Uncaught TypeError: $.ajax is not a function
基于类似的问题,我确保在我的脚本之前包含这一行:
<script type="text/javascript" src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
而且我没有使用jQuery的slim版本。
下面是下拉列表A和JS的HTML代码中负责更新第二个下拉列表的部分。
<select id="my-selection" dropdown-data-url="{% url 'ajax_get_data' %}">
<option value="1">First Option</option>
<option value="2">Second Option</option>
</select>
<script>
$(document).ready(function() {
$("#my-selection").change(function () {
var url = $("#my-selection").attr("dropdown-data-url"); // get the url of the proper view
var my_selection = $(this).val(); // get the selected input from dropdown
$.ajax({
url: url,
data: {
'selection': my_selection // add selected option to the GET parameters
},
success: function (data) {
$("#second-dropdown-selection").html(data);
}
});
});
});
</script>
如有任何建议,我将不胜感激。
可能您在ajax调用中错过了类型(get/post
$.ajax({
url: url,
type:'get', //add this
data: {
'selection': my_selection
},
success: function (data) {
$("#second-dropdown-selection").html(data);
}
});