# ১৮-৫ : ডক্টর ডিটেইলস-২

docDetails এর জন্য জাভাস্ক্রিপ্ট ফাইল ক্রিয়েট করে ফেলি-

<mark style="color:green;">**Code:: 18.5.1**</mark>\ <mark style="color:red;">docDetails.js</mark>

```javascript
const getparams = () => {
    const param = new URLSearchParams(window.location.search).get("doctorId");
    loadTime(param);
    fetch(`https://testing-8az5.onrender.com/doctor/list/${param}`)
      .then((res) => res.json())
      .then((data) => displayDetails(data));
  };
  
  const doctorReview = (reviews) => {
    reviews.forEach((review) => {
      const parent = document.getElementById("doc-details-review");
      const div = document.createElement("div");
      div.classList.add("review-card");
      div.innerHTML = `
            <img src="./Images/girl.png" alt="" />
                <h4>${review.reviewer}</h4>
                <p>
                 ${review.body.slice(0, 100)}
                </p>
                <h6>${review.rating}</h6>
            `;
      parent.appendChild(div);
    });
  };
  
  const displayDetails = (doctor) => {
    console.log(doctor);
    const parent = document.getElementById("doc-details");
    const div = document.createElement("div");
    div.classList.add("doc-details-container");
    div.innerHTML = `
      <div class="doctor-img">
      <img src=${doctor.image} alt="" />
    </div>
    <div class="doc-info">
      <h1>${doctor.full_name} </h1>
      ${doctor.specialization.map((item) => {
        return `<button class="doc-detail-btn">${item}</button>`;
      })}
      ${doctor.designation.map((item) => {
        return `<h4 >${item}</h4>`;
      })}
  
      <p class="w-50">
        Lorem ipsum dolor sit amet consectetur adipisicing elit. Et quibusdam
        quis excepturi tempore. Eius, qui!
      </p>
  
      <h4>Fees: ${doctor.fee} BDT</h4>
      <button
      type="button"
      class="btn btn-primary"
      data-bs-toggle="modal"
      data-bs-target="#exampleModal"
    >
     Take Appointment
    </button>
    </div>
      `;
    parent.appendChild(div);
  };
  
  
  getparams();
  
```

ডিটেইলস বাটনে ক্লিক করলে docDetails.html দেখা যাচ্ছে-

<figure><img src="https://3753355949-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZjZRCk5NYynvfinzJmZE%2Fuploads%2F0SA8BKD5XiNKksPhrB7R%2Fimage.png?alt=media&#x26;token=d01105da-9f0f-425b-aa3d-e7d7c55dea1a" alt=""><figcaption></figcaption></figure>

.
