Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 2 years ago.
Improve this question
I'm new to Python and web scraping. I have the following calendar as a table and i would like to extract available dates which are in Green background color.
Below is the HTML source:
<div id="calendar" class="fc fc-ltr">
<table class="fc-header" style="width:100%">
<tbody>
<tr>
<td class="fc-header-left"><span class="fc-button fc-button-prev fc-state-default fc-corner-left fc-corner-right" unselectable="on" style="display: inline-block;"><span class="fc-text-arrow">‹</span></span>
</td>
<td class="fc-header-center"><span class="fc-header-title"><h2>March 2020</h2></span></td>
<td class="fc-header-right"><span class="fc-button fc-button-next fc-state-default fc-corner-left fc-corner-right" unselectable="on" style="display: inline-block;"><span class="fc-text-arrow">›</span></span>
</td>
</tr>
</tbody>
</table>
<div class="fc-content" style="position: relative;">
<div class="fc-view fc-view-month fc-grid" style="position:relative" unselectable="on">
<div class="fc-event-container" style="position:absolute;z-index:8;top:0;left:0"></div>
<table class="fc-border-separate" style="width:100%" cellspacing="0">
<thead>
<tr class="fc-first fc-last">
<th class="fc-day-header fc-sun fc-widget-header fc-first" style="width: 50px;">Sun</th>
<th class="fc-day-header fc-mon fc-widget-header" style="width: 50px;">Mon</th>
<th class="fc-day-header fc-tue fc-widget-header" style="width: 50px;">Tue</th>
<th class="fc-day-header fc-wed fc-widget-header" style="width: 50px;">Wed</th>
<th class="fc-day-header fc-thu fc-widget-header" style="width: 50px;">Thu</th>
<th class="fc-day-header fc-fri fc-widget-header" style="width: 50px;">Fri</th>
<th class="fc-day-header fc-sat fc-widget-header fc-last">Sat</th>
</tr>
</thead>
<tbody>
<tr class="fc-week fc-first">
<td class="fc-day fc-sun fc-widget-content fc-future fc-first" data-date="2020-03-01">
<div style="min-height: 40px;">
<div class="fc-day-number">1</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-mon fc-widget-content fc-future" data-date="2020-03-02">
<div>
<div class="fc-day-number">2</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-tue fc-widget-content fc-future" data-date="2020-03-03">
<div>
<div class="fc-day-number">3</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-wed fc-widget-content fc-future" data-date="2020-03-04">
<div>
<div class="fc-day-number">4</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-thu fc-widget-content fc-future" data-date="2020-03-05">
<div>
<div class="fc-day-number">5</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-fri fc-widget-content fc-future" data-date="2020-03-06" style="color: rgb(255, 106, 106);">
<div>
<div class="fc-day-number">6</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-sat fc-widget-content fc-future fc-last" data-date="2020-03-07" style="color: rgb(255, 106, 106);">
<div>
<div class="fc-day-number">7</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
</tr>
<tr class="fc-week">
<td class="fc-day fc-sun fc-widget-content fc-future fc-first" data-date="2020-03-08">
<div style="min-height: 39px;">
<div class="fc-day-number">8</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-mon fc-widget-content fc-future" data-date="2020-03-09" style="background-color: rgb(188, 237, 145); cursor: pointer;">
<div>
<div class="fc-day-number">9</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-tue fc-widget-content fc-future" data-date="2020-03-10">
<div>
<div class="fc-day-number">10</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-wed fc-widget-content fc-future" data-date="2020-03-11">
<div>
<div class="fc-day-number">11</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-thu fc-widget-content fc-future" data-date="2020-03-12">
<div>
<div class="fc-day-number">12</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-fri fc-widget-content fc-future" data-date="2020-03-13" style="color: rgb(255, 106, 106);">
<div>
<div class="fc-day-number">13</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-sat fc-widget-content fc-future fc-last" data-date="2020-03-14" style="color: rgb(255, 106, 106);">
<div>
<div class="fc-day-number">14</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
</tr>
<tr class="fc-week">
<td class="fc-day fc-sun fc-widget-content fc-future fc-first" data-date="2020-03-15">
<div style="min-height: 39px;">
<div class="fc-day-number">15</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-mon fc-widget-content fc-future" data-date="2020-03-16">
<div>
<div class="fc-day-number">16</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-tue fc-widget-content fc-future" data-date="2020-03-17">
<div>
<div class="fc-day-number">17</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-wed fc-widget-content fc-future" data-date="2020-03-18">
<div>
<div class="fc-day-number">18</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-thu fc-widget-content fc-future" data-date="2020-03-19" style="background-color: rgb(255, 150, 202); cursor: pointer;">
<div>
<div class="fc-day-number">19</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-fri fc-widget-content fc-future" data-date="2020-03-20" style="color: rgb(255, 106, 106);">
<div>
<div class="fc-day-number">20</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-sat fc-widget-content fc-future fc-last" data-date="2020-03-21" style="color: rgb(255, 106, 106);">
<div>
<div class="fc-day-number">21</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
</tr>
<tr class="fc-week">
<td class="fc-day fc-sun fc-widget-content fc-future fc-first" data-date="2020-03-22" style="background-color: rgb(188, 237, 145); cursor: pointer;">
<div style="min-height: 39px;">
<div class="fc-day-number">22</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-mon fc-widget-content fc-future" data-date="2020-03-23" style="background-color: rgb(188, 237, 145); cursor: pointer;">
<div>
<div class="fc-day-number">23</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-tue fc-widget-content fc-future" data-date="2020-03-24" style="background-color: rgb(188, 237, 145); cursor: pointer;">
<div>
<div class="fc-day-number">24</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-wed fc-widget-content fc-future" data-date="2020-03-25" style="background-color: rgb(188, 237, 145); cursor: pointer;">
<div>
<div class="fc-day-number">25</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-thu fc-widget-content fc-future" data-date="2020-03-26" style="background-color: rgb(188, 237, 145); cursor: pointer;">
<div>
<div class="fc-day-number">26</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-fri fc-widget-content fc-future" data-date="2020-03-27" style="color: rgb(255, 106, 106);">
<div>
<div class="fc-day-number">27</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-sat fc-widget-content fc-future fc-last" data-date="2020-03-28" style="color: rgb(255, 106, 106);">
<div>
<div class="fc-day-number">28</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
</tr>
<tr class="fc-week">
<td class="fc-day fc-sun fc-widget-content fc-future fc-first" data-date="2020-03-29" style="background-color: rgb(188, 237, 145); cursor: pointer;">
<div style="min-height: 39px;">
<div class="fc-day-number">29</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-mon fc-widget-content fc-future" data-date="2020-03-30" style="background-color: rgb(188, 237, 145); cursor: pointer;">
<div>
<div class="fc-day-number">30</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-tue fc-widget-content fc-future" data-date="2020-03-31" style="background-color: rgb(188, 237, 145); cursor: pointer;">
<div>
<div class="fc-day-number">31</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-wed fc-widget-content fc-other-month fc-future" data-date="2020-04-01" style="background-color: white;">
<div>
<div class="fc-day-number">1</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-thu fc-widget-content fc-other-month fc-future" data-date="2020-04-02" style="background-color: white;">
<div>
<div class="fc-day-number">2</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-fri fc-widget-content fc-other-month fc-future" data-date="2020-04-03" style="background-color: white;">
<div>
<div class="fc-day-number">3</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-sat fc-widget-content fc-other-month fc-future fc-last" data-date="2020-04-04" style="background-color: white;">
<div>
<div class="fc-day-number">4</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
</tr>
<tr class="fc-week fc-last">
<td class="fc-day fc-sun fc-widget-content fc-other-month fc-future fc-first" data-date="2020-04-05" style="background-color: white;">
<div style="min-height: 41.3333px;">
<div class="fc-day-number">5</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-mon fc-widget-content fc-other-month fc-future" data-date="2020-04-06" style="background-color: white;">
<div>
<div class="fc-day-number">6</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-tue fc-widget-content fc-other-month fc-future" data-date="2020-04-07" style="background-color: white;">
<div>
<div class="fc-day-number">7</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-wed fc-widget-content fc-other-month fc-future" data-date="2020-04-08" style="background-color: white;">
<div>
<div class="fc-day-number">8</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-thu fc-widget-content fc-other-month fc-future" data-date="2020-04-09" style="background-color: white;">
<div>
<div class="fc-day-number">9</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-fri fc-widget-content fc-other-month fc-future" data-date="2020-04-10" style="background-color: white;">
<div>
<div class="fc-day-number">10</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
<td class="fc-day fc-sat fc-widget-content fc-other-month fc-future fc-last" data-date="2020-04-11" style="background-color: white;">
<div>
<div class="fc-day-number">11</div>
<div class="fc-day-content">
<div style="position: relative; height: 0px;"> </div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
<div class="fc-cell-overlay" style="position: absolute; z-index: 3; top: 100.667px; left: 200px; width: 50px; height: 40px;"></div>
</div>
</div>
</div>
Assuming that you already hold the HTML source under selenium driver.page_source so we are going to pass it to the soup and parse it.
from bs4 import BeautifulSoup
soup = BeautifulSoup(driver.page_source, 'html.parser')
for item in soup.findAll("td", {'style': 'background-color: rgb(188, 237, 145); cursor: pointer;'}):
print(item.get("data-date"))
Output:
2020-03-09
2020-03-22
2020-03-23
2020-03-24
2020-03-25
2020-03-26
2020-03-29
2020-03-30
2020-03-31
In case if you don't have bs4 installed, you can install it via pip install bs4 --user
Related
I'm having a 2 models Zone and DailyTask So I want to make a table in the front end(HTML)
that like image is shown below. U is used_tasks UN is unused_tasks T total_tasks
I want list this data for each zones for the currusponding timeslots this is my current code
model one Zone
class DailyTask(models.Model):
date = models.DateField()
zone = models.ForeignKey(Zone, on_delete=models.SET_NULL, null=True)
slot = models.ForeignKey(GeneralTimeSlot,related_name='daily_task', on_delete=models.CASCADE)
total_tasks = models.IntegerField(default=0)
used_tasks = models.IntegerField(default=0)
unused_tasks = models.IntegerField(default=0)
available_driver_slots = models.ManyToManyField(DriverTimeSlot)
model two Zone
class Zone(models.Model):
name = models.CharField(max_length=200)
coordinates = models.TextField(null=True, blank=True)
time slot view.py
def get(self, request, *args, **kwargs):
zones = Zone.objects.all()
today = datetime.date.today()
daily_task = DailyTask.objects.filter(date="2022-06-04")
return render(request, self.template_name, {'zones': zones, 'daily_tasks': daily_task})
template timeslotreport.html
{% extends 'macro-admin/base.html' %}
{% load crispy_forms_tags %}
{% block title %}
<title>Time Slot Report</title>
{% endblock %}
{% block content %}
<style type="text/css">
table {
border-collapse: collapse;
width: 100%;
}
td, th {
text-align: left;
padding: 8px;
}
tr:nth-child(even) {
background-color: #dddddd;
}
.button1 button{
border: 2px solid #3783b5;
border-radius: 5px;
padding: 5px 15px;
margin: 2px 0;
background-color: white;
width: 80px;
}
.under{
text-decoration:underline;
}
.order2 .card-title{
font-size: 25px!important;
}
.order2 button{
float: right;
padding: 10px 80px!important;
}
.marg{
padding-top: 50px;
}
.marg .row{
padding: 10px;
border-bottom: 1px solid #ece4e4;
}
.settle h4{
float: right;
padding: 5px 20px;
border: 2px solid #3783b5;
border-radius: 10px;
font-size: 15px;
}
.settle2 h4{
float: left;
padding: 5px 20px;
border: 2px solid #3783b5;
border-radius: 10px;
font-size: 15px;
}
input#birthday {
padding: 8px 10px!important;
min-width: 144px!important;
margin: 0 10px!important;
border-radius: 5px!important;
border: 1px solid #3f57ff!important;
background: #3f57ff!important;
color-scheme: dark!important;
}
</style>
<div class="container-fluid">
<div class="card" >
<div class="card-header order2">
<a class="card-title">
Time Slot Report
</a>
</div>
</div>
<div class="col-lg-12 col-md-12">
<div class="row my-2">
<div class="col-12 d-flex justify-content-md-center sort-index">
<form class="form-inline" action="/action_page.php">
<input type="date" id="birthday" name="birthday">
</form>
</div>
</div>
</div>
<hr>
<div class="card">
<!--<div class="card-header">
<h4 class="card-title">
Default
</h4>
</div> -->
<div class="card-body">
<div class="table-responsive">
<table class="table table-striped">
<thead>
<tr>
<th scope="col">Time Slots</th>
{% for z in zones %}
<th scope="col">{{ z.name }}</th>
{% endfor %}
<th scope="col">Total used</th>
<th scope="col">Total unused</th>
<th scope="col">Total</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="col"></th>
{% for z in zones %}
<th scope="col">U / Un / T</th>
{% endfor %}
<th scope="col"></th>
<th scope="col"></th>
<th scope="col"></th>
</tr>
{% for zone in zones|slice:":1" %}
{% for task in daily_tasks %}
{% if task.zone.id == zone.id %}
<tr>
<th class="align-middle text-center" scope="row">{{ task.slot.start_time.time }} - {{ task.slot.end_time.time }}</th>
{% for zo in zones %}
{% if task.zone.id == zone.id %}
<td class="align-middle text-center">{{ task.used_tasks }} / {{ task.unused_tasks }} / {{ task.total_tasks }}</td>
{% endif %}
{% endfor %}
</tr>
{% endif %}
{% endfor %}
{% endfor %}
</tbody>
</table>
</div>
</div>
<th class="align-middle text-center" scope="row">08:00:00AM - 09:00:00AM</th>
</tr>
<tr>
<th class="align-middle text-center" scope="row">09:00:00AM - 10:00:00AM</th>
</tr>
<tr>
<th class="align-middle text-center" scope="row">10:00:00AM - 11:00:00AM</th>
<td class="align-middle text-center">
{% for zone in zones %}
{% if zone.name == "Zone A" %}
{{ zone }}
{% endif %}
{% endfor %}
</td>
</tr>
<tr>
<th class="align-middle text-center" scope="row">12:00:00PM - 01:00:00PM</th>
</tr>
<tr>
<th class="align-middle text-center" scope="row">04:00:00PM - 05:00:00PM</th>
</tr>
<tr>
<th class="align-middle text-center" scope="row">05:00:00PM - 06:00:00PM</th>
</tr>
<tr>
<th class="align-middle text-center" scope="row">06:00:00PM - 07:00:00PM</th>
</tr>
<tr>
<th class="align-middle text-center" scope="row">07:00:00PM - 08:00:00PM</th>
</tr>
<tr>
<th class="align-middle text-center" scope="row">08:00:00PM - 09:00:00PM</th>
</tr>
<tr>
<th class="align-middle text-center" scope="row">09:00:00PM - 10:00:00PM</th>
</div>
<div class="card-body bg-fade">
<div class="d-flex align-items-center justify-content-center">
<nav aria-label="Page navigation" class="mr-3">
<ul class="pagination m-0">
<li class="page-item">
<a class="page-link" href="#" aria-label="Previous">
<span aria-hidden="true">«</span>
<span class="sr-only">Previous</span>
</a>
</li>
<li class="page-item active"><a class="page-link" href="#">1</a></li>
<li class="page-item"><a class="page-link" href="#">2</a></li>
<li class="page-item"><a class="page-link" href="#">3</a></li>
<li class="page-item">
<a class="page-link" href="#" aria-label="Next">
<span aria-hidden="true">»</span>
<span class="sr-only">Next</span>
</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
the result i want is data on this image
I am very new to Selenium but I don't find any answer to this question. I have written some code that runs a search on this site by entering the RIZIV-NR and clicking the search button. The question I have is how I can get the HTML code of the site AFTER running this search. The result of the following code is I think only the original HTML but does not have the info I want.
driver = webdriver.Chrome("C:/Program Files (x86)/chromedriver.exe")
driver.get("https://ondpanon.riziv.fgov.be/SilverPages/nl")
elem = driver.find_element_by_name("NihdiNumber")
elem.clear()
elem.send_keys("51680610")
time.sleep(4)
button = driver.find_element_by_id("SearchButton").click()
element = driver.find_element_by_xpath("//body").get_attribute('innerHTML')
print(element)
ps. this is my first ever question here so if you need more info please tell me.
Once you enter the input for RIZIV-NR field and initiate the search you need to induce WebDriverWait for the visibility_of_element_located() for the SearchResults and then you can extract the page_source using the following locator strategies:
Code Block:
driver.get("https://ondpanon.riziv.fgov.be/SilverPages/nl")
WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//input[#name='NihdiNumber']"))).send_keys("51680610")
driver.find_element(By.XPATH, "//button[#id='SearchButton']").click()
WebDriverWait(driver, 20).until(EC.visibility_of_element_located((By.XPATH, "//div[#id='SearchResults']")))
print(driver.page_source)
Note : You have to add the following imports :
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.common.by import By
from selenium.webdriver.support import expected_conditions as EC
Console Output:
<html style="" class=" js flexbox flexboxlegacy canvas canvastext webgl no-touch geolocation postmessage websqldatabase indexeddb hashchange history draganddrop websockets rgba hsla multiplebgs backgroundsize borderimage borderradius boxshadow textshadow opacity cssanimations csscolumns cssgradients cssreflections csstransforms csstransforms3d csstransitions fontface generatedcontent video audio localstorage sessionstorage webworkers no-applicationcache svg inlinesvg smil svgclippaths"><head><style>.gm-style-moc{background-color:rgba(0,0,0,.45);pointer-events:none;text-align:center;transition:opacity ease-in-out}.gm-style-mot{color:white;font-family:Roboto,Arial,sans-serif;font-size:22px;margin:0;position:relative;top:50%;transform:translateY(-50%);-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%)}
</style><style>.gm-style img{max-width: none;}.gm-style {font: 400 11px Roboto, Arial, sans-serif; text-decoration: none;}</style>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>RIZIV - Zoeken</title>
<link href="/SilverPages/Content/bootstrap.min.css" rel="stylesheet">
<script type="text/javascript" async="" src="https://www.google-analytics.com/analytics.js"></script><script async="" src="https://www.googletagmanager.com/gtag/js?id=UA-136603939-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() { dataLayer.push(arguments); }
gtag('js', new Date());
gtag('config', 'UA-136603939-1');
</script>
<link href="/SilverPages/Content/css?v=nqXsXhEhXvUqGI-XBjZzVdwpXkCtCzpmQq7x-XyULgQ1" rel="stylesheet">
<link href="/SilverPages/Content/themes/base/css?v=iUtWiGhtM4VCb8LHz23eU27gxBsVt9jn05Q7RZSvLNU1" rel="stylesheet">
<script src="/SilverPages/bundles/modernizr?v=dUz_C7QKTmbjqpHGnN4fhYIhS-YQnnG5Pqseul2b8PQ1"></script>
<script src="/SilverPages/bundles/jquery?v=lAWanvxuK91VI6uSCdWzhvtofm0aK0rptSpK6X6X2d01"></script>
<script src="/SilverPages/bundles/jqueryui?v=G3zUI26k8shDvs3PSo5GPkxFSWclClRdLVUnA01ZKc01"></script>
<script src="/SilverPages/bundles/jqueryval?v=8cA8qijPw0YgarjqUNELeEbhw5EBPkFVGxUnJZt_13U1"></script>
<script src="/SilverPages/bundles/jqueryplugins?v=EbWBzsX99QRVUrnPAvNPrmTjH0epEBjaSUbHCy7rZpU1"></script>
<script src="/SilverPages/Scripts/bootstrap.min.js"></script>
<script type="text/javascript" charset="UTF-8" src="https://maps.googleapis.com/maps-api-v3/api/js/48/10/intl/nl_ALL/common.js"></script><script type="text/javascript" charset="UTF-8" src="https://maps.googleapis.com/maps-api-v3/api/js/48/10/intl/nl_ALL/util.js"></script><script type="text/javascript" charset="UTF-8" src="https://maps.googleapis.com/maps-api-v3/api/js/48/10/intl/nl_ALL/map.js"></script><script type="text/javascript" charset="UTF-8" src="https://maps.googleapis.com/maps-api-v3/api/js/48/10/intl/nl_ALL/onion.js"></script></head>
<body>
<div id="wrap">
<div id="banner">
<div class="container" id="logo">
<div class="row" style="padding-top: 2px; padding-bottom: 2px;">
<div class="col-md-2">
<ul id="languages">
<li>nl</li>
<li>fr</li>
</ul>
<form method="post" action="/SilverPages/nl/App/SetCulture" id="languageForm" novalidate="novalidate">
<input id="language" name="language" type="hidden" value="">
<input id="returnUrl" name="returnUrl" type="hidden" value="/SilverPages/nl">
</form>
</div>
<div class="col-md-10 text-right hidden-xs small">
<img src="/SilverPages/Content/images/blgm_beLogo.gif" style="float: right;">
<div class="beborder">
Terug naar de website van het Riziv: riziv.be -
Andere informatie en overheidsdiensten: belgie.be
</div>
</div>
</div>
<div class="row" style="padding-top: 5px; padding-bottom: 10px;">
<div class="col-xs-6 col-md-2">
<img src="/SilverPages/Content/images/riziv-logo-nl.png">
</div>
<div class="col-md-8 visible-md visible-lg">
<h4 style="color: #009cbb;">Rijksinstituut voor ziekte- en invaliditeitsverzekering</h4>
</div>
<div class="col-xs-6 col-md-2 text-right hidden">
</div>
</div>
</div>
</div>
<div class="navbar navbar-default " role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/SilverPages/nl">Een zorgverlener zoeken</a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav" id="NavMain">
<li id="NavHomeIndex" class="active">Zoeken</li>
<li id="NavHomeContact">Contact</li>
</ul>
</div>
<!--/.nav-collapse -->
</div>
</div>
<div class="container">
<div class="alert alert-info" id="CookieNotification">
<span class="glyphicon glyphicon-info-sign"></span>
<strong>Cookies</strong>
<p>Onze webtoepassing maakt gebruik van cookies, onder andere om de website te analyseren en zich aan te passen aan de bezoekerservaring. Door gebruik te maken van deze website geeft u toestemming voor het gebruik van cookies. Klik op «Bevestigen» om uw toestemming te registreren en deze boodschap niet meer te zien.</p>
<button type="button" class="btn btn-info" style="float: right;" id="CookieButton">Bevestigen</button>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="well more-info">
<p>
Zoekt u een zorgverlener en wilt u weten of hij/zij geconventioneerd is? Dan kan u via deze webtoepassing een opzoeking doen. Indien de zorgverlener geconventioneerd is, bent u zeker dat u de officiële tarieven betaalt, zonder supplementen (behalve in situaties waarbij deze supplementen reglementair zijn toegelaten).<br>
</p>
<div class="hidden more-info-content">
<table class="table-condensed">
<tbody><tr>
<td colspan="2">
Als de zorgverlener via
MyRiziv
een werkadres geregistreerd heeft, is dit adres zichtbaar in de zoekresultaten. U heeft in dat geval ook de mogelijkheid dit adres te bekijken op een kaart.
</td>
</tr>
<tr>
<td>
<img src="/SilverPages/Content/images/starOfLife_yes_sm.png">
</td>
<td>
Geconventioneerd: past de officiële tarieven toe (behalve in situaties waarbij supplementen reglementair zijn toegelaten).
</td>
</tr>
<tr>
<td>
<img src="/SilverPages/Content/images/starOfLife_partial_sm.png">
</td>
<td>
Gedeeltelijk geconventioneerd: past de officiële tarieven gedeeltelijk toe, d.w.z. past de officiële tarieven toe op bepaalde tijdstippen (bepaalde dagen of bepaalde uren op een dag) of op bepaalde plaatsen (bv. privé-praktijk of ziekenhuispraktijk), behalve in situaties waarbij supplementen reglementair zijn toegelaten.
Alleen de artsen en tandartsen kunnen gedeeltelijk geconventioneerd zijn.
</td>
</tr>
<tr>
<td>
<img src="/SilverPages/Content/images/starOfLife_no_sm.png">
</td>
<td>
Niet geconventioneerd: is vrij om de honoraria te bepalen.
</td>
</tr>
<tr>
<td>
<img src="/SilverPages/Content/images/starOfLife_unknown_sm.png">
</td>
<td>
Conventioneringsstatuut nog niet gekend.
</td>
</tr>
<tr>
<td> _</td>
<td>Geen overeenkomst/akkoord voor dit beroep (dit is altijd het geval voor diëtisten, ergotherapeuten, orthoptisten en podologen).</td>
</tr>
</tbody></table>
</div>
<button type="button" class="btn btn-info more-info-toglle" style="float: right;" data-text-expanded="Minder informatie" data-text-collapsed="Meer informatie">Meer informatie</button>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12 form-group">
<form id="SearchForm" novalidate="novalidate">
<div class="row">
<input class="form-control" id="NorthEastLat" name="NorthEastLat" type="hidden">
<input class="form-control" id="NorthEastLng" name="NorthEastLng" type="hidden">
<input class="form-control" id="SouthWestLat" name="SouthWestLat" type="hidden">
<input class="form-control" id="SouthWestLng" name="SouthWestLng" type="hidden">
</div>
<div class="row">
<div class="col-md-2 form-group">
<label for="LastName">Naam</label>
<input class="form-control" id="LastName" name="LastName" placeholder="Naam" type="text">
</div>
<div class="col-md-2 form-group">
<label for="FirstName">Voornaam</label>
<input class="form-control" id="FirstName" name="FirstName" placeholder="Voornaam" type="text">
</div>
<div class="col-md-4 form-group">
<label for="Profession">Wat</label>
<small class="text-muted">(Beroep)</small>
<select class="form-control" id="Profession" name="Profession" onchange="GetSpecialities(this.value)">
<option selected="selected" value="">Alle beroepen</option>
<option value="20">Apotheker</option>
<option value="68">Apotheker-bioloog</option>
<option value="10">Arts</option>
<option value="67">Audicien</option>
<option value="62">Bandagist</option>
<option value="56">Diëtist</option>
<option value="65">Ergotherapeut</option>
<option value="50">Kinesitherapeut</option>
<option value="98">Klinisch orthopedagoog</option>
<option value="78">Klinisch psycholoog</option>
<option value="63">Leverancier implantaten</option>
<option value="58">Logopedist</option>
<option value="66">Opticien</option>
<option value="61">Orthopedist</option>
<option value="59">Orthoptist</option>
<option value="57">Podoloog</option>
<option value="30">Tandarts</option>
<option value="41">Verpleegkundige</option>
<option value="40">Vroedvrouw</option>
</select>
</div>
<div id="speciality-section" class="on-form-reset-clear"></div>
<div class="col-md-4 form-group">
<label for="ConventionStatus">Conventioneringsstatus</label>
<select class="form-control" id="ConventionStatus" name="ConventionStatus">
<option selected="selected" value="">Alle statussen</option>
<option value="A">Geconventioneerd</option>
<option value="P">Gedeeltelijk geconventioneerd</option>
<option value="R">Niet geconventioneerd</option>
</select>
</div>
</div>
<div class="row">
<div class="col-md-4 form-group">
<label for="Where">Waar</label>
<small class="text-muted">(Postcode, gemeente of stad)</small> <span role="status" aria-live="polite" class="ui-helper-hidden-accessible"></span><input class="form-control ui-autocomplete-input" id="Where" name="Where" placeholder="Postcode, gemeente of stad" type="text" autocomplete="off">
</div>
<div class="col-md-4 form-group">
<label for="NihdiNumber">RIZIV-nr</label>
<small class="text-muted">(8 eerste cijfers of minder)</small> <input class="form-control valid" id="NihdiNumber" name="NihdiNumber" placeholder="RIZIV-nr" type="text">
</div>
<div class="col-md-4 form-group" id="qualDiv">
<label for="Qualification">Kwalificatie</label>
<small class="text-muted">(Bevoegdheidscode, 3 cijfers)</small> <input class="form-control" id="Qualification" name="Qualification" placeholder="Bevoegdheidscode, 3 cijfers" type="text">
</div>
</div>
<div class="row">
<div class="col-md-4 text-left">
<!-- No map -->
<div id="NoResults" style="display: none">
<!-- zero results -->
<small><i>Geen resultaten gevonden, gelieve uw zoekopdracht te verfijnen.</i> </small>
</div>
<div id="ToMuchResults" style="display: none">
<!-- to many results -->
<small><i>Er zijn te veel resultaten om op een kaart te tonen. Gelieve uw zoekopdracht te verfijnen.</i> </small>
</div>
<div id="NotConformCriteria" style="display: none">
<!-- show text -->
<small><i>Om de zoekresultaten op een kaart te kunnen weergeven, moet u minstens zoeken op beroep, naam of RIZIV-nummer.</i> </small>
</div>
<button id="ShowAllOnMapButton" type="button" class="btn btn-info more-info" style="display: none" onclick="showMap()">
Toon alle resultaten op de kaart
</button>
</div>
<div class="col-md-4 text-center">
</div>
<div class="col-md-4 text-right">
<span id="results-count" class="on-form-reset-clear"><img src="/SilverPages/Content/images/spinner.gif"></span>
<button id="ResetButton" type="reset" class="btn btn-info form-reset-ajax" onclick="mapReset(true);">
Wissen
</button>
<button id="SearchButton" type="button" class="btn btn-info form-submit-ajax init-search" onclick="mapReset(true);" data-action="/SilverPages/nl/Home/SearchByForm?PageOffset=0&PageSize=200" data-target="#SearchResults">
Zoeken
</button>
</div>
</div>
<div class="row">
<div class="col-md-12" id="TitleMapWorkAddress2" style="display: none">
<br>
<div class="well">
<p>
Op deze kaart vindt u de zorgverleners terug die beantwoorden aan uw zoekcriteria en die bij het RIZIV een werkadres hebben geregistreerd. U kan via de kaart het gebied waar u een zorgverlener zoekt uitbreiden, verkleinen of verplaatsen (met het handje). Klik nadat u de kaart verplaatst heeft terug op 'dit gebied doorzoeken'.<br>
</p>
<div id="titleMapWorkAddressInfoContent" style="display: none">
<p>Aan de hand van de verschillende icoontjes kan u op de kaart in één oogopslag zien waar een zorgverlener werkt en wat zijn conventioneringsstatus is. Als u klikt op een icoontje, ziet u de basisgegevens van de zorgverlener.</p>
<p>Wilt u het gebied waar u een zorgverlener zoekt uitbreiden of kleiner maken? Gebruik dan de zoomfunctie en klik vervolgens op “Dit gebied doorzoeken” om uw zoekresultaten te vernieuwen. U kan ook de kaart verslepen en daarna op dezelfde manier uw zoekresultaten aanpassen.</p>
<p>De getoonde adressen zijn de werkadressen die zorgverleners via MyRiziv geregistreerd hebben. Zorgverleners zonder werkadres vindt u wel in de resultatenlijst, maar niet op de kaart. Als een zorgverlener zijn werkadres wijzigt, is dit hier vanaf de volgende dag hier zichtbaar.</p>
</div>
<button type="button" class="btn btn-info more-info" style="float: right;" id="titleWorkAdddresInfo">Meer informatie</button>
</div>
<br>
</div>
</div>
<div class="row">
<div class="col-md-12" id="TitleMapNoWorkAddress" style="display: none">
<p>
<br>
<strong>Geen enkele zorgverlener in de zoekresultaten heeft bij het RIZIV een werkadres geregistreerd. We kunnen de resultaten dan ook niet via de kaart weergeven. Kies een nieuw zoekgebied door in de kaart de zoomfunctie te gebruiken of de kaart te verslepen en klik vervolgens op “Dit gebied doorzoeken” om uw zoekresultaten te vernieuwen. </strong>
<br>
</p>
</div>
</div>
<div class="row" id="mapcontainer" style="display: none">
<div class="col-md-12">
<div class="panel panel-default">
<div class="panel-heading">
<div class="row" align="center">
<span id="results-count-map" class="on-form-reset-clear"></span>
<button id="SearchButtonMap" type="button" class="btn btn-info form-submit-ajax init-search-map" onclick="GetCoordinates()" data-action="/SilverPages/nl/Home/SearchByMap?PageOffset=0&PageSize=200" data-target="#SearchResults">
Dit gebied doorzoeken
</button>
</div>
</div>
<div class="panel-body" id="map" style="height: 500px; width: 100%; position: relative; overflow: hidden;"><div style="height: 100%; width: 100%; position: absolute; top: 0px; left: 0px; background-color: rgb(229, 227, 223);"><div style="overflow: hidden;"></div><div class="gm-style" style="position: absolute; z-index: 0; left: 0px; top: 0px; height: 100%; width: 100%; padding: 0px; border-width: 0px; margin: 0px;"><div tabindex="0" aria-label="Kaart" aria-roledescription="kaart" role="region" style="position: absolute; z-index: 0; left: 0px; top: 0px; height: 100%; width: 100%; padding: 0px; border-width: 0px; margin: 0px; cursor: url("https://maps.gstatic.com/mapfiles/openhand_8_8.cur"), default; touch-action: pan-x pan-y;"><div style="z-index: 1; position: absolute; left: 50%; top: 50%; width: 100%;"><div style="position: absolute; left: 0px; top: 0px; z-index: 100; width: 100%;"><div style="position: absolute; left: 0px; top: 0px; z-index: 0;"></div></div><div style="position: absolute; left: 0px; top: 0px; z-index: 101; width: 100%;"></div><div style="position: absolute; left: 0px; top: 0px; z-index: 102; width: 100%;"></div><div style="position: absolute; left: 0px; top: 0px; z-index: 103; width: 100%;"></div><div style="position: absolute; left: 0px; top: 0px; z-index: 0;"></div></div><div style="z-index: 3; position: absolute; height: 100%; width: 100%; padding: 0px; border-width: 0px; margin: 0px; left: 0px; top: 0px; touch-action: pan-x pan-y;"><div style="z-index: 4; position: absolute; left: 50%; top: 50%; width: 100%;"><div style="position: absolute; left: 0px; top: 0px; z-index: 104; width: 100%;"></div><div style="position: absolute; left: 0px; top: 0px; z-index: 105; width: 100%;"></div><div style="position: absolute; left: 0px; top: 0px; z-index: 106; width: 100%;"><span id="4CFF71D5-5B09-48A7-A1A8-049A03DBF164" style="display: none;">Druk op de pijltoetsen om te navigeren.</span></div><div style="position: absolute; left: 0px; top: 0px; z-index: 107; width: 100%;"></div></div></div><div class="gm-style-moc" style="z-index: 4; position: absolute; height: 100%; width: 100%; padding: 0px; border-width: 0px; margin: 0px; left: 0px; top: 0px; opacity: 0;"><p class="gm-style-mot"></p></div></div><iframe aria-hidden="true" frameborder="0" tabindex="-1" style="z-index: -1; position: absolute; width: 100%; height: 100%; top: 0px; left: 0px; border: none;"></iframe><div style="pointer-events: none; width: 100%; height: 100%; box-sizing: border-box; position: absolute; z-index: 1000002; opacity: 0; border: 2px solid rgb(26, 115, 232);"></div></div></div></div>
</div>
</div>
</div>
</form>
</div>
</div>
.
.
<script async="" defer="" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBaXLvd35FOBehSmQkdZDHs7QZb-N5plHM&callback=initMap&language=nl®ion=BE&libraries=geometry"></script>
<div id="SearchResults" class="on-form-reset-clear">
</div>
</div>
</div>
<div class="navbar navbar-default" style="background-color: #c6e5ec;">
<div class="container">
<br>
<div class="col-md-5">
<p style="font-size: 90%">©RIZIV, alle rechten voorbehouden</p>
</div>
<div class="col-md-6">
<p style="color: #2d3235; font-size: 85%">
Dev 3.4.769.1 (04-06-21)
<a style="color: #808080; font-size: 85%">
- 1.53.2085.1 (21/04/21)
</a>
</p></div>
<div class="col-md-1">
<p>
<a style="font-size: 90%; color: #2d3235" href="/SilverPages/nl/Home/Liability">Disclaimer</a>
</p>
</div>
</div>
</div>
<a id="back-top" class="hidden-print" href="#top" style="display: none;">
<i class="glyphicon glyphicon-chevron-up"></i>
</a>
<script src="/SilverPages/Scripts/Nihdi-SilverPages.js"></script>
<ul class="ui-autocomplete ui-front ui-menu ui-widget ui-widget-content ui-corner-all" id="ui-id-1" tabindex="0" style="display: none;"></ul><div style="position: absolute; left: 0px; top: -2px; height: 1px; overflow: hidden; visibility: hidden; width: 1px;"><span style="position: absolute; font-size: 300px; width: auto; height: auto; margin: 0px; padding: 0px; font-family: Roboto, Arial, sans-serif;">BESbswy</span></div><div style="position: absolute; left: 0px; top: -2px; height: 1px; overflow: hidden; visibility: hidden; width: 1px;"><span style="position: absolute; font-size: 300px; width: auto; height: auto; margin: 0px; padding: 0px; font-family: Roboto, Arial, sans-serif;">BESbswy</span></div><div style="position: absolute; left: 0px; top: -2px; height: 1px; overflow: hidden; visibility: hidden; width: 1px;"><span style="position: absolute; font-size: 300px; width: auto; height: auto; margin: 0px; padding: 0px; font-family: Roboto, Arial, sans-serif;">BESbswy</span></div></body></html>
I have created a map using python and folium library from this code and i need to visualize it in my html webpage :
import folium
m = folium.Map(
location=[56.462490 , 13.753191],
width= 650,
height=550,
zoom_start=4.36,
tiles='https://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer/tile/{z}/{y}/{x}',
attr='My Data Attribution'
)
folium.GeoJson(
r'/Users/bader/Desktop/pandaTable/european-union-countries.geojson',
name='geoJson',
tooltip=folium.features.GeoJsonTooltip(
fields=['name_sort'],
aliases=['Name'],
sticky=True,
opacity=2.3,
direction='right',
),
).add_to(m)
m.save('map.html')
I need to have it in this html page in iframe tag(its google map for now):
<!DOCTYPE html>
<html style="font-size: 16px;">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="utf-8">
<meta name="keywords" content="">
<meta name="description" content="">
<meta name="page_type" content="np-template-header-footer-from-plugin">
<title>Cases</title>
<link rel="stylesheet" href="nicepage.css" media="screen">
<link rel="stylesheet" href="Cases.css" media="screen">
<script class="u-script" type="text/javascript" src="jquery.js" defer=""></script>
<script class="u-script" type="text/javascript" src="nicepage.js" defer=""></script>
<meta name="generator" content="Nicepage 3.11.0, nicepage.com">
<link id="u-theme-google-font" rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i|Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i">
<script type="application/ld+json">{
"#context": "http://schema.org",
"#type": "Organization",
"name": "Safehub19",
"url": "index.html"
}</script>
<meta property="og:title" content="Cases">
<meta property="og:type" content="website">
<meta name="theme-color" content="#478ac9">
<link rel="canonical" href="index.html">
<meta property="og:url" content="index.html">
</head>
<body class="u-body"><header class="u-clearfix u-custom-color-2 u-header u-header" id="sec-0b4f"><nav class="u-menu u-menu-dropdown u-offcanvas u-menu-1">
<div class="menu-collapse" style="font-size: 1.25rem; letter-spacing: 0px;">
<a class="u-button-style u-custom-active-border-color u-custom-active-color u-custom-border u-custom-border-color u-custom-borders u-custom-hover-border-color u-custom-hover-color u-custom-left-right-menu-spacing u-custom-padding-bottom u-custom-text-active-color u-custom-text-color u-custom-text-hover-color u-custom-text-shadow u-custom-text-shadow-blur u-custom-text-shadow-color u-custom-text-shadow-transparency u-custom-text-shadow-x u-custom-text-shadow-y u-custom-top-bottom-menu-spacing u-nav-link u-text-active-palette-1-base u-text-hover-palette-2-base" href="#">
<svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#menu-hamburger"></use></svg>
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><symbol id="menu-hamburger" viewBox="0 0 16 16" style="width: 16px; height: 16px;"><rect y="1" width="16" height="2"></rect><rect y="7" width="16" height="2"></rect><rect y="13" width="16" height="2"></rect>
</symbol>
</defs></svg>
</a>
</div>
<div class="u-custom-menu u-nav-container">
<ul class="u-custom-font u-nav u-spacing-2 u-text-font u-unstyled u-nav-1"><li class="u-nav-item"><a class="u-active-grey-5 u-border-active-palette-1-base u-border-hover-palette-1-base u-button-style u-hover-grey-10 u-nav-link u-text-active-grey-90 u-text-grey-90 u-text-hover-grey-90" href="Home.html" style="padding: 10px 20px;">Home</a>
</li><li class="u-nav-item"><a class="u-active-grey-5 u-border-active-palette-1-base u-border-hover-palette-1-base u-button-style u-hover-grey-10 u-nav-link u-text-active-grey-90 u-text-grey-90 u-text-hover-grey-90" href="Cases.html" style="padding: 10px 20px;">Cases</a>
</li><li class="u-nav-item"><a class="u-active-grey-5 u-border-active-palette-1-base u-border-hover-palette-1-base u-button-style u-hover-grey-10 u-nav-link u-text-active-grey-90 u-text-grey-90 u-text-hover-grey-90" href="Vaccination.html" style="padding: 10px 20px;">Vaccination</a>
</li></ul>
</div>
<div class="u-custom-menu u-nav-container-collapse">
<div class="u-black u-container-style u-inner-container-layout u-opacity u-opacity-95 u-sidenav">
<div class="u-sidenav-overflow">
<div class="u-menu-close"></div>
<ul class="u-align-center u-nav u-popupmenu-items u-unstyled u-nav-2"><li class="u-nav-item"><a class="u-button-style u-nav-link" href="Home.html" style="padding: 10px 20px;">Home</a>
</li><li class="u-nav-item"><a class="u-button-style u-nav-link" href="Cases.html" style="padding: 10px 20px;">Cases</a>
</li><li class="u-nav-item"><a class="u-button-style u-nav-link" href="Vaccination.html" style="padding: 10px 20px;">Vaccination</a>
</li></ul>
</div>
</div>
<div class="u-black u-menu-overlay u-opacity u-opacity-70"></div>
</div>
</nav><img class="u-image u-image-1" src="images/newh1.png" data-image-width="1291" data-image-height="855" data-href="#"></header>
<section class="u-align-center u-clearfix u-custom-color-4 u-section-1" id="carousel_07be">
<div class="u-clearfix u-sheet u-sheet-1">
<h1 class="u-text u-text-1">DAILY UPDATE </h1>
<h1 class="u-text u-text-2">country name </h1>
<div class="u-grey-light-2 u-map u-map-1">
<div class="embed-responsive">
<iframe class="embed-responsive-item" src="//maps.google.com/maps?output=embed&q=Manhattan%2C%20New%20York&z=10&t=m" data-map="JTdCJTIycG9zaXRpb25UeXBlJTIyJTNBJTIybWFwLXBvaW50JTIyJTJDJTIyYWRkcmVzcyUyMiUzQSUyMk1hbmhhdHRhbiUyQyUyME5ldyUyMFlvcmslMjIlMkMlMjJ6b29tJTIyJTNBMTAlMkMlMjJ0eXBlSWQlMjIlM0ElMjJyb2FkJTIyJTJDJTIybGFuZyUyMiUzQSUyMiUyMiU3RA=="></iframe>
</div>
</div>
<div class="u-list u-repeater u-list-1">
<div class="u-align-center u-container-style u-list-item u-repeater-item">
<div class="u-container-layout u-similar-container u-container-layout-1">
<h3 class="u-text u-text-3" data-animation-name="counter" data-animation-event="scroll" data-animation-duration="3000">230</h3>
<h1 class="u-text u-text-4">CASES</h1>
</div>
</div>
<div class="u-align-center u-container-style u-list-item u-repeater-item">
<div class="u-container-layout u-similar-container u-container-layout-2">
<h3 class="u-text u-text-5" data-animation-name="counter" data-animation-event="scroll" data-animation-duration="3000">46</h3>
<h1 class="u-text u-text-6">DEATHS</h1>
</div>
</div>
<div class="u-align-center u-container-style u-list-item u-repeater-item">
<div class="u-container-layout u-similar-container u-container-layout-3">
<h3 class="u-text u-text-7" data-animation-name="counter" data-animation-event="scroll" data-animation-duration="3000">60</h3>
<h1 class="u-text u-text-8">Recoverd </h1>
</div>
</div>
<div class="u-align-center u-container-style u-list-item u-repeater-item">
<div class="u-container-layout u-similar-container u-container-layout-4">
<h3 class="u-text u-text-9" data-animation-name="counter" data-animation-event="scroll" data-animation-duration="3000">100</h3>
<h1 class="u-text u-text-10">CRITICAL </h1>
</div>
</div>
</div>
<img src="images/clipart21950221.png" alt="" class="u-image u-image-default u-image-1" data-image-width="406" data-image-height="357">
<img src="images/clipart104601.png" alt="" class="u-image u-image-default u-image-2" data-image-width="501" data-image-height="512">
<img src="images/clipart166497.png" alt="" class="u-image u-image-default u-image-3" data-image-width="2026" data-image-height="2400">
<img src="images/clipart2464149.png" alt="" class="u-image u-image-default u-image-4" data-image-width="326" data-image-height="481">
</div>
</section>
<section class="u-align-center u-clearfix u-custom-color-1 u-section-2" id="sec-f85d">
<div class="u-clearfix u-sheet u-sheet-1">
<div class="u-table u-table-responsive u-table-1">
<table class="u-table-entity u-table-entity-1">
<colgroup>
<col width="25%">
<col width="25%">
<col width="25%">
<col width="25%">
</colgroup>
<tbody class="u-table-body">
<tr style="height: 85px;">
<td class="u-border-1 u-border-grey-30 u-table-cell">Column 1</td>
<td class="u-border-1 u-border-grey-30 u-table-cell">Column 2</td>
<td class="u-border-1 u-border-grey-30 u-table-cell">Column 3</td>
<td class="u-border-1 u-border-grey-30 u-table-cell">Column 4</td>
</tr>
<tr style="height: 87px;">
<td class="u-border-1 u-border-grey-30 u-table-cell">Row 1</td>
<td class="u-border-1 u-border-grey-30 u-table-cell">Description</td>
<td class="u-border-1 u-border-grey-30 u-table-cell">Description</td>
<td class="u-border-1 u-border-grey-30 u-table-cell">Description</td>
</tr>
<tr style="height: 87px;">
<td class="u-border-1 u-border-grey-30 u-table-cell">Row 2</td>
<td class="u-border-1 u-border-grey-30 u-table-cell">Description</td>
<td class="u-border-1 u-border-grey-30 u-table-cell">Description</td>
<td class="u-border-1 u-border-grey-30 u-table-cell">Description</td>
</tr>
<tr style="height: 87px;">
<td class="u-border-1 u-border-grey-30 u-table-cell">Row 3</td>
<td class="u-border-1 u-border-grey-30 u-table-cell">Description</td>
<td class="u-border-1 u-border-grey-30 u-table-cell">Description</td>
<td class="u-border-1 u-border-grey-30 u-table-cell">Description</td>
</tr>
<tr style="height: 87px;">
<td class="u-border-1 u-border-grey-30 u-table-cell">Row 4</td>
<td class="u-border-1 u-border-grey-30 u-table-cell">Description</td>
<td class="u-border-1 u-border-grey-30 u-table-cell">Description</td>
<td class="u-border-1 u-border-grey-30 u-table-cell">Description</td>
</tr>
</tbody>
</table>
</div>
</div>
</section>
<section class="u-align-center u-clearfix u-custom-color-4 u-section-3" id="sec-39ca">
<div class="u-clearfix u-sheet u-sheet-1">
<h1 class="u-text u-text-1">CHART</h1>
<h1 class="u-text u-text-2">CHART</h1>
</div>
</section>
<style class="u-overlap-style">.u-overlap:not(.u-sticky-scroll) .u-header {
background-color: #e8e8e8 !important
}</style>
<footer class="u-align-center u-clearfix u-footer u-grey-80 u-footer" id="sec-5af5"><div class="u-clearfix u-sheet u-sheet-1">
<p class="u-small-text u-text u-text-variant u-text-1">Sample text. Click to select the text box. Click again or double click to start editing the text.</p>
</div></footer>
<section class="u-backlink u-clearfix u-grey-80">
<a class="u-link" href="https://nicepage.com/website-templates" target="_blank">
<span>Website Templates</span>
</a>
<p class="u-text">
<span>created with</span>
</p>
<a class="u-link" href="https://nicepage.com/" target="_blank">
<span>Website Builder Software</span>
</a>.
</section>
</body>
</html>
The end result should look like this and you can adjust the width and hight of the map to fix on the left side of the page :
[End result]
I'm trying to do a little script that writes an html file, this file must have a table which contains two rows that have some information about different products, I managed to get this done, but now I need that this table repeats as many times depending on a previous input data, so for this I thought I could multiply the function which contains the html code but it doesn't work, actually I'm not quite sure what I'm doing here so a little bit of help wouldn't be bad...
This is what I want:
Input ---> How many tables: 3
So the html output file should look something like this
<-- TABLE 1 -->
<table>
<tr>
<td colspan="4" height="30"></td>
</tr>
<tr>
<td width="50" class="width6p"></td>
<td width="260" class="width44p"><img src="http://site/image/CODEPRODUCT_1" width="230" alt="DESCRIPTION_1" style="display:block" border="0" class="width90p"/></td>
<td width="30" class="width3p"></td>
<td width="260" class="width44p"><img src="http://site/image/CODEPRODUCT_2" width="230" alt="DESCRIPTION_2" style="display:block" border="0" class="width90p"/></td>
</tr>
<tr>
<td></td>
<td class="font14" valign="top" style=" font-size: 16px; inline-height:0px; font-family:Helvetica, sans-serif; font-weight:lighter; color:#666666; line-height:130%; padding:10px 0px;">
<span style="font-weight: bold; color:#008EAA" class="font14">DESCRIPTION_1</span ><br />
<span style="font-weight: bold; color:#008EAA; font-size:14px;" class="font14"> DESCRIPTION_1</span><br/>
<span style="font-size:12px;" class="font12">SKU: CODEPRODUCT_-1</span><br />
<span style="font-size:18px;" class="font14">$ </span>
<span style="font-size:24px; line-height:30px;" class="font20">PRICE_1</span>
<span style="font-size:12px; text-transform: uppercase;" class="font10"> C/U</span> <br>
</td>
<td></td>
<td class="font14" valign="top" style=" font-size: 16px; inline-height:0px; font-family:Helvetica, sans-serif; font-weight:lighter; color:#666666; line-height:130%; padding:10px 0px;">
<span style="font-weight: bold; color:#008EAA" class="font14">DESCRIPTION_2</span><br />
<span style="font-weight: bold; color:#008EAA; font-size:14px;" class="font14"> DESCRIPTION_2</span><br/>
<span style="font-size:12px;" class="font12">SKU: CODEPRODUCT_-2</span><br />
<span style="font-size:18px;" class="font14">$ </span>
<span style="font-size:24px; line-height:30px;" class="font20">PRICE_2</span>
<span style="font-size:12px; text-transform: uppercase;" class="font10"> C/U</span> <br>
</td>
</tr>
<tr>
<td></td>
<td style="inline-height:0px;padding-top:4px;"><img src="http://www.site/images/loquiero_med.png" width="142" title="Ver producto" style="display:block" border="0" class="width115"/></td>
<td></td>
<td style="inline-height:0px;padding-top:4px;"><img src="http://www.site/images/loquiero_med.png" width="142" title="Ver producto" style="display:block" border="0" class="width115"/></td>
</tr>
</table>
<-- TABLE 2 -->
<table>
<tr>
<td colspan="4" height="30"></td>
</tr>
<tr>
<td width="50" class="width6p"></td>
<td width="260" class="width44p"><img src="http://site/image/CODEPRODUCT_1" width="230" alt="DESCRIPTION_1" style="display:block" border="0" class="width90p"/></td>
<td width="30" class="width3p"></td>
<td width="260" class="width44p"><img src="http://site/image/CODEPRODUCT_2" width="230" alt="DESCRIPTION_2" style="display:block" border="0" class="width90p"/></td>
</tr>
<tr>
<td></td>
<td class="font14" valign="top" style=" font-size: 16px; inline-height:0px; font-family:Helvetica, sans-serif; font-weight:lighter; color:#666666; line-height:130%; padding:10px 0px;">
<span style="font-weight: bold; color:#008EAA" class="font14">DESCRIPTION_1</span ><br />
<span style="font-weight: bold; color:#008EAA; font-size:14px;" class="font14"> DESCRIPTION_1</span><br/>
<span style="font-size:12px;" class="font12">SKU: CODEPRODUCT_-1</span><br />
<span style="font-size:18px;" class="font14">$ </span>
<span style="font-size:24px; line-height:30px;" class="font20">PRICE_1</span>
<span style="font-size:12px; text-transform: uppercase;" class="font10"> C/U</span> <br>
</td>
<td></td>
<td class="font14" valign="top" style=" font-size: 16px; inline-height:0px; font-family:Helvetica, sans-serif; font-weight:lighter; color:#666666; line-height:130%; padding:10px 0px;">
<span style="font-weight: bold; color:#008EAA" class="font14">DESCRIPTION_2</span><br />
<span style="font-weight: bold; color:#008EAA; font-size:14px;" class="font14"> DESCRIPTION_2</span><br/>
<span style="font-size:12px;" class="font12">SKU: CODEPRODUCT_-2</span><br />
<span style="font-size:18px;" class="font14">$ </span>
<span style="font-size:24px; line-height:30px;" class="font20">PRICE_2</span>
<span style="font-size:12px; text-transform: uppercase;" class="font10"> C/U</span> <br>
</td>
</tr>
<tr>
<td></td>
<td style="inline-height:0px;padding-top:4px;"><img src="http://www.site/images/loquiero_med.png" width="142" title="Ver producto" style="display:block" border="0" class="width115"/></td>
<td></td>
<td style="inline-height:0px;padding-top:4px;"><img src="http://www.site/images/loquiero_med.png" width="142" title="Ver producto" style="display:block" border="0" class="width115"/></td>
</tr>
</table>
<-- TABLE 3 -->
<table>
<tr>
<td colspan="4" height="30"></td>
</tr>
<tr>
<td width="50" class="width6p"></td>
<td width="260" class="width44p"><img src="http://site/image/CODEPRODUCT_1" width="230" alt="DESCRIPTION_1" style="display:block" border="0" class="width90p"/></td>
<td width="30" class="width3p"></td>
<td width="260" class="width44p"><img src="http://site/image/CODEPRODUCT_2" width="230" alt="DESCRIPTION_2" style="display:block" border="0" class="width90p"/></td>
</tr>
<tr>
<td></td>
<td class="font14" valign="top" style=" font-size: 16px; inline-height:0px; font-family:Helvetica, sans-serif; font-weight:lighter; color:#666666; line-height:130%; padding:10px 0px;">
<span style="font-weight: bold; color:#008EAA" class="font14">DESCRIPTION_1</span ><br />
<span style="font-weight: bold; color:#008EAA; font-size:14px;" class="font14"> DESCRIPTION_1</span><br/>
<span style="font-size:12px;" class="font12">SKU: CODEPRODUCT_-1</span><br />
<span style="font-size:18px;" class="font14">$ </span>
<span style="font-size:24px; line-height:30px;" class="font20">PRICE_1</span>
<span style="font-size:12px; text-transform: uppercase;" class="font10"> C/U</span> <br>
</td>
<td></td>
<td class="font14" valign="top" style=" font-size: 16px; inline-height:0px; font-family:Helvetica, sans-serif; font-weight:lighter; color:#666666; line-height:130%; padding:10px 0px;">
<span style="font-weight: bold; color:#008EAA" class="font14">DESCRIPTION_2</span><br />
<span style="font-weight: bold; color:#008EAA; font-size:14px;" class="font14"> DESCRIPTION_2</span><br/>
<span style="font-size:12px;" class="font12">SKU: CODEPRODUCT_-2</span><br />
<span style="font-size:18px;" class="font14">$ </span>
<span style="font-size:24px; line-height:30px;" class="font20">PRICE_2</span>
<span style="font-size:12px; text-transform: uppercase;" class="font10"> C/U</span> <br>
</td>
</tr>
<tr>
<td></td>
<td style="inline-height:0px;padding-top:4px;"><img src="http://www.site/images/loquiero_med.png" width="142" title="Ver producto" style="display:block" border="0" class="width115"/></td>
<td></td>
<td style="inline-height:0px;padding-top:4px;"><img src="http://www.site/images/loquiero_med.png" width="142" title="Ver producto" style="display:block" border="0" class="width115"/></td>
</tr>
</table>
Here is my Python code
import locale
import requests
import urlparse
import json
def html(sku_01,desc_01,sku_precio_1,sku_02,desc_02,sku_precio_2,bloque_prod):
f = open('mkt-output.html','w')
f.write(bloque_prod)
f.close()
if __name__ == '__main__':
sku_01 = raw_input('Ingrese SKU: ')
desc_01 = raw_input('Descripcion de SKU: ')
sku_precio_1 = raw_input('Precio de SKU: ')
sku_02 = raw_input('Ingrese SKU: ')
desc_02 = raw_input('Descripcion de SKU: ')
sku_precio_2 = raw_input('Precio de SKU: ')
bloque_prod = """<table>
<tr>
<td colspan="4" height="30"></td>
</tr>
<tr>
<td width="50" class="width6p"></td>
<td width="260" class="width44p"><img src="http://site/images/{}" width="230" alt="{}" style="display:block" border="0" class="width90p"/></td>
<td width="30" class="width3p"></td>
<td width="260" class="width44p"><img src="http://site/images/{}" width="230" alt="{}" style="display:block" border="0" class="width90p"/></td>
</tr>
<tr>
<td></td>
<td class="font14" valign="top" style=" font-size: 16px; inline-height:0px; font-family:Helvetica, sans-serif; font-weight:lighter; color:#666666; line-height:130%; padding:10px 0px;">
<span style="font-weight: bold; color:#008EAA" class="font14">{}</span ><br />
<span style="font-weight: bold; color:#008EAA; font-size:14px;" class="font14">{} {}</span><br/>
<span style="font-size:12px;" class="font12">SKU: {}-{}</span><br />
<span style="font-size:18px;" class="font14">$ </span>
<span style="font-size:24px; line-height:30px;" class="font20">{}</span>
<span style="font-size:12px; text-transform: uppercase;" class="font10"> C/U</span> <br>
</td>
<td></td>
<td class="font14" valign="top" style=" font-size: 16px; inline-height:0px; font-family:Helvetica, sans-serif; font-weight:lighter; color:#666666; line-height:130%; padding:10px 0px;">
<span style="font-weight: bold; color:#008EAA" class="font14">{}</span><br />
<span style="font-weight: bold; color:#008EAA; font-size:14px;" class="font14">{} {}</span><br/>
<span style="font-size:12px;" class="font12">SKU: {}-{}</span><br />
<span style="font-size:18px;" class="font14">$ </span>
<span style="font-size:24px; line-height:30px;" class="font20">{}</span>
<span style="font-size:12px; text-transform: uppercase;" class="font10"> C/U</span> <br>
</td>
</tr>
<tr>
<td></td>
<td style="inline-height:0px;padding-top:4px;"><img src="http://www.site/templates/images/loquiero_med.png" width="142" title="Ver producto" style="display:block" border="0" class="width115"/></td>
<td></td>
<td style="inline-height:0px;padding-top:4px;"><img src="http://www.site/templates/images/loquiero_med.png" width="142" title="Ver producto" style="display:block" border="0" class="width115"/></td>
</tr>
</table>""".format(sku_01,
sku_01,
desc_01,
sku_02,
sku_02,
desc_02,
' '.join(desc_01.split()[0:3]),
' '.join(desc_01.split()[3:-1]),
desc_01.split()[-1],
sku_01[0:-1],
sku_01[-1],
sku_precio_1,
' '.join(desc_02.split()[0:3]),
' '.join(desc_02.split()[3:-1]),
desc_02.split()[-1],
sku_02[0:-1],
sku_02[-1],
sku_precio_2,
sku_01,
sku_02)
html(sku_01, desc_01, sku_precio_1, sku_02, desc_02, sku_precio_2, bloque_prod)
If you need duplicate data written to the HTML file, you could simply have the html() function write variable bloque_prod multiple times by multiplying it:
def html(sku_01,desc_01,sku_precio_1,sku_02,desc_02,sku_precio_2,bloque_prod,tables):
f = open('mkt-output.html','w')
f.write(bloque_prod * tables)
f.close()
Note the addition of the variable tables for the number of table duplicates.
Then, define variable tables in __main()__:
tables = input('Tables: ')
…and add tables into the last line where you call html()
html(sku_01, desc_01, sku_precio_1, sku_02, desc_02, sku_precio_2, bloque_prod,tables)
Are you looking to write different tables?
Also, if it's necessary to annotate which table is currently being printed, you could add an if statement in:
def html(sku_01,desc_01,sku_precio_1,sku_02,desc_02,sku_precio_2,bloque_prod,tables):
f = open('mkt-output.html','w')
rawHTML = ""
for table in range(0, tables):
rawHTML += ("\n<-- TABLE " + str(table) + " -->\n" + bloque_prod)
f.write(rawHTML)
f.close()
(if you wanted the numbering to start at 1, you'd just change str(table) to str(table + 1))
--EDIT-- It seems that you are looking to create tables with different values. I would rewrite the program as such to do this:
import locale
import requests
import urlparse
import json
def createTable(sku_01,desc_01,sku_precio_1,sku_02,desc_02,sku_precio_2):
bloque_prod = """<table>
<tr>
<td colspan="4" height="30"></td>
</tr>
<tr>
<td width="50" class="width6p"></td>
<td width="260" class="width44p"><img src="http://site/images/{}" width="230" alt="{}" style="display:block" border="0" class="width90p"/></td>
<td width="30" class="width3p"></td>
<td width="260" class="width44p"><img src="http://site/images/{}" width="230" alt="{}" style="display:block" border="0" class="width90p"/></td>
</tr>
<tr>
<td></td>
<td class="font14" valign="top" style=" font-size: 16px; inline-height:0px; font-family:Helvetica, sans-serif; font-weight:lighter; color:#666666; line-height:130%; padding:10px 0px;">
<span style="font-weight: bold; color:#008EAA" class="font14">{}</span ><br />
<span style="font-weight: bold; color:#008EAA; font-size:14px;" class="font14">{} {}</span><br/>
<span style="font-size:12px;" class="font12">SKU: {}-{}</span><br />
<span style="font-size:18px;" class="font14">$ </span>
<span style="font-size:24px; line-height:30px;" class="font20">{}</span>
<span style="font-size:12px; text-transform: uppercase;" class="font10"> C/U</span> <br>
</td>
<td></td>
<td class="font14" valign="top" style=" font-size: 16px; inline-height:0px; font-family:Helvetica, sans-serif; font-weight:lighter; color:#666666; line-height:130%; padding:10px 0px;">
<span style="font-weight: bold; color:#008EAA" class="font14">{}</span><br />
<span style="font-weight: bold; color:#008EAA; font-size:14px;" class="font14">{} {}</span><br/>
<span style="font-size:12px;" class="font12">SKU: {}-{}</span><br />
<span style="font-size:18px;" class="font14">$ </span>
<span style="font-size:24px; line-height:30px;" class="font20">{}</span>
<span style="font-size:12px; text-transform: uppercase;" class="font10"> C/U</span> <br>
</td>
</tr>
<tr>
<td></td>
<td style="inline-height:0px;padding-top:4px;"><img src="http://www.site/templates/images/loquiero_med.png" width="142" title="Ver producto" style="display:block" border="0" class="width115"/></td>
<td></td>
<td style="inline-height:0px;padding-top:4px;"><img src="http://www.site/templates/images/loquiero_med.png" width="142" title="Ver producto" style="display:block" border="0" class="width115"/></td>
</tr>
</table>""".format(sku_01,
sku_01,
desc_01,
sku_02,
sku_02,
desc_02,
' '.join(desc_01.split()[0:3]),
' '.join(desc_01.split()[3:-1]),
desc_01.split()[-1],
sku_01[0:-1],
sku_01[-1],
sku_precio_1,
' '.join(desc_02.split()[0:3]),
' '.join(desc_02.split()[3:-1]),
desc_02.split()[-1],
sku_02[0:-1],
sku_02[-1],
sku_precio_2,
sku_01,
sku_02)
return bloque_prod
if __name__ == "__main__":
f = open('mkt-output.html','w+') # Open file in w+ mode so we can append to the end
for table in range(0,input("Tables: ")):
print ("--Table "+str(table)+"--")
sku_01 = raw_input('Ingrese SKU: ')
desc_01 = raw_input('Descripcion de SKU: ')
sku_precio_1 = raw_input('Precio de SKU: ')
sku_02 = raw_input('Ingrese SKU: ')
desc_02 = raw_input('Descripcion de SKU: ')
sku_precio_2 = raw_input('Precio de SKU: ')
f.write(createTable(sku_01,desc_01,sku_precio_1,sku_02,desc_02,sku_precio_2))
f.close()
Hope that helps.
Code I'm using for PDF generation:
html = HTML(string=final_html, base_url=request.build_absolute_uri())
main_doc = html.render()
pdf = main_doc.write_pdf()
This is the content of final_html string:
<body style="width:100%; height:100%;">
<style>
table, th, td {
border: 1px solid black;
border-collapse: collapse;
font-family: 'Open Sans', sans-serif;
font-size: 14px;
}
table {
margin-top: 0px;
}
th, td {
padding: 5px;
}
.bottom {
vertical-align: bottom;
}
tr.noBorder td {
border: 0;
}
</style> <table style="width:100%; height:100%;">
<tr>
<td COLSPAN="2" style="border-right-style: hidden;">
<div style="float: left; display:inline;">
<div>
<div><strong>-seller_name-</strong></div>
</div>
</div>
</td>
<td COLSPAN=2>
<div style="float: right; display:inline;">
<div style="text-align: center">
<strong>-label_name-</strong>
</div>
<div>
-crnbarcodeimage-
</div>
<div style="text-align: center">
<strong>*-label_number-*</strong>
</div>
</div>
</td>
</tr>
<tr>
<td COLSPAN=2>Name & Delivery Address</td>
<td style="border-right-style: hidden;">Payment Mode</td>
<td style="float: right; border-left-style: hidden; border-top-style: hidden; border-bottom-style: hidden;">
<strong>-order_type-</strong></td>
</tr>
<tr>
<td COLSPAN=2>
<div><strong>-drop_name-</strong></div>
<br>
<div>-drop_address-</div>
<br>
<div>-drop_state- <strong>-drop_pincode-</strong></div>
<br>
<div><strong>Contact Number: -drop_phone-</strong></div>
</td>
<td valign="top" COLSPAN=2>
<div style="float: left;">
<strong>Order No.:</strong>
</div>
<div style="float: right;">
-seller_order_id-
</div>
<div>
<div>
-seller_order_id_barcode-
</div>
</div>
<div style="float: left;">
<strong>Invoice No.</strong>
</div>
<div style="float: right;">
-invoice_number-
</div>
</td>
</tr>
<tr>
<td COLSPAN=4 ALIGN=RIGHT>
</td>
</tr>
<tr>
<td>Description</td>
<td>QTY</td>
<td>Rate</td>
<td>Amount</td>
</tr>
<tr>
<td>-item-</td>
<td>1</td>
<td>-invoice_value-</td>
<td>-invoice_value-</td>
</tr>
<tr>
<td COLSPAN=3 ALIGN=LEFT style="border-right-style:hidden;">Total</td>
<td COLSPAN=1 ALIGN=LEFT style="border-left-style:hidden;">-invoice_value-</td>
</tr>
<tr>
<td COLSPAN=3 ALIGN=LEFT style="border-right-style:hidden;"><strong>COD Amount</strong></td>
<td COLSPAN=1 ALIGN=LEFT style="border-left-style:hidden;"><strong>-cod_value-</strong></td>
</tr>
<tr>
<td COLSPAN=4>
Prices are inclusive of all applicable taxes
</td>
</tr>
<tr>
<td COLSPAN=4 style="border-bottom-style:hidden;">If Undelivered, please return to:</td>
</tr>
<tr>
<td COLSPAN=4>
<strong>
<div>B-220/2, 1st Floor, Right Door, Savitri Nagar, New Delhi: 110017 Ph. 8376035546</div>
</strong>
</td>
</tr> </table> </body> </html>
The pdf is always generated as partial of the page while I want it to cover entire pdf page.
I think that you might have to add this to your styles to configure the page:
#page {
size: 11cm 14.1cm;
margin-left: 0.5cm;
margin-top: 0.5cm;
}