Atul Dhanuka
Atul Dhanuka

Reputation: 1463

Unable to load image from database; only URL shows

With the help of phonegap I am making one android application in which I have used phonegap sqlite database in that I am storing the data in database and taking back from database to display but my image is not showing, only the path to where the image has been stored. Please help me find my mistake.

In JQuery:-

function List() {
    $.ajax({
        type: "GET",
        url: "one.html",
        contentType: "text/xml",
        dataType: "xml",
        data: "",
        crossDomain: true,
        success: function(xml) {
            $(xml).find('xyz').each(function() {
                var title = $(this).find('title').text();
                var Image = $(this).find('image').text();

                db.transaction(function(transaction) {
                    transaction.executeSql('INSERT INTO A 
                        VALUES ("' + title + '","' + Image + '")',
                        nullHandler, errorHandler);
                    });
                });
                Dynamic_List();
                return false;
            }
        }
    });
}

/*This Method Create Dynamic Menu Item List*/    
function Dynamic_List() {
    $('.mylistview').empty(); 
    db.transaction(function(transaction) {
        transaction.executeSql('SELECT * FROM A;', [], 
            function(transaction, results) {
                if (results != null && results.rows != null) {  
                    for (var i = 0; i < results.rows.length; i++) {
                        var image = results.rows.item(i).A_Image;
                        var Title = results.rows.item(i).A_Title;

                        $('.mylistview').append(
                            '<li class = "cat_list">' +
                            '<div class = "divli">' +
                            '<div class = "menuImg" ' + 
                            'style = "height:48px; width:48px;">' + 
                            menu_image +
                            '</div>' +
                            '<div class = "divbody">' + 
                            '<h3>' + menu_Item_Title + '</h3>' +
                            '</div>' +
                            '</div>' +
                            '</li>');
                    }
                }
            }
        }, errorHandler);
        }, errorHandler, nullHandler);
    return;
}

In HTML5:-

<div class = "foodList">            
    <ul class = "mylistview"
        style = "display: block;"
        id = "my_dynamic_list_view">
    </ul>
</div>

Upvotes: 1

Views: 181

Answers (1)

Arjun T Raj
Arjun T Raj

Reputation: 3207

var Image = $(this).find('image').text();

this only save the url of the image, if you need to save full image need to conver the image to base64 and save. and give image src like this

<img src="data:image/gif;base64,UR base64 hash"  />

help link

Upvotes: 1

Related Questions