2

У меня есть форма, в которую ввожу ид.

        <form onsubmit="return false" action="" method="GET">
            <fieldset class="intrigue">
                <legend>
                    <h3>Укажите steamID</h3>
                </legend>
                <input placeholder='Введите steamID' id="SteamId" name="SteamId" type="text" value="">
                <input placeholder='Отправить' type='submit'>
            </fieldset>
        </form>

Затем ajax, который посылает на сервер запрос(ссылка + ид).

$(document).on('submit', 'form', function () {

    var UserId = $('input[name=SteamId]').val();
    if (UserId.length > 0) {
        alert('Всё норм!');
        SubmitForm(UserId);
    } else {
        alert("Вы забыли указать имя");
    }
});

function SubmitForm(UserId) {
    $.ajax({
        method: "GET",
        url: "http://project-megaroks931128.codeanyapp.com/users/add/?usersid=" + UserId,
        dataType: "jsonp";
    })
}

Приходит массив данных в json

{
    "steamid": "76561198049827777",
    "communityvisibilitystate": 3,
    "profilestate": 1,
    "personaname": "tlmcmerty",
    "lastlogoff": 1503799076,
    "profileurl": "http://steamcommunity.com/profiles/76561198049827777/",
    "avatar": "https://steamcdn-a.akamaihd.net/steamcommunity/public/images/avatars/fe/fef49e7fa7e1997310d705b2a6158ff8dc1cdfeb.jpg",
    "avatarmedium": "https://steamcdn-a.akamaihd.net/steamcommunity/public/images/avatars/fe/fef49e7fa7e1997310d705b2a6158ff8dc1cdfeb_medium.jpg",
    "avatarfull": "https://steamcdn-a.akamaihd.net/steamcommunity/public/images/avatars/fe/fef49e7fa7e1997310d705b2a6158ff8dc1cdfeb_full.jpg",
    "personastate": 0,
    "realname": "joshua tree",
    "primaryclanid": "103582791429521408",
    "timecreated": 1317492330,
    "personastateflags": 0,

Как мне вывести в мою таблицу содержимою таблицу например поле steamid?

   <table>
      <tr>
         <th>SteamID</th>
         <td>Что сюда писать?</td>
      </tr>
    </table>
1
  • "все смешалось в доме Облонских" ©
    – teran
    28 ноя 2017 в 10:18

1 ответ 1

0

Если кратко, то добавить к ячейке идентификатор а-ля

 <td id="steam-id">Что сюда писать?</td>

а ajax-вызов замените на что-то вроде

$.getJSON("http://project-megaroks931128.codeanyapp.com/users/add/?usersid=" + UserId,
          function(data){
             console.log(data.steamid);
             $("td#steam-id").text(data.steamid);
          }
    });

либо подобный обратный вызов прикрутить к исходному $.ajax-запросу.

А вообще, заметьте, что посути вам вообще не нужна <form> в принципе, еще и с перекрытием onsubmit ибо данные вы отправляете все равно аяксом независимо от формы. input поле можно разместит и вне формы.
А в результирующей таблице у вас странным образом соседствуют th и td.


Итого, у вас должен быть инпут для ввода, кнопка для отправки, и еще поле для вставки значения.

<input type="text" id="steamId"/>
<a href="#" id="check">Отправить</a>
<span id="steam-id-result"></span>

а также код наподобие следующего

$("#check").click(function(e){
     e.preventDefault();
     var sid = $("#steamId").val().trim();
     if(!sid){
         alert(....);
         return;
     }
     $.getJSON("...", function(data){
         $("#steam-id-result").text(data.steamid);
     });
});
7
  • у меня такая проблема что даже console.log(JSON.parse(data.steamid)); не выводит в консоль
    – MegaRoks
    28 ноя 2017 в 11:02
  • ответ то приходит вообще? функция сам по себе выполнется? поставьте там точку остановка да посмотрите что на входе.
    – teran
    28 ноя 2017 в 11:06
  • Вот вкладке network отображаются данные, что я указывал в теме выше
    – MegaRoks
    28 ноя 2017 в 11:17
  • те же самые что и по ссылке project-megaroks931128.codeanyapp.com/users/add/…
    – MegaRoks
    28 ноя 2017 в 11:18
  • а json.parse вы зачем вызываете при выводе в консоль?
    – teran
    28 ноя 2017 в 11:23

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.