How to catch an error if a field is empty in an array

Hi I am trying to display images from an array in a grid via image component (named Offer_image). Array has other fields as well beside the image field.

I am using the following code in the response mapping of a query service -

Apperyio("Offer_image").attr("src",Appery.getImagePath(value.image));

This works fine wherever there is image stored in the corresponding record in the DB array.

Wherever image field is empty, it gives me an error as - Resource interpreted as Image but transferred with MIME type text/html: "http://appery.io/404.htm".

How can I catch this error and help the service to complete as success even if there are empty image fields in the array?
2 people have
this problem
+1
This topic is no longer open for comments or replies.
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. sad, anxious, confused, frustrated kidding, amused, unsure, silly indifferent, undecided, unconcerned happy, confident, thankful, excited

  • Hi Alena, in both the cases that you have cited, data.length is being checked on success of the service. I do not want that.

    For me, there are images in certain array records and there are none in the other. Thus data.length is never going to be zero. I want to display images on a page wherever they are present in the DB array and show an empty image component where there is no image. For this to happen, I can't check after the success event. Have to check within the loop of the service response mapping.

    Currently, since I get an error for empty images, this prevents even those images to show which are present in the array.
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. sad, anxious, confused, frustrated kidding, amused, unsure, silly indifferent, undecided, unconcerned happy, confident, thankful, excited

  • In fact, I have tried another thing to find the root cause of the error itself.

    Before checking the case of empty images, have now ensured that every array record has an image. Even after doing that, I am getting the error -

    Resource interpreted as Image but transferred with MIME type text/html: "http://appery.io/404.htm".

    Pls see the service mapping in the image. I am using the following JS code in the response for offer[] to mobilegrid_1 response. This code returns although identifies images correctly for every array record but still displays only the first image only. Rest of the images seem broken as shown below. What's wrong with the code?

    Same issue comes even if I use the code in the image to Offer_image mapping.

    Apperyio("Offer_image").attr("src",Appery.getImagePath(value.image));

    alert(value.image);



  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. sad, anxious, confused, frustrated kidding, amused, unsure, silly indifferent, undecided, unconcerned happy, confident, thankful, excited

  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. sad, anxious, confused, frustrated kidding, amused, unsure, silly indifferent, undecided, unconcerned happy, confident, thankful, excited

  • Hello!

    Please add the following code in mapping Offer_image:
    if (!value){
    element.attr("src",Appery.getImagePath("no_image.png"));
    }
    It will work the following way: if service returns empty value for image, there will be set another image. Images with no_image.png name should be stored in Media Manager.
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. sad, anxious, confused, frustrated kidding, amused, unsure, silly indifferent, undecided, unconcerned happy, confident, thankful, excited

  • Hi Maryna, as I already said above. Even after allocating the same image to all the records in my DB array, I am getting image rendered only for the first record. All other images (although same) are appearing broken as in the above Offers page.

    If I put Apperyio("Offer_image").attr("src",Appery.getImagePath(value.image)); in mapping to mobilegrid_1, only the first image appears.

    If I put Apperyio("Offer_image").attr("src",Appery.getImagePath(value.image)); in mapping to Offer_image, none of the images appear.
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. sad, anxious, confused, frustrated kidding, amused, unsure, silly indifferent, undecided, unconcerned happy, confident, thankful, excited

  • Hello!

    Please specify do you need to set the value of the service to all parts of the image? If you want to set same value to all parts, please use the following code:
    $("[name=Offer_image]").attr("src",Appery.getImagePath(value.image));
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. sad, anxious, confused, frustrated kidding, amused, unsure, silly indifferent, undecided, unconcerned happy, confident, thankful, excited

  • Hi Arina, I do not want to set same value to all records. I have done that above just to find where the error is coming from. As I said in my first msg, I am trying to display images from an array in a grid via image component (named Offer_image). Array has other fields as well beside the image field.

    I am using the following code in the response mapping of a query service -

    Apperyio("Offer_image").attr("src",Appery.getImagePath(value.image));

    If I put this code in mapping to mobilegrid_1, only the first image appears.

    If I put this code in mapping to Offer_image, none of the images appear.

    See the snapshot above.

    Basically images are not getting rendered properly.

    Browser console also showing error as - Resource interpreted as Image but transferred with MIME type text/html: "http://appery.io/404.htm".

    Similar problem is seen here https://getsatisfaction.com/apperyio/...
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. indifferent, undecided, unconcerned kidding, amused, unsure, silly happy, confident, thankful, excited sad, anxious, confused, frustrated

  • Using the following code in mapping to mobilegrid_1, shows the right path for each of the images but still no images are rendered and same error is shown:

    code:
    element.attr("src",Appery.getImagePath(value.image));

    alert (Appery.getImagePath(value.image));

    error:
    esource interpreted as Image but transferred with MIME type text/html: "http://appery.io/404.htm".
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. sad, anxious, confused, frustrated kidding, amused, unsure, silly indifferent, undecided, unconcerned happy, confident, thankful, excited

  • Hi Anil,

    Your problem is just you get only first item with code:



    //It's necessery to understand that's this code returns only first item with name "Offer_image".
    //This code works globaly for all document. And here is no linking to current element
    Apperyio("Offer_image");



    Please use following solution to get it work:

    1 Open your mapping.

    2 Find "mobilegrid_1" component and click "Edit JS". http://prntscr.com/47n441/direct

    3 JS editor will appear. Populate it with following code:



    //Note "files/resources/image/no-image.jpg" is default image. You can replace it with your default image url.
    var src = value.image ? Appery.getImagePath(value.image) : "files/resources/image/no-image.jpg";
    element.find('[name="Offer_image"]').attr("src", src);

    return value;



    That's all.

    Regards.
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. indifferent, undecided, unconcerned kidding, amused, unsure, silly happy, confident, thankful, excited sad, anxious, confused, frustrated

  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. sad, anxious, confused, frustrated kidding, amused, unsure, silly indifferent, undecided, unconcerned happy, confident, thankful, excited