I have marker properties which are fetched from the database and displayed as a table. I want to hide the "reply" feature property when it's null and display it only when there is a text entry against it.

Similarity: hide attribute with null value using leaflet

Although it is a similar question but I am not sure how to get the property labels as shown in the answer.

My code:

    function returnQuery(feature, latlng) {  
        return L.marker(latlng).bindPopup(
            "<table>" +
            "<tbody>" +
            "<tr>" + "<th>" + "Query ID: " + "</th>" + "<td>" + feature.properties.id + "</td>" + "</tr>" +
            "<tr>" + "<th>" + "Issue Placement Date: " + "</th>" + "<td>" + feature.properties.q_date + "</td>" + "</tr>" +
            "<tr>" + "<th>" + "From: " + "</th>" + "<td>" + feature.properties.q_name + "</td>" + "</tr>" +
            "<tr>" + "<th>" + "Query/Problem Statement: " + "</th>" + "<td>" + feature.properties.query + "</td>" + "</tr>" +
            "<tr>" + "<th>" + "Reply: " + "</th>" + "<td>" + feature.properties.reply + "</td>" + "</tr>" +
            "</tbody>" +
            "</table>");
            }
up vote 0 down vote accepted

You can initiate an empty string, fill it if there is a feature.properties.reply entry and append it to your return statement.

function returnQuery(feature, latlng) {
  let reply_string = ""
  if(feature.properties.reply) { // null is falsy
    reply_string = "<tr>" + "<th>" + "Reply: " + "</th>" + "<td>" + feature.properties.reply + "</td>" + "</tr>"
  }
  return L.marker(latlng).bindPopup(
    "<table>" +
      "<tbody>" +
        "<tr>" + "<th>" + "Query ID: " + "</th>" + "<td>" + feature.properties.id + "</td>" + "</tr>" +
        "<tr>" + "<th>" + "Issue Placement Date: " + "</th>" + "<td>" + feature.properties.q_date + "</td>" + "</tr>" +
        "<tr>" + "<th>" + "From: " + "</th>" + "<td>" + feature.properties.q_name + "</td>" + "</tr>" +
        "<tr>" + "<th>" + "Query/Problem Statement: " + "</th>" + "<td>" + feature.properties.query + "</td>" + "</tr>" +
        reply_string +
      "</tbody>" +
    "</table>"
  );
}
  • It worked smoothly. Thank you Stefan. – Shaibal Ahmed Nov 20 at 8:03

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Not the answer you're looking for? Browse other questions tagged or ask your own question.