Problem displaying database attribute inside a javascript popup

webdeveloper123 · September 25, 2023

Hey Guys,

Sorry if this thread is in the wrong place, I posted it here because I wasn't sure if the problem was with the PHP, JS or CSS (or maybe all!)

I am making an online room reservation system. I'm returning search results. Now, in the results I am limiting to only show 5 room amenities (called facilities in the sql). This bit is fine. Rooms range from having 6 to 14 amenities, so because I didn't want to overload with information and wanted all the search result boxes to be the same size I thought I'd have the Amenities listed and then next to it I would have a "See All" text that when you click on it, it shows all amenities for that room in a JS popup. I've got the code for the popup. Now here is my SQL:

$sql = "SELECT rs.description
     , rs.sleeps
     , rs.image
     , rs.price
     , substring_index(GROUP_CONCAT(f.description separator ' &bull; '), ' &bull; ', 5) as rmfac
     , rt.description as rmtype
     , r.room_id
     , r.room_number
     , GROUP_CONCAT(DISTINCT f.description SEPARATOR '<br>') AS rmfac1
FROM room as r 
     JOIN roomtype as rt ON  r.roomtype_id = rt.roomtype_id
     JOIN roomsize as rs ON r.size_id = rs.size_id
     JOIN room_facility as rf ON rf.size_id = rs.size_id
     JOIN facility as f ON rf.facility_id = f.facility_id
     LEFT JOIN room_booking as rb ON r.room_id = rb.room_id
                                  AND rb.departureDate > :arrival
                                  AND rb.arrivalDate <= :departure
WHERE rb.room_id IS NULL 
GROUP BY room_id;";

rmfac displays the 5 amenities which is fine.

rmfac1 is supposed to show all of them.

If I do this:

<?php echo "<p class='details'> Amenities: {$rooms['rmfac1']}</p>";?>

It shows all amenities, no problem.

But as soon as I try make it appear in the popup, it will only show maximum of 6, even though some have more than 6.

Now even in the popup, If I view HTML source, I can see the amenities output for all rooms, all match up - but only show 6 in the popup

First I thought it was my CSS, so I played around with it, made it massive in size thinking it's hidden somewhere, but to no avail.

Here is my code: (relevant parts)

 <div class="searchresults">
<?php foreach ($availableRooms as $rooms) { ?>
   <div class="perpicture">  <img class="picture" src="images/<?= htmlspecialchars($rooms['image']) ?>"> </div>
<div class="resultdetails">
     <h2> <?= htmlspecialchars($rooms['rmtype']) ?></h2>
 
 <h1> <?= htmlspecialchars($rooms['description']) ?></h1>
 <p class="details"> Sleeps <?= htmlspecialchars($rooms['sleeps']) ?></p>
 <p class="details"> Price <?= htmlspecialchars($rooms['price']) ?></p>
<?php echo "<p class='details'> Amenities: {$rooms['rmfac']}</p>";?>
    <div class="popup" onclick="myFunction()">See all
  <span class="popuptext" id="myPopup"><?php echo "<p class='details'> Amenities: {$rooms['rmfac1']}</p>";?></span>
</div>
</div>

<?php } ?>
</div>

<script>
// When the user clicks on div, open the popup
function myFunction() {
  var popup = document.getElementById("myPopup");
  popup.classList.toggle("show");
}
</script>

Here is the CSS for the popup:

.popup {
  position: relative;
 display: inline-block;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* The actual popup */
.popup .popuptext {
  visibility: hidden;
  width: 360px;
  background-color: #BEBEBE;
  color: black;
  text-align: center;

  padding: 8px 0;
  position: absolute;
  z-index: 1;
  bottom: 50%;
  left: -60px;
  margin-left: -80px;
  height: 500px;
  top: 110%;

}

}



