Как использовать для каждого в JQuery и показать в таблице HTML - PullRequest
Новая
       13

Как использовать для каждого в JQuery и показать в таблице HTML

0 голосов
/ 21 октября 2019

В настоящее время проблема заключается в том, что полный список названий моих фильмов отображается в первой строке моей таблицы. Я хочу, чтобы они разделились. Мне нужно как-то разбить их на отдельные элементы, но я не могу найти хороших примеров для работы. (К вашему сведению, я довольно новичок в JavaScript / JQuery) 

<body>

    <table id="content">
        <tr>
            <td></td>
        </tr>
    </table>

    <form>
        TITLE:<br>
        <input type="text" id="inputTitle" value="" placeholder="Title"><br>
        RELEASE DATE:<br>
        <input type="text" id="inputRelease" value="" placeholder="Release"><br>
        DIRECTOR:<br>
        <input type="text" id="inputDirector" value="" placeholder="Director"><br>
        GENRE:<br>
        <input type="text" id="inputGenre" value="" placeholder="Genre"><br>
    </form>   
    <br><br>
    <button id='button'>Add Movie</button>

<script>

$(document).ready(function(){

    $.get("https://moviesfrontandback.herokuapp.com/api/movies/", function(data){
        var i;
        for (i = 0; i < data.length; i++) {
            $('#content').append(data[i].title)    
        }
    });

    $('#button').click(function(){
        title = $('#inputTitle').val()
        releaseYear = $('#inputRelease').val()
        director = $('#inputDirector').val()
        genre = $('#inputGenre').val()
        WriteToAPI()
    })

    WriteToAPI = function(){
        $.post('https://moviesfrontandback.herokuapp.com/api/movies/', {
            title: title,
            releaseYear: releaseYear,
            director: director,
            genre: genre,
        }, function(data, status){
            alert("Title:\t\t" + title + "\nRelease:\t" + releaseYear + "\nDirector:\t" + director + "\nGenre:\t\t" + genre)
        } )
    }

    });

</script>

</body>
</html>

1 Ответ

1 голос
/ 21 октября 2019

Вам нужно установить HTML для таблицы, а не просто добавить заголовок. Примерно так ... 

$.get("https://moviesfrontandback.herokuapp.com/api/movies/", function(data){
    var html = '';
    for (var i = 0; i < data.length; i++) {
        //Append a new row
        html += '<tr><td>' + data[i].title + '</td></tr>'    
    }
    //Overwrite the table html
    $('#content').html(html);
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...