Untitled

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
<div>
    <p>localhost:58949</p>
    <p>134.249.120.107</p>
    <input type="text" id="carId"/>
    <input type="text" id="baseUrl"/>
</div>
<div>
    <input type="file" name="upload" id="uploadCarImage"/><br/>
    <button id="submitCarImage">Загрузить изображение автомобиля</button>
</div>
<hr/>
<div>
    <input type="file" name="upload" id="uploadExternalInspection"/><br/>
    <button id="submitExternalInspection">Загрузить внешние повреждения</button>
</div>
<hr/>
<div id="images">
    <img id="externalInspectionImage"/>
    <img id="carImage"/>
    <button type="button" id="ShowImage">Show Images</button>
</div>

<script src="https://code.jquery.com/jquery-3.2.1.min.js"
        integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
        crossorigin="anonymous">
</script>

<!-- Upload Images-->
<script type="text/javascript">


    $('#submitCarImage').on('click',
        function(e) {
            e.preventDefault();
            var files = document.getElementById('uploadCarImage').files;
            if (files.length > 0) {
                if (window.FormData !== undefined) {
                    var data = new FormData();
                    for (var x = 0; x < files.length; x++) {
                        data.append("file" + x, files[x]);
                    }

                    var carId = $('#carId').val();
                    var url = $('#baseUrl').val();

                    $.ajax({
                        type: "POST",
                        url: 'http://' + url + '/api/CarImages/Upload/' + carId,
                        contentType: false,
                        processData: false,
                        data: data,
                        success: function(result) {
                            alert(result);
                        },
                        error: function(xhr, status, p3) {
                            alert(status);
                        }
                    });
                } else {
                    alert("Браузер не поддерживает загрузку файлов HTML5!");
                }
            }
        });

    $('#submitExternalInspection').on('click',
        function(e) {
            e.preventDefault();
            var files = document.getElementById('uploadExternalInspection').files;
            if (files.length > 0) {
                if (window.FormData !== undefined) {
                    var data = new FormData();
                    for (var x = 0; x < files.length; x++) {
                        data.append("file" + x, files[x]);
                    }

                    var carId = $('#carId').val();
                    var url = $('#baseUrl').val();

                    $.ajax({
                        type: "POST",
                        url:
                            'http://' + url + '/api/ExternalInspections/Upload/' + carId,
                        contentType: false,
                        processData: false,
                        data: data,
                        success: function(result) {
                            alert(result);
                        },
                        error: function(xhr, status, p3) {
                            alert(status);
                        }
                    });
                } else {
                    alert("Браузер не поддерживает загрузку файлов HTML5!");
                }
            }
        });
</script>

<!-- View Images-->
<script>

</script>

</body>
</html>