Question

我有我的Spring-Boot Web应用程序。我有使用jquery的javascript函数，该函数在单击时发送get请求。我想使用ID从响应到HTML“值”的解析JSON对象。相反，我将使用GET Request中的默认地址在浏览器中打印JSON对象。

这是控制器返回的实体：

@Data
@NoArgsConstructor
@AllArgsConstructor(access = AccessLevel.PUBLIC)
@Entity
@Table(name = "offers")
@JsonIgnoreProperties({"hibernateLazyInitializer", "handler"})
public class Offer {

    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    @Column(name = "id")
    private int id;

    @Column(name = "productionyear", nullable = false)
    private int productionYear;
    @Column(name = "carbrand", nullable = false)
    private String carBrand;
    @Column(name = "cartype", nullable = false)
    private String carType;
    @Column(name = "carmodel", nullable = false)
    private String carModel;
    @Column(name = "fueltype", nullable = false)
    private String fuelType;
    @Column(name = "enginesize", nullable = false)
    private int engineSize;
    @Column(name = "doorsquantity", nullable = false)
    private int doorsQuantity;
    @Column(name = "price")
    private BigDecimal price;
    @ManyToOne
    @JoinColumn(name = "userid", nullable = false)
    private User user;
    @ManyToOne
    @JoinColumn(name = "agentid", nullable = false)
    private Agent agent;

    @Override
    public String toString() {
        return String.format("Offer[id=%d], [productionYear=%d], carBrand='%s', carModel='%s', " +
                        "fuelType='%s', engineSize='%s', [doorsQuantity='%d'], [userId='%d'], [agentid='%d']",
                getId(), getCarBrand(), getCarModel(), getFuelType(), getEngineSize(), getDoorsQuantity(), getUser().getId(), getAgent().getId());
    }
}

这是Controller方法：

@GetMapping("findOne")
@ResponseBody
public Offer findOne(Integer id){
    return offerRepository.getOne(id);
}

这是我的.js函数：

$(document).ready(function (){
    $('.table .eBtn').on('click', function(event){
        event.preventDefault();
        var href = $(this).attr('href');
        $.get(href, function(data){
            $('.calculationForm #id').val(data.id);
            $('.calculationForm #productionYear').val(data.productionYear);
            $('.calculationForm #carBrand').val(data.carBrand);
            $('.calculationForm #carModel').val(data.carModel);
            $('.calculationForm #carType').val(data.carType);
            $('.calculationForm #fuelType').val(data.fuelType);
            $('.calculationForm #engineSize').val(data.engineSize);
            $('.calculationForm #doorsQuantity').val(data.doorsQuantity);
        });
        $('.calculationForm #calculationModal').modal();
    });
});

这里是HTML，我想将数据解析为：

<div class="calculationForm">
    <form th:action="save" method="POST">
        <div class="modal fade" id="calculationModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
             aria-hidden="true">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title" id="calculationModalLabel">Wyceń zapytanie</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <div class="form-group">
                            <label for="id" class="col-form-label">Id:</label>
                            <span class="form-control" id="id" value=""></span>
                        </div>
                        <div class="form-group">
                            <label for="productionYear" class="col-form-label">Rok produkcji samochodu:</label>
                            <span class="form-control" id="productionYear" value=""></span>
                        </div>
                        <div class="form-group">
                            <label for="carBrand" class="col-form-label">Marka samochodu:</label>
                            <span class="form-control" id="carBrand" value=""></span>
                        </div>
                        <div class="form-group">
                            <label for="carModel" class="col-form-label">Model samochodu:</label>
                            <span class="form-control" id="carModel" value=""></span>
                        </div>
                        <div class="form-group">
                            <label for="carType" class="col-form-label">Rodzaj samochodu:</label>
                            <span class="form-control" id="carType" value=""></span>
                        </div>
                        <div class="form-group">
                            <label for="fuelType" class="col-form-label">Rodzaj paliwa:</label>
                            <span class="form-control" id="fuelType" value=""></span>
                        </div>
                        <div class="form-group">
                            <label for="engineSize" class="col-form-label">Pojemność silnika:</label>
                            <span class="form-control" id="engineSize" value=""></span>
                        </div>
                        <div class="form-group">
                            <label for="doorsQuantity" class="col-form-label">Liczba drzwi:</label>
                            <span class="form-control" id="doorsQuantity" value=""></span>
                        </div>
                        <div class="form-group">
                            <label for="price" class="col-form-label">Cena ubezpieczenia:</label>
                            <input class="form-control" id="price" name="price" type="text"/>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                        <input type="submit" class="btn btn-primary" value="save">Wyceń</input>
                    </div>
                </div>
            </div>
        </div>
    </form>
</div>

这是结果： result 我期望的结果就像这个视频中的37:03： https://www.youtube.com/watch?v=lIgFe20dYq4

使用jquery将JSON值解析为HTML值，而不是将其作为字符串打印在空白面上

0 个答案: