Places image inside an array

Asked

Viewed 360 times

2

How can I place an image inside an array, so that it also appears in auto-complete?

jquery 

$(document).ready(function() {
    $("#country").typeahead({
        source: function(b, a) {
            $.ajax({
url: "fetch.php",
method: "POST",
data: {
    query: b
},
dataType: "json",
success: function(c) {
    var json = JSON.parse(c);
    $.each(json, function(i, data) { $("#country").prepend(data); } );
}
})

        }
    })
});

error that reorders

(index):802 Array(170)[0 … 99]0: "gld 2001"1: "gld 2011"2: "gld 2012"3: "gld 2015"4: "gld 2019"5: "gld 2062"6: "gld 2089"7: "gld 2101"8: "gld 2102"9: "gld 2123"10: "gld 2125"11: "gld 2126"12: "gld 2127"13: "gld 2128"14: "gld 2130"15: "gld 2134"16: "gld 2135"17: "gld 2148"18: "gld 2149"19: "gld 2150"20: "gld 2151"21: "gld 2152"22: "gld 2155"23: "gld 2159"24: "gld 2162"25: "gld 2182"26: "gld 2189"27: "gld 2193"28: "gld 2194"29: "gld 2195"30: "gld 2196"31: "gld 2213"32: "gld 2214"33: "gld 2223"34: "gld 2231"35: "gld 2232"36: "gld 2233"37: "gld 2249"38: "gld 2251"39: "gld 2254"40: "gld 2265"41: "gld 2273"42: "gld 2274"43: "gld 2290"44: "gld 2291"45: "gld 2296"46: "gld 2299"47: "gld 2321"48: "gld 2325"49: "gld 2327"50: "gld 2328"51: "gld 2330"52: "gld 2340"53: "gld 2352"54: "gld 2361"55: "gld 2370"56: "gld 2378"57: "gld 2384"58: "gld 2389"59: "gld 2392"60: "gld 2393"61: "gld 2394"62: "gld 2396"63: "gld 2397"64: "gld 2400"65: "gld 2402"66: "gld 2403"67: "gld 2406"68: "gld 2407"69: "gld 2413"70: "gld 2415"71: "gld 2417"72: "gld 2420"73: "gld 2421"74: "gld 2422"75: "gld 2423"76: "gld 2426"77: "gld 2427"78: "gld 2432"79: "gld 2445"80: "gld 2447"81: "gld 2449"82: "gld 2451"83: "gld 2452"84: "gld 2453"85: "gld 2456"86: "gld 2457"87: "gld 2458"88: "gld 2459"89: "gld 2460"90: "gld 2462"91: "gld 2463"92: "gld 2469"93: "gld 6013"94: "gld 6014"95: "gld 6022"96: "gld 6023"97: "gld 6085"98: "gld 6183"99: "gld 6220"[100 … 169]100: "gld 6228"101: "gld 6239"102: "gld 6240"103: "gld 6249"104: "gld 6250"105: "gld 6251"106: "gld 6255"107: "gld 6256"108: "gld 6257"109: "gld 6258"110: "gld 6265"111: "gld 6502"112: "gld 6505"113: "gld 6510"114: "glr 1015"115: "glr 1019"116: "glr 1024"117: "glr 1026"118: "glr 1034"119: "glr 1043"120: "glr 1044"121: "glr 1052"122: "glr 1081"123: "glr 1082"124: "glr 1087"125: "glr 1088"126: "glr 1089"127: "glr 1090"128: "glr 1091"129: "glr 1092"130: "glr 1094"131: "glr 1095"132: "glr 1096"133: "glr 1099"134: "glr 1100"135: "glr 1111"136: "glr 1112"137: "glr 1116"138: "glr 1120"139: "glr 1131"140: "glr 1132"141: "glr 1134"142: "glr 1135"143: "glr 1138"144: "glr 1139"145: "glr 1154"146: "glr 1157"147: "glr 1159"148: "glr 1182"149: "glr 9051"150: "glr 9087"151: "glr 9088"152: "glr 9089"153: "glr 9090"154: "glr 9091"155: "glr 9092"156: "glr 9094"157: "glr 9095"158: "glr 9096"159: "glvc 3024"160: "glvc 3050"161: "glvc 3067"162: "glvc 3082"163: "glvc 3099"164: "glvc 3100"165: "glvc 3153"166: "glvc 3160"167: "glvc 3161"168: "glvc 3166"169: "glvc 33019"length: 170__proto__: Array(0)

(index):1 Uncaught Syntaxerror: Unexpected token g in JSON at position 0 at JSON.parse () At Object.Success ((index):803) at j (jquery.min.js:2) At object.fireWith [as resolveWith] (jquery.min.js:2) at x (jquery.min.js:4) at Xmlhttprequest. b (jquery.min.js:4) (index): 802 Array(114) (index): 1 Uncaught Syntaxerror: Unexpected token g in JSON at position 0 at JSON.parse () At Object.Success ((index):803) at j (jquery.min.js:2) At object.fireWith [as resolveWith] (jquery.min.js:2) at x (jquery.min.js:4) at Xmlhttprequest. b (jquery.min.js:4) fetch php.

$query2 = "
         SELECT * FROM fotos_produtos WHERE id_produto='".$row['id']."'
        ";

        $result2 = mysqli_query($connect, $query2);

        if(mysqli_num_rows($result2) > 0)
        {
         while($row2 = mysqli_fetch_assoc($result2))
         {

        $data[] = $row["nome"]."<img src=uploads/".$row2["nome"]."/>";

        }
        echo json_encode($data);
        }

Result when looking for a product

PRODUTO 21<IMG SRC=UPLOADS/PRODUTO21.JPG/>

The image would have to appear and not in text mode as it is in the result, it would have as?

php jquery

1 answer

0

A possible solution is to return the image link (e.g.: UPLOADS/PRODUTO21.JPG/) via AJAX to your jQuery function, and in jQuery you search for an element (e.g.: a div) and do the following::

$("#resultado").prepend('PRODUTO 21<IMG SRC="UPLOADS/PRODUTO21.JPG/">');

Where, resultado is the ID of any div.

You can use the function prepend() to attach as first child of the element or append() to annex as last child.

EDIT

You could use it that way:

$.ajax({
    url: "fetch.php",
    method: "POST",
    data: {
        query: b
    },
    dataType: "json",
    success: function(c) {
        var json = JSON.parse(c);
        $.each(json, function(i, data) {
            $("#resultado").prepend(data);
        }       
    }
    })

  • as I would to implement $("#result"). prepend('PRODUCT 21<IMG SRC="UPLOADS/PRODUTO21.JPG/">'); in my code?

  • I would put in ajax Success function in jQuery, a each(). As here and then $("#result"). prepend(i);

  • Using the prepend?

  • @Wagnermartinsbodyboard edited the comment, with an example that might help you

  • I’ll try yes and let you know if it worked

  • @Wagnermartinsbodyboard edited the answer with the idea, I hope it helps

  • The div #result would be where the auto-complete appears? Because in my code would be #products

  • That, the div that appears in auto-complete

  • blza I will try this way and I warn you. Thank you very much

  • is returning this error, Uncaught Syntaxerror: Missing ) after argument list I edited my code for you to see how I did it

  • My code and yours lacked a ")". I didn’t even notice it. $. each(json, Function(i, data) { $("#result").prepend(date); } );

  • for me here didn’t work, look how I’m doing, edited my answer with error q returns

  • Hm... Try to give a Console.log(c) or Alert(c) before "var json = JSON.parse(c);". And put the result, please

  • Uncaught Referenceerror: Console is not defined at Object.Success ((index):802) at j (jquery.min.js:2) at Object.fireWith [as resolveWith] (jquery.min.js:2) at x (jquery.min.js:4) at Xmlhttprequest. b (jquery.min.js:4) (index):802 Uncaught Referenceerror: Console is not defined at Object.Success ((index):802) at j (jquery.min.js:2) at Object.fireWith [as resolveWith] (jquery.min.js:2) at x (jquery.min.js:4) at Xmlhttprequest. b (jquery.min.js:4)

  • I think you had a case sensitive problem in Console.log(). Try console.log()

  • returned the error I put in the post now

  • It seems like you’re looking for certain self doesn’t show in the div.

  • The way PHP is sending JSON is incorrect, probably the error is in the line "$data[] = $Row["name"]." <img src=uploads/". $row2["name"]."/>""

  • tried so, $data[] = $row2["name"]; and still does not appear in the #result div, only on the console

Show 14 more comments

Browser other questions tagged php jquery

You are not signed in. Login or sign up in order to post.