Блог

Я пытаюсь создать простую форму с одним текстовым полем и кнопкой отправки, которая при нажатии отправляет значение в метод $.getJSON, который извлекает ответ JSON и выводит его на веб-страницу.

Могу ли я в любом случае сделать это динамически, используя AJAX и PHP? Нужно ли мне использовать метод $ .ajax для отправки значения на страницу PHP или я могу просто изменить существующий метод.

 $.getJSON(
    "https://www.googleapis.com/shopping/search/v1/public/products?callback=?",
    {
        key: "keyhere", 
        country: "US", 
        q: searchterm, 
        alt: "json" 
    },
    function(data) {

        $.each(data.items, function(i, item){

            if (item.product.images.length > 0) // sanity check
            {

            //global variables
            var link = item.product.images[0]['link'];
            var title = item.product.title;

                var listData = "<li>"   title   "</li>"   '<img title="'   title   '" src="'   link   '" />';

                $('#lists').append(listData);

                var img = $("<img/>").attr("src", link);
                $("<a/>").attr({href: link, title: "image title"}).append(img).appendTo("#images");

                console.log(data)
            }
        });
    }
);
  

Редактировать:

Благодаря SBerg413 мне удалось изменить метод на .ajax, и он отлично работает, рабочий пример ниже:

 var apiKey = "key";
var country = "US";
var apiurl = "https://www.googleapis.com/shopping/search/v1/public/products?callback=?";
var search = 'starwars';

$.ajax({
    url: apiurl,
    dataType: 'jsonp',
    data : 
    {
        key: apiKey, 
        country: country, 
        q: search,
    },
    success: function(data) {

         $.each(data.items, function(i, item){

            if (item.product.images.length > 0) // sanity check
            {

            //global variables
            var link = item.product.images[0]['link'];
            var title = item.product.title;

                var listData = "<li>"   title   "</li>"   '<img title="'   title   '" src="'   link   '" />';

                $('#lists').append(listData);

                var img = $("<img/>").attr("src", link);
                $("<a/>").attr({href: link, title: "Courtesy of James"}).append(img).appendTo("#images");

                console.log(data)
            }
        });


        // console.log(data);
        console.log(data)
    }
});
  

Метод jQuery getJSON — это просто сокращение для метода ajax(). http://api.jquery.com/jQuery.getJSON / Итак, вы должны быть в состоянии использовать либо то, либо другое. Однако метод getJSON использует GET . Итак, если вы конкретно хотите использовать POST, вам лучше использовать метод ajax() .