2016-02-28 3 views
-1

У меня есть сервер Node.js, который читает JSON-файл, и в нем много информации. Один из них - это идентификатор человека, у меня есть окно поиска на моей странице HTML. Я хочу, чтобы для jQuery был нужен jquery-метод (ajax) для клиентской стороны, чтобы определить, совпадает ли идентификатор, который пользователь помещает в поле поиска, как ID в JSON, если я хочу вернуть некоторую информацию об этом человеке, скажем, имя и имя пользователя пользователя.Результат поиска окна == Json result

Примечание: я уверен, что работает файл server.js на 100%.

Пожалуйста, помогите мне, я как бы новичок в JQuery.

Я до сих пор;

$(document).ready(function(){ 
    $("#id_of_the_search_box_button").click(function (any_function_variable_name) { 
    $.ajax({ 
     type: 'GET', 
     url: '/url_of_the_related_server_side', 
     dataType: 'json' 
     }) 
      .done(function(data){ 
       console.log(data); 
       alert(JSON.stringify(data)); 

       data.forEach(function (any_function_variable_name) { 

       if(any_function_variable_name.search_box_ID == any_function_variable_name.name_in_the_JSON_file_for_one_of_the_searched_ID){ 

        $userElement = $("<li>").html("<strong>ID: </strong>" + any_function_variable_name.id); //id is defined in JSON and I was able to use in another part of the jquery 
        $userBlock = $("<ul>") 
         .append(
          $("<li>").html("<strong>Name: </strong>" + any_function_variable_name.name) //name of the user 
         ) 
         .append(
          $userElement 
         ) 
         .append(
          $("<li>").html("<strong>User User Name: </strong>" + any_function_variable_name.userName) 
         ); 
                    $any_function_variable_nameBlock.insertAfter("#search"); 
      } 
      }); 
    });})}) 

Примечание: Я не знаю, могу ли я закрыть кронштейны вправо.

Заранее благодарен!

+0

Можете ли вы предоставить структуру своего json-файла? Выборочные данные помогут ... –

+0

[{... "ID": 37595960858, "in_reply_to_screen_name": нулевой, "пользователь": { \t "Идентификатор": 2384451, \t "id_str": "238678" , \t "name": "Doga I", \t "screen_name": "IDoga", ... "Идентификатор": 65739068412, "in_reply_to_screen_name": нулевой, "пользователь": { \t "Идентификатор": 2878009, \t "id_str": "235678", \t "имя": "Джон Доу", \t «user_name»: «JD», ... }] Идентификатор, который пользователь записывает в поле поиска, должен совпадать с идентификатором, который отсутствует у пользователя. –

+0

PS: Я не использую выразить –

ответ

0

Я предполагаю, что вы ищете что-то вроде, как показано ниже ...

Вместо того, чтобы вызов Ajax, я написал со статическими данными, как показано ниже ...

HTML

<input id="searchBox" type="text" /> 
<button id="id_of_the_search_box_button"> 
Search 
</button> 

<ul> 

</ul> 

JS

var data = [ 
    { 
    "id": 37595960858, 
    "in_reply_to_screen_name": null, 
    "user": { 
     "id": 2384451, 
     "id_str": "238678", 
     "name": "Doga I", 
     "screen_name": "IDoga" 
    } 
    }, 
    { 
    "id": 65739068412, 
    "in_reply_to_screen_name": null, 
    "user": { 
     "id": 2878009, 
     "id_str": "235678", 
     "name": "Jon Doe", 
     "user_name": "JD" 
    } 
    } 
]; 


$(document).ready(function(){ 
    $("#id_of_the_search_box_button").click(function (any_function_variable_name) { 

    var searchText = parseInt($('#searchBox').val()); 


    data.forEach(function (any_function_variable_name) { 

     if(any_function_variable_name.id === searchText){ 

     $("ul") 
      .append('<li> <strong>ID: </strong>' + any_function_variable_name.user.id) 
      .append('<li> <strong>User Name: </strong>' + any_function_variable_name.user.user_name) 
      .append('<li> <strong>Name: </strong>' + any_function_variable_name.user.name) 
      .append('<li> <strong>Screen Name: </strong>' + any_function_variable_name.user.screen_name); 

     } //End if 

    }); //End forEach 

    }); 
}); 

, который делает ваш Ajax вызов, как это ...

$(document).ready(function(){ 
    $("#id_of_the_search_box_button").click(function (any_function_variable_name) { 
    $.ajax({ 
     type: 'GET', 
     url: '/url_of_the_related_server_side', 
     dataType: 'json' 
    }) 
    .done(function(data){ 


     var searchText = parseInt($('#searchBox').val()); 


     data.forEach(function (any_function_variable_name) { 

     if(any_function_variable_name.id === searchText){ 

      $("ul") 
      .append('<li> <strong>ID: </strong>' + any_function_variable_name.user.id) 
      .append('<li> <strong>User Name: </strong>' + any_function_variable_name.user.user_name) 
      .append('<li> <strong>Name: </strong>' + any_function_variable_name.user.name) 
      .append('<li> <strong>Screen Name: </strong>' + any_function_variable_name.user.screen_name); 

     } //End if 

     }); //End forEach 



    }); 
    }); 
}); 

Ниже приводится стельку

https://jsfiddle.net/rrtbz4bo/7/

Введите 37595960858 в поле поиска и нажмите поиск.

UPDATE: вызвать/найти/идентификатор ID = ... апи напрямую, если он возвращает данные, такие как

{ 
    "id": 37595960858, 
    "in_reply_to_screen_name": null, 
    "user": { 
     "id": 2384451, 
     "id_str": "238678", 
     "name": "Doga I", 
     "screen_name": "IDoga" 
    } 
    } 

Тогда должно работать.

$(document).ready(function(){ 
    $("#id_of_the_search_box_button").click(function (any_function_variable_name) { 
    $.ajax({ 
     type: 'GET', 
     //Or whatever your URL structure is 
     url: 'http://127.0.0.1:5230/find/id?Id=' + $('#searchBox').val(), 
     dataType: 'json' 
    }) 
    .done(function(data){ 
     $("ul") 
     .append('<li> <strong>ID: </strong>' + data.user.id) 
     .append('<li> <strong>User Name: </strong>' + data.user.user_name) 
     .append('<li> <strong>Name: </strong>' + data.user.name) 
     .append('<li> <strong>Screen Name: </strong>' + data.user.screen_name); 
    }); 
    }); 
}); 

Если это не сработает, отправьте скрипач, и я попытаюсь заставить его работать.

Надеюсь, это поможет ...

+0

Это не сработало, я думаю, что проблема больше, чем я думаю. Спасибо за попытку. Если вы не возражаете, можете ли вы написать общую структуру, потому что, когда я использую 127.0.0.1:5230/find/id? ... и вместо этого записываю идентификатор записи ... Я вижу правильный ответ на терминале/консоли (У меня есть console.log()). Проблема в том, что мой jquery ajax должен видеть, что значение поля поиска сравнивает это значение со значениями в JSON, и если они совпадают, они должны возвращать информацию этого человека. Еще раз спасибо –

+0

Затем удалите цикл forEach и задайте URL-адрес ajax, например .... url: ' http://127.0.0.1:5230/find/id?Id=' + $ ('# searchBox') .val() Ie Непосредственно вызовите api с id. –

+0

Вы также можете напрямую использовать http://api.jquery.com/jquery.getjson/ вместо $ .post, если хотите –