PhoneGap jQuery .html not working with when loading images (Only in device, working fine on browser)

Question

I am replacing a div in PhoneGap android application.

Both below codes work in browser, but code 01 not working in the device.

Code 01 (Not Working Code)

var selected_floor = $('#select_floor').find(":selected").val();
$("#image_area").html('<img class="img-responsive" src="images//2000.jpg">');

Code 02 (The Working Code)

var selected_floor = $('#select_floor').find(":selected").val();
$("#image_area").html('Hello World');

Why Code 01 not working in the device? How I solve it?

Additional question :If I getting this type of question (working on browser, but not working on the device) how should I debug it on the device to know whats going on?

Update

Carsten Løvbo Andersen suggested to add the ALT tag to image. So I add the ALT images. Now in device it display the value of ALT tag instead of the image. But in browser it display the image.

Are you sure "code 01" is not working? try add an alt text to the image and try again. since your code is the same it should work — Carsten Løvbo Andersen, Oct 03 '17 at 06:57
@CarstenLøvboAndersen Thanks.I tried it now. If I set a alt tag, in device it display the ALT tag instead of the image. But in browser it display the image. Why is that? — I am the Most Stupid Person, Oct 03 '17 at 07:01
my guess is that the phonegap application that is created dont have that path to the image that has been set — Carsten Løvbo Andersen, Oct 03 '17 at 07:11
Ofc but from this point, it's hard for us to point out, that part is basically only you who can figure it out — Carsten Løvbo Andersen, Oct 03 '17 at 07:15
@CarstenLøvboAndersen Thanks. But It is not clear to me what do you mean by "that the phonegap application that is created dont have that path to the image that has been set". If you can explain little bit more I will try myself to slove it. Again thanks. — I am the Most Stupid Person, Oct 03 '17 at 07:21

Joe_Richetta · Answer 1 · 2017-10-03T10:25:20.147

To debug on a device get yourself an android device, personally I use a HTC M8, this allows you to USB into your PC and by using the chrome browser and using the URL chrome://Inspect you can view the html and scripts of the application, like you are using debug tools on chrome.

*EDIT I am not 100% clear on the issue you are facing but remember the routing on a device can sometimes differ, make sure that your image path is correct.

For example to get my images working on my latest application i needed to use

<img src"~/Content/images/image1.png">

Try adding the ~/ followed by the directory.

PhoneGap jQuery .html not working with when loading images (Only in device, working fine on browser)

1 Answers1