我有两个模型
class Properties(models.Model):
property_name = models.CharField(max_length=100)
property_type = models.CharField(choices=TYPE, max_length=50)
property_location = models.CharField(max_length=100)
county = models.CharField(choices=COUNTY, max_length=50)
number_of_units = models.IntegerField()
date_created = models.DateField(auto_now_add=True)
last_modified = models.DateField(auto_now=True)
def __str__(self):
return self.property_name
class Meta:
verbose_name_plural = "Properties"
class RentalUnits(models.Model):
unit_number = models.CharField(max_length=10)
property = models.ForeignKey(Properties, on_delete=models.CASCADE)
no_of_bedrooms = models.IntegerField(default=0)
no_of_bathrooms = models.IntegerField(default=0)
rent_per_month = models.IntegerField(default=0)
status = models.CharField(max_length=20, choices=STATUS)
date_created = models.DateField(auto_now_add=True)
last_modified = models.DateField(auto_now=True)
def __str__(self):
return self.unit_number
class Meta:
verbose_name_plural = 'Units'
以及它们对应的序列化器
class PropertiesSerializers(serializers.ModelSerializer):
class Meta:
model = Properties
fields = '__all__'
class RentalUnitsSerializers(serializers.ModelSerializer):
property = serializers.SerializerMethodField()
class Meta:
model = RentalUnits
fields = ('id', 'unit_number', 'property', 'no_of_bedrooms', 'no_of_bathrooms', 'rent_per_month', 'status',)
我想在数据表中显示他们的外键名称而不是 ID，我在这里找到了一个很好的解决方案，所以我最终使用
def to_representation(self, instance):
rep = super(RentalUnitsSerializers, self).to_representation(instance)
rep['property'] = instance.property.property_name
return rep
它给了我这个
{
"id": 12,
"unit_number": "1A",
"property": 1,
"no_of_bedrooms": 3,
"no_of_bathrooms": 2,
"rent_per_month": 60000,
"status": "Occupied"
},
{
"id": 12,
"unit_number": "1A",
"property": "New Apartments",
"no_of_bedrooms": 3,
"no_of_bathrooms": 2,
"rent_per_month": 60000,
"status": "Occupied"
},
添加单位和删除单位仍然可以正常工作。当我想编辑出租单元的详细信息时，我的问题出现了。我正在使用 jQuery 和 AJAX 通过 API 填充我的数据表和表单。添加def to_representation(self, instance):到 Rental Unit 序列化程序后，数据表将填充外键名称，但在加载编辑表单时属性字段留空，并且外键字段名称不会出现在该输入字段中。但是，当我删除它时def to_representation(self, instance):，属性输入字段和数据表将填充属性外键并成功编辑恢复。这是我用于编辑的 jQuery 代码：
//Edit Units API
$('#RentalUnits-Records').on('click', '.update', function(e){
e.preventDefault();
let id = $(this).attr('id');
$('input[id=unitID]').val(id);
console.log(id)
let myurl = "http://127.0.0.1:8000/api/units/"+id+"/";
$.ajax({
async: true,
url:myurl,
method:'GET',
success: function(result){
$('input[name="unit_number"]').val(result.unit_number);
$('input[name="property"]').val(result.property);
$('input[name="no_of_bedrooms"]').val(result.no_of_bedrooms);
$('input[name="no_of_bathrooms"]').val(result.no_of_bathrooms);
$('input[name="rent_per_month"]').val(result.rent_per_month);
$('select[name="status"]').val(result.status);
}
});
$( "#u-number" ).change(function() {
$('input[name=unit_number]').val($(this).val());
});
$( "#u-property" ).change(function() {
$('input[name=property]').val($(this).val());
});
$( "#u-bedrooms" ).change(function() {
$('input[name=no_of_bedrooms]').val($(this).val());
});
$( "#u-bathrooms" ).change(function() {
$('input[name=no_of_bathrooms]').val($(this).val());
});
$( "#u-rent" ).change(function() {
$('input[name=rent_per_month]').val($(this).val());
});
$( "#u-status" ).change(function() {
$('select[name=status]').val($(this).val());
});
});
//Save Edited Rental Unit Button
$(function() {
$('#editUnit').on('submit', function(e) {
e.preventDefault();
let id = $("#unitID").attr("value");
console.log(id);
let myurl = "http://127.0.0.1:8000/api/units/edit/"+id+"/";
$.ajax({
type : 'PUT',
url : myurl,
data : $("#editUnit :input").serializeArray(),
dataType: "json",
success: function(data){
alert("Unit Details Updated!");
location.reload();
},
error:function(data){
alert("Unit Details Not Updated!");
location.reload();
}
});
});
});
});
和编辑表格：
<form id="editUnit" action="">
{% csrf_token %}
<div class="mb-3">
<input type="hidden" id="unitID" value="">
</div>
<div class="mb-3">
<label>Unit Number</label>
<input type="text" class="form-control" name="unit_number" id="u-number" placeholder="Unit Number">
</div>
<div class="mb-3">
<label>Associated Property</label>
<input type="number" class="form-control" name="property" id="u-property" placeholder="Property" readonly>
</div>
<div class="mb-3">
<label>No. of Bedrooms</label>
<input type="number" class="form-control" name="no_of_bedrooms" id="u-bedrooms" placeholder="No. of Bedrooms">
</div>
<div class="mb-3">
<label>No. of Bathrooms</label>
<input type="number" class="form-control" name="no_of_bathrooms" id="u-bathrooms" placeholder="No. of Bathrooms">
</div>
<div class="mb-3">
<label>Rent</label>
<input type="number" class="form-control" name="rent_per_month" id="u-rent" placeholder="Rent Per Month">
</div>
<div class="mb-3">
<label>Status</label>
<select class="form-select" name="status" id="u-status" aria-label="Default select example" placeholder="Associated Property">
<option selected disabled>Status</option>
<option value="Occupied">Occupied</option>
<option value="Under Maintenance">Under Maintenance</option>
<option value="Vacant">Vacant</option>
</select>
</div>
<div class="mb-3">
<button class="btn btn-soft-success btn-sm" id="u-edit" type="submit">Save Changes</button>
<button class="btn btn-soft-secondary btn-sm" type="button" data-bs-dismiss="modal">Cancel</button>
</div>
</form>
问题：如何在数据表和模态编辑表单中显示Foreign Key field name而不是，ID但仍保留property_id在数据库中。我在某处读到使用字符串而不是 ID 使用外部字段是不好的做法？
还有助于弄清楚如何在dropdown list有多个属性的情况下显示属性将有助于允许用户更改它。截至目前其readonly. 对此的任何帮助将不胜感激。谢谢你。