/* Toggle this class - hide and show the popup */
.popup .show {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

/* Add animation (fade in the popup) */
@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

Can someone help please?

Thanks

requinix · September 25, 2023

What's the HTML being outputted, and how about a screenshot of what you're seeing?

webdeveloper123 · September 26, 2023

Hey Requinix,

Here it the ouputted HTML:

<div class="searchresults">
   <div class="perpicture">  <img class="picture" src="images/superiorqueen.png"> </div>
<div class="resultdetails">
     <h2> Room</h2>
 
 <h1> Superior Queen</h1>
 <p class="details"> Sleeps 2</p>
 <p class="details"> Price 825.00</p>
<p class='details'> Amenities: Queen Size Bed &bull; Mini-Bar &bull; WiFi &bull; Wheel chair access &bull; Safe</p>    <div class="popup" onclick="myFunction()">See all
  <span class="popuptext" id="myPopup"><p class='details'> Amenities: 55 Inch Smart TV<br>Mini-Bar<br>Queen Size Bed<br>Safe<br>Wheel chair access<br>WiFi</p></span>
</div>
</div>

   <div class="perpicture">  <img class="picture" src="images/superiorqueen.png"> </div>
<div class="resultdetails">
     <h2> Room</h2>
 
 <h1> Superior Queen</h1>
 <p class="details"> Sleeps 2</p>
 <p class="details"> Price 825.00</p>
<p class='details'> Amenities: WiFi &bull; Wheel chair access &bull; Safe &bull; 55 Inch Smart TV &bull; Queen Size Bed</p>    <div class="popup" onclick="myFunction()">See all
  <span class="popuptext" id="myPopup"><p class='details'> Amenities: 55 Inch Smart TV<br>Mini-Bar<br>Queen Size Bed<br>Safe<br>Wheel chair access<br>WiFi</p></span>
</div>
</div>

   <div class="perpicture">  <img class="picture" src="images/superiorqueenTwin.webp"> </div>
<div class="resultdetails">
     <h2> Room</h2>
 
 <h1> Superior Queen</h1>
 <p class="details"> Sleeps 2</p>
 <p class="details"> Price 850.00</p>
<p class='details'> Amenities: Safe &bull; 55 Inch Smart TV &bull; Twin Beds &bull; Mini-Bar &bull; WiFi</p>    <div class="popup" onclick="myFunction()">See all
  <span class="popuptext" id="myPopup"><p class='details'> Amenities: 55 Inch Smart TV<br>Mini-Bar<br>Safe<br>Twin Beds<br>WiFi</p></span>
</div>
</div>

   <div class="perpicture">  <img class="picture" src="images/superiorqueenTwin.webp"> </div>
<div class="resultdetails">
     <h2> Room</h2>
 
 <h1> Superior Queen</h1>
 <p class="details"> Sleeps 2</p>
 <p class="details"> Price 850.00</p>
<p class='details'> Amenities: Safe &bull; 55 Inch Smart TV &bull; Twin Beds &bull; Mini-Bar &bull; WiFi</p>    <div class="popup" onclick="myFunction()">See all
  <span class="popuptext" id="myPopup"><p class='details'> Amenities: 55 Inch Smart TV<br>Mini-Bar<br>Safe<br>Twin Beds<br>WiFi</p></span>
</div>
</div>

   <div class="perpicture">  <img class="picture" src="images/superiorqueen4.jpg"> </div>
<div class="resultdetails">
     <h2> Room</h2>
 
 <h1> Superior Queen</h1>
 <p class="details"> Sleeps 4</p>
 <p class="details"> Price 900.00</p>
<p class='details'> Amenities: WiFi &bull; Twin Beds &bull; Safe &bull; 55 Inch Smart TV &bull; Queen Size Bed</p>    <div class="popup" onclick="myFunction()">See all
  <span class="popuptext" id="myPopup"><p class='details'> Amenities: 55 Inch Smart TV<br>Mini-Bar<br>Queen Size Bed<br>Safe<br>Twin Beds<br>WiFi</p></span>
</div>
</div>

   <div class="perpicture">  <img class="picture" src="images/superiorqueen4.jpg"> </div>
<div class="resultdetails">
     <h2> Room</h2>
 
 <h1> Superior Queen</h1>
 <p class="details"> Sleeps 4</p>
 <p class="details"> Price 900.00</p>
<p class='details'> Amenities: Safe &bull; 55 Inch Smart TV &bull; Queen Size Bed &bull; Mini-Bar &bull; WiFi</p>    <div class="popup" onclick="myFunction()">See all
  <span class="popuptext" id="myPopup"><p class='details'> Amenities: 55 Inch Smart TV<br>Mini-Bar<br>Queen Size Bed<br>Safe<br>Twin Beds<br>WiFi</p></span>
</div>
</div>

   <div class="perpicture">  <img class="picture" src="images/superiorking.png"> </div>
<div class="resultdetails">
     <h2> Room</h2>
 
 <h1> Superior King</h1>
 <p class="details"> Sleeps 2</p>
 <p class="details"> Price 930.00</p>
<p class='details'> Amenities: King Size Bed &bull; Mini-Bar &bull; WiFi &bull; Safe &bull; 55 Inch Smart TV</p>    <div class="popup" onclick="myFunction()">See all
  <span class="popuptext" id="myPopup"><p class='details'> Amenities: 55 Inch Smart TV<br>King Size Bed<br>Mini-Bar<br>Safe<br>WiFi</p></span>
</div>
</div>

   <div class="perpicture">  <img class="picture" src="images/superiorking.png"> </div>
<div class="resultdetails">
     <h2> Room</h2>
 
 <h1> Superior King</h1>
 <p class="details"> Sleeps 2</p>
 <p class="details"> Price 930.00</p>
<p class='details'> Amenities: King Size Bed &bull; Mini-Bar &bull; WiFi &bull; Safe &bull; 55 Inch Smart TV</p>    <div class="popup" onclick="myFunction()">See all
  <span class="popuptext" id="myPopup"><p class='details'> Amenities: 55 Inch Smart TV<br>King Size Bed<br>Mini-Bar<br>Safe<br>WiFi</p></span>
</div>
</div>

   <div class="perpicture">  <img class="picture" src="images/superiorking.png"> </div>
<div class="resultdetails">
     <h2> Room</h2>
 
 <h1> Superior King</h1>
 <p class="details"> Sleeps 2</p>
 <p class="details"> Price 930.00</p>
<p class='details'> Amenities: Safe &bull; 55 Inch Smart TV &bull; King Size Bed &bull; Mini-Bar &bull; WiFi</p>    <div class="popup" onclick="myFunction()">See all
  <span class="popuptext" id="myPopup"><p class='details'> Amenities: 55 Inch Smart TV<br>King Size Bed<br>Mini-Bar<br>Safe<br>WiFi</p></span>
</div>
</div>

   <div class="perpicture">  <img class="picture" src="images/superiorking2bed.jpg"> </div>
<div class="resultdetails">
     <h2> Room</h2>
 
 <h1> Superior King</h1>
 <p class="details"> Sleeps 2</p>
 <p class="details"> Price 980.00</p>
<p class='details'> Amenities: Safe &bull; 55 Inch Smart TV &bull; Twin Beds &bull; Mini-Bar &bull; WiFi</p>    <div class="popup" onclick="myFunction()">See all
  <span class="popuptext" id="myPopup"><p class='details'> Amenities: 55 Inch Smart TV<br>Mini-Bar<br>Safe<br>Twin Beds<br>WiFi</p></span>
</div>
</div>

   <div class="perpicture">  <img class="picture" src="images/deluxeking2bed.webp"> </div>
<div class="resultdetails">
     <h2> Room</h2>
 
 <h1> Deluxe King</h1>
 <p class="details"> Sleeps 2</p>
 <p class="details"> Price 1100.00</p>
<p class='details'> Amenities: WiFi &bull; King Size Bed &bull; Air Conditioning &bull; 55 Inch Smart TV &bull; Bath Robes</p>    <div class="popup" onclick="myFunction()">See all
  <span class="popuptext" id="myPopup"><p class='details'> Amenities: 55 Inch Smart TV<br>Air Conditioning<br>Bath Robes<br>King Size Bed<br>Mini-Bar<br>Safe<br>WiFi</p></span>
</div>
</div>

   <div class="perpicture">  <img class="picture" src="images/juniorsuite.png"> </div>
<div class="resultdetails">
     <h2> Suite</h2>
 
 <h1> Junior Suite</h1>
 <p class="details"> Sleeps 2</p>
 <p class="details"> Price 1300.00</p>
<p class='details'> Amenities: Mini-Bar &bull; WiFi &bull; Views over Hyde Park &bull; King Size Bed &bull; Air Conditioning</p>    <div class="popup" onclick="myFunction()">See all
  <span class="popuptext" id="myPopup"><p class='details'> Amenities: 55 Inch Smart TV<br>Air Conditioning<br>Bath Robes<br>King Size Bed<br>Mini-Bar<br>Safe<br>Views over Hyde Park<br>WiFi</p></span>
</div>
</div>

   <div class="perpicture">  <img class="picture" src="images/juniorsuite.png"> </div>
<div class="resultdetails">
     <h2> Suite</h2>
 
 <h1> Junior Suite</h1>
 <p class="details"> Sleeps 2</p>
 <p class="details"> Price 1300.00</p>
<p class='details'> Amenities: 55 Inch Smart TV &bull; Bath Robes &bull; Safe &bull; Mini-Bar &bull; WiFi</p>    <div class="popup" onclick="myFunction()">See all
  <span class="popuptext" id="myPopup"><p class='details'> Amenities: 55 Inch Smart TV<br>Air Conditioning<br>Bath Robes<br>King Size Bed<br>Mini-Bar<br>Safe<br>Views over Hyde Park<br>WiFi</p></span>
</div>
</div>

   <div class="perpicture">  <img class="picture" src="images/executivesuite.png"> </div>
<div class="resultdetails">
     <h2> Suite</h2>
 
 <h1> Executive Suite</h1>
 <p class="details"> Sleeps 4</p>
 <p class="details"> Price 2400.00</p>
<p class='details'> Amenities: Mini-Bar &bull; Views over Hyde Park &bull; WiFi &bull; Bath Robes &bull; Turndown Service</p>    <div class="popup" onclick="myFunction()">See all
  <span class="popuptext" id="myPopup"><p class='details'> Amenities: 55 Inch Smart TV<br>Air Conditioning<br>Bath Robes<br>King Size Bed<br>Mini-Bar<br>Safe<br>Turndown Service<br>Twin Beds<br>Views over Hyde Park<br>WiFi</p></span>
</div>
</div>

   <div class="perpicture">  <img class="picture" src="images/executivesuite.png"> </div>
<div class="resultdetails">
     <h2> Suite</h2>
 
 <h1> Executive Suite</h1>
 <p class="details"> Sleeps 4</p>
 <p class="details"> Price 2400.00</p>
<p class='details'> Amenities: Twin Beds &bull; Safe &bull; King Size Bed &bull; Mini-Bar &bull; WiFi</p>    <div class="popup" onclick="myFunction()">See all
  <span class="popuptext" id="myPopup"><p class='details'> Amenities: 55 Inch Smart TV<br>Air Conditioning<br>Bath Robes<br>King Size Bed<br>Mini-Bar<br>Safe<br>Turndown Service<br>Twin Beds<br>Views over Hyde Park<br>WiFi</p></span>
</div>
</div>

   <div class="perpicture">  <img class="picture" src="images/penthousesuite.png"> </div>
<div class="resultdetails">
     <h2> Signature Suite</h2>
 
 <h1> The Penthouse Suite</h1>
 <p class="details"> Sleeps 10</p>
 <p class="details"> Price 7000.00</p>
<p class='details'> Amenities: WiFi &bull; Turndown Service &bull; Twin Beds &bull; Personal working desk &bull; Nespresso coffee machine</p>    <div class="popup" onclick="myFunction()">See all
  <span class="popuptext" id="myPopup"><p class='details'> Amenities: 55 Inch Smart TV<br>Air Conditioning<br>Bath Robes<br>Bottle of Champagne on arrival<br>King Size Bed<br>Mini-Bar<br>Nespresso coffee machine<br>Personal working desk<br>Queen Size Bed<br>Safe<br>Turndown Service<br>Twin Beds<br>Views over Hyde Park<br>WiFi</p></span>
</div>
</div>

</div>

And the screenshot:

Thanks

Barand · September 26, 2023

What does this query give you?

SELECT @@group_concat_max_len;

webdeveloper123 · September 26, 2023

Ahh I think I know what you mean. I run that query and I get:

So after a google of it, the default length is 1024. So you are saying I am trying to return more than the default, that's why its cutting off at a certain point?

Barand · September 26, 2023

It was just a theory, but as you are displaying about 100 characters your limit would need to be very small for that to be the cause.

webdeveloper123 · September 26, 2023

Off the top of my head, I think the longest one (Penthouse suite) right at the bottom is 254 chars

Barand · September 26, 2023

Your html is displaying all that it is being asked to display. From your html source...

  <span class="popuptext" id="myPopup"><p class='details'> Amenities: 55 Inch Smart TV<br>Mini-Bar<br>Queen Size Bed<br>Safe<br>Wheel chair access<br>WiFi</p></span>

The fault appears to be in the PHP/SQL and not on the client side.

webdeveloper123 · September 26, 2023

38 minutes ago, Barand said:

The fault appears to be in the PHP/SQL and not on the client side.

hmm...I'm no expert but I can't see what's wrong with it. Because if I take that line outside of the popup it will display all amenities for all rooms - no problem. But as soon as I put it in the HTML for the popup (which is just a div and span element) it doesn't work

Edited September 26, 2023 by webdeveloper123

webdeveloper123 · September 26, 2023

Shall I do this?

SET GLOBAL  group_concat_max_len = 9999999;

Although in the manual it says......

Quote

The result is truncated to the maximum length that is given by the group_concat_max_len system variable, which has a default value of 1024. The value can be set higher, although the effective maximum length of the return value is constrained by the value of max_allowed_packet.

So I guess the question is - is 9999999 bigger than max_allowed_packet?

Barand · September 26, 2023

As I said earlier, I don't now think the group_concat_max_len is your problem.

I am struggling with your html, trying to get the popup to work for me. I notice you have many elements all with the same id ("mypopup"). Ids must be unique. You are probably getting the same (short list) popup displaying every time, regardless of which room you click.

webdeveloper123 · September 26, 2023

15 minutes ago, Barand said:

You are probably getting the same (short list) popup displaying every time, regardless of which room you click.

Actually, that makes sense. I got the popup from: https://www.w3schools.com/howto/howto_js_popup.asp

webdeveloper123 · September 26, 2023

Shall I just changed it from Id=myPopUp to class=myPopUp and edit the JS?

Barand · September 26, 2023

You need to a way for your js function to specify which popup to show.

One way would be to pass the room id in the function call

onclick = "myFunction(xx)"

and to append the room id to your ids to make them unique

id="mypopupxx"

webdeveloper123 · September 26, 2023

ahh I get you. Thanks Barand. I'll give it a go

webdeveloper123 · September 27, 2023

19 hours ago, Barand said:

and to append the room id to your ids to make them unique

Would this mean that say if I returned 4 rooms (Room id's - 4,6,12,22) than the id=mypopup is always going to have that roomid after it. So every time Room Id 4 is returned, the id for that popup would always be id=mypop4?

And another thing - When I click the popup, it always displays in the same position, regardless of which room it's associated with. Now I know why this happens, because in the CSS I have used position: absolute; and then used the top, bottom, left & right properties to fix it into place. So it will always display there. But how do I make it appear in context of where it was clicked on the page? Because at the moment, if I click on the last result, I have to scroll back to the top to view it. If this is going to need more JS, I might as well do the lot whilst I'm at it.

Barand · September 27, 2023

Keep it simple

<script type='text/javascript'>

    function myFunction(n) 
    {
      var popup = document.getElementById("myPopup"+n);
      
      if (popup.style.display == "block") {
          popup.style.display = "none"
      }
      else {
          popup.style.display = "block"
      }
    }
    
</script>
<style type='text/css'>
    .popup {
        cursor: pointer;
    }
    .popuptext {
        display: None;
        background-color: #eee;
        padding: 16px 80px;
    }
</style>

html

<div class="searchresults">
<div class="resultdetails">
     <h2> Room</h2>
 
 <h1> Superior Queen</h1>
 <p class="details"> Sleeps 2</p>
 <p class="details"> Price 825.00</p>
<p class='details'> Amenities: Queen Size Bed &bull; Mini-Bar &bull; WiFi &bull; Wheel chair access &bull; Safe</p>    <div class="popup" onclick="myFunction(1)">See all
  <span class="popuptext" id="myPopup1"><p class='details'> Amenities:<br> 55 Inch Smart TV<br>Mini-Bar<br>Queen Size Bed<br>Safe<br>Wheel chair access<br>WiFi</p></span>
</div>
</div>

<div class="resultdetails">
     <h2> Room</h2>
 
 <h1> Superior Queen</h1>
 <p class="details"> Sleeps 2</p>
 <p class="details"> Price 825.00</p>
<p class='details'> Amenities: WiFi &bull; Wheel chair access &bull; Safe &bull; 55 Inch Smart TV &bull; Queen Size Bed</p>    <div class="popup" onclick="myFunction(2)">See all
  <span class="popuptext" id="myPopup2"><p class='details'> Amenities:<br> 55 Inch Smart TV<br>Mini-Bar<br>Queen Size Bed<br>Safe<br>Wheel chair access<br>WiFi</p></span>
</div>
</div>

<div class="resultdetails">
     <h2> Room</h2>
 
 <h1> Superior Queen</h1>
 <p class="details"> Sleeps 2</p>
 <p class="details"> Price 850.00</p>
<p class='details'> Amenities: Safe &bull; 55 Inch Smart TV &bull; Twin Beds &bull; Mini-Bar &bull; WiFi</p>    <div class="popup" onclick="myFunction(3)">See all
  <span class="popuptext" id="myPopup3"><p class='details'> Amenities:<br> 55 Inch Smart TV<br>Mini-Bar<br>Safe<br>Twin Beds<br>WiFi</p></span>
</div>
</div>

webdeveloper123 · September 28, 2023

Hey Barand,

Thanks for the code.

So should n be an array? Or just a single value? And should I send in the room_id or should I do something like:

n=1;
Loop [condition] 
n++
append n to value in id attribute

Because I already have the room_id in JSON. I did this:


$roomid = [];
    foreach ($availableRooms as $row) {
        $roomid[] = $row["room_id"]; // Change this to the desired attribute
    }



echo json_encode($roomid);

Thanks

Barand · September 28, 2023

All that matters is that the popuptext id should be unique. Using the room id gives that uniqueness, but so would a simple incremented value.

But in no case would the id be an array.

webdeveloper123 · September 28, 2023

Thanks, I'll give it a try

webdeveloper123 · September 28, 2023

I know this is not a very good attempt, but this is where I've got to. Been at it since yesterday:

<script>
// When the user clicks on div, open the popup
function myFunction(n) {

 var popup = document.getElementById("myPopup");

  var roomid = 1; 


for (var i = 0; i < popup.length; i++) {
 popup.id += 'myPopup_' + n;
 n++;
}


  //var popup = document.getElementById("myPopup");
  popup.classList.toggle("show");
}
</script>

And the HTML:

  <div class="popup" onclick="myFunction(1)">See all
  <span class="popuptext" id="myPopup"><?php echo "<p class='details'> Amenities: {$rooms['rmfac1']}</p>";?></span>
</div>

Thanks

Edited September 28, 2023 by webdeveloper123

Barand · September 28, 2023

Your query gets the room_id - use it.

Then

<script type='text/javascript'>

    function myFunction(n) 
    {
      var popup = document.getElementById("myPopup"+n);
      
      if (popup.style.display == "block") {
          popup.style.display = "none"
      }
      else {
          popup.style.display = "block"
      }
    }
    
</script>

webdeveloper123 · September 29, 2023

It runs! Such a simple solution. Thanks Barand! And the area where the popup appears fixed itself!

Edited September 29, 2023 by webdeveloper123

Sign In

Problem displaying database attribute inside a javascript popup

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Important Information