Survey123 JavaScript Function Styling the Output

PaulSweeney3

Hi All 

 

After Much toing and frowing i have manage to create this JavaScript function that shows a list of equipment and weather or not it has been inspected in the last week, indicated by a green tick box or red cross. 

My problem is while it looks great on the desktop version of Connect when I publish it  ,it looks a mess on some smaller android devices. I was thinking if I could  reduced the size of the font it might look better on devices with a smaller screen. I cannot figure out how to do this though. is it possible? or is there another solution I could use to help it look better on smaller devices

Kind regards 

 

Paul Sweeney 

 

 

    xmlhttp.open("GET",url,false);
        xmlhttp.send();
        
        
        
            var responseJSON=JSON.parse(xmlhttp.responseText);
            var OIDS = "Serial Number "+ "- Description -"+ "- Last Inspection Date -"+"\n"+"\n";
            
            var outputdatecheck = " "
            var i;
            for (i in responseJSON.features) {
                var date = new Date();
                date.setDate(date.getDate() - 7);
if(new Date(responseJSON.features[i].attributes.HSF_051_Inspection_Date) > date) {
 outputdatecheck = "\u2705";
 } else {
  outputdatecheck = "\u274C";
 }
                OIDS +=  "\n\u2022 ("+((JSON.stringify(responseJSON.features[i].attributes.SERIAL_NUMBER)+") - "+JSON.stringify(responseJSON.features[i].attributes.DESCRIPTION)+" - "+ outputdatecheck+" "+new Date(responseJSON.features[i].attributes.HSF_051_Inspection_Date).toLocaleDateString("en-UK")+"\n").replace(/"/g, '').replace("01/01/1999", " (no weekly inspection record)").replace("01/01/1970", " (no weekly inspection record)"));
              }

            return OIDS
            
          }

 

 

 

 

PaulSweeney3

hi @jcarlson 

Thanks for your response i managed ot get it to work although its not  exactly as per your instructions for example to get it to recognise the HTML tags I had to use 

OIDS += "<p style=\u0022font-size:8px\u0022>\n\u2022 ......................

but unfortunately  it appears the HTML formatting is not working on my android device. The windows version of the field app supports it but my android device does not. is this expected ? 

 

Regards 

 

Paul