How do I change the bgcolor of 'colorId'. I tried the code below and I want the bgcolor to change in the value 'val'. But from then on I m doing something wrong.
<script type="text/javascript">
function updatevariable(elm) {
val = elm;
var divElement = document.getElementById(colorId);
divElement.bgcolor = val;
}
</script>
<table width="150" border="0" cellspacing="1" cellpading="0" align="center">
<tr>
<td bgcolor="#190707" onclick="updatevariable(this.bgColor)"> </td>
<td bgcolor="#fa5858" onclick="updatevariable(this.bgColor)"> </td>
<td bgcolor="#F4FA58" onclick="updatevariable(this.bgColor)"> </td>
<td bgcolor="#00FF00" onclick="updatevariable(this.bgColor)"> </td>
<td bgcolor="#fbefef" onclick="updatevariable(this.bgColor)"> </td>
</tr>
<tr>
<td id='colorId' bgcolor="#F4FA58"> </td>
</tr>
</table>
If you switch to jQuery you can do this in stead:
function updatevariable(elm){
var val = elm;
$('#colorId').css('background-color', val);
}
Just found your bugs. Use code below and it would work.
function updatevariable(elm) {
var val = elm;
var divElement = document.getElementById("colorId");
divElement.setAttribute("bgcolor", val);
}
Related
I have a working code on my side in which I have used NextSibling property in excel vba like that
stExecutive = thElements.Item(i).NextSibling.NextSibling.innerText
When a friend takes the code to try it on his side, the code raises the error Object variable or With block variable not set and I have fixed it using just one NextSibling
stExecutive = thElements.Item(i).NextSibling.innerText
Why this difference happen? and how can I make the code work on both sides without raising any errors?
This is part of the code
Set thElements = htmlCaseProcedures.querySelector(".table-striped").getElementsByTagName("th")
For i = 0 To thElements.Length - 1
If thElements.Item(i).innerText = sAvailableBalance Then
stAvailableBalance = thElements.Item(i).NextSibling.innerText
ElseIf thElements.Item(i).innerText = sFileStatus Then
stFileStatus = thElements.Item(i).NextSibling.innerText
ElseIf thElements.Item(i).innerText = sExecutive Then
stExecutive = thElements.Item(i).NextSibling.innerText
End If
Next i
and this is the content of html
<script type="text/javascript">
function doSubmitP(txtType){
document.frmTemp.reqtype.value = txtType;
$('#frmTemp').submit();
}
</script>
<style type="text/css">
th,td{
text-align: center !important;
}
</style>
<table class="table table-striped">
<tbody><tr align="center">
<th width="50%" align="right">الرقم الآلي</th>
<td><small>192833700</small></td>
</tr>
<tr align="center">
<th align="right">تاريخ التسجيل فى ملف التنفيذ</th>
<td><small>2020-03-09</small></td>
</tr>
<tr align="center">
<th align="right">رقم ملف التنفيذ</th>
<td><small>19283370</small></td>
</tr>
<tr align="center">
<th align="right">جهة التنفيذ</th>
<td><small>العاصمة-قسـم التنفيذشركات</small></td>
</tr>
<tr align="center">
<th align="right">الرصيد المتاح</th>
<td><small>0.000 د.ك</small></td>
</tr>
<tr align="center">
<th align="right">حالة الملف</th>
<td><small>مفتـــــوح</small></td>
</tr>
<tr>
<td align="center" colspan="2">
<table align="center" class="linksTbl">
<tbody><tr valign="middle">
<td><a class="hyperText" onclick="doSubmitP(1)" href="javascript:void(0);">الإجراءات العامة والرسوم</a></td>
<td>|</td>
<td><a class="hyperText" onclick="doSubmitP(2)" href="javascript:void(0);">إجراءات التنفيذ المدني</a></td>
<td>|</td>
<td><a class="hyperText" onclick="doSubmitP(3)" href="javascript:void(0);">الإجراءات المالية</a></td>
</tr>
</tbody></table>
</td>
</tr>
</tbody></table>
<div class="row" id="viewPaneDetails" style="display: none;"></div>
<form name="frmTemp" id="frmTemp" action="execReqView.jsp" method="POST" autocomplete="off">
<input name="reqtype" type="hidden">
</form>
<script>
$('#frmTemp').submit(function(){ // catch form submit event
$.ajax({ // create ajax call
data: $(this).serialize(), //get form data
type: $(this).attr('method'), //GET or POST
url: $(this).attr('action'), // the action url
success: function(response){ // on success
$('#viewPaneDetails').html(response); //update DIV
$('#viewPaneDetails').show();
}
});
return false; // cancel original event to prevent form submitting
});
</script>
Here is the HTML I don't have any control over. This is condensed HTML of the real page.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Little League</title>
</head>
<body>
<table>
<span>lot of unrelated text</span>
</table>
<table>
<span>lot of unrelated text</span>
</table>
<table>
<span>lot of unrelated text</span>
</table>
<table>
<tbody>
<tr>
<td class="rightTD">
<p>
<span id="teams_players">Player Teams</span>
</p>
</td>
</tr>
<tr>
<td>
<table border="1" cellspacing="0" cellpadding="0" class="tableBorder table table-bordered" width="100%">
<tbody>
<tr>
<td>
<table border="0" width="100%" class="tableData">
<tbody>
<tr id="team_listings">
<td colspan="3">Team Listings
<br>
<br>
</td>
</tr>
<tr>
<td>(a) </td>
<td colspan="2">Team Name </td>
</tr>
<tr>
<td></td>
<td colspan="2">
<span class="blue_color">Foxes</span>
</td>
</tr>
<tr>
<td>(b) </td>
<td colspan="2">Team Rank</td>
</tr>
<tr>
<td></td>
<td colspan="2">
<span class="blue_color">1</span>
</td>
</tr>
<tr>
<td>(c) </td>
<td colspan="2">Team Location
</td>
</tr>
<tr>
<td></td>
<td colspan="2">
<table width="100%">
<tbody>
<tr>
<td>City:
<br>
<span class="blue_color">Tualatin</span>
</td>
<td>State:
<br>
<span class="blue_colorLined"></span>
<br>
<span class="blue_color">Oregon</span>
</td>
<td>Country:
<br>
<span class="blue_colorLined"></span>
<br>
<span class="blue_color">United States</span>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<br>
<table border="1" cellspacing="0" cellpadding="0" class="tableBorder table table-bordered" width="100%">
<tbody>
<tr>
<td>
<table border="0" width="100%" class="tableData">
<tbody>
<tr>
<td>(a) </td>
<td colspan="2">Team Name </td>
</tr>
<tr>
<td></td>
<td colspan="2">
<span class="blue_color">Tigers</span>
</td>
</tr>
<tr>
<td>(b) </td>
<td colspan="2">Team Rank</td>
</tr>
<tr>
<td></td>
<td colspan="2">
<span class="blue_color">3</span>
</td>
</tr>
<tr>
<td>(c) </td>
<td colspan="2">Team Location
</td>
</tr>
<tr>
<td></td>
<td colspan="2">
<table width="100%">
<tbody>
<tr>
<td>City:
<br>
<span class="blue_color">Tigard</span>
</td>
<td>State:
<br>
<span class="blue_colorLined"></span>
<br>
<span class="blue_color">Oregon</span>
</td>
<td>Country:
<br>
<span class="blue_colorLined"></span>
<br>
<span class="blue_color">United States</span>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</body>
</html>
I am trying to get to the table tag immediately preceding the span tag with id team_players.
I tried these but failed -
//table/span[#id="teams_players"]
ancestor::table[span[#id="teams_players"][position() = 1]]
This works but is not elegant and I prefer not to hardcode it -
//span[#id="teams_players"]/../../../../..
While //table[#class="tableData"] this might seem like it should work, there are many such tables in the HTML that has the same class with unrelated data. So this is ruled out.
Here is the code so far with my attempts (definitely not efficient, once I find a way of fetching both tables, I plan on looping through them to extract the data -
def parse_team():
# team data structure
teams = []
team_dict = { 'team': '', 'rank': '', 'location': { 'city': '', 'state': '', 'country': '' } }
filename = f'team.html'
f = open(filename, encoding="utf8").read()
parser = etree.HTMLParser()
tree = etree.parse(StringIO(f), parser)
# fetch the table dom and parse each team table
# fetch the parent table that contains teams_players span id
team_tables = tree.xpath('ancestor::table[span[#id="teams_players"][position() = 1]]')
print(team_tables)
root_tables = tree.xpath('//table/span[#id="teams_players"]')
print("root tables", root_tables)
# this provides each team table but in full html, the same class is being used for other unrelated data
name = tree.xpath('//table[#class="tableData"]')
print(name)
eachvaltr = name[0].xpath('.//tr')
teamname = name[0].xpath('.//td[contains(text(),"Team Name")]//parent::tr/following-sibling::tr[1]//span[#class="blue_color"]/text()')
print("teamname", teamname)
teamrank = name[0].xpath(
'.//td[contains(text(),"Team Rank")]//parent::tr/following-sibling::tr[1]//span[#class="blue_color"]/text()')
print("teamrank", teamrank)
city = name[0].xpath(
'.//td[contains(text(),"City")]//span[#class="blue_color"]/text()')
state = name[0].xpath(
'.//td[contains(text(),"State")]//span[#class="blue_color"]/text()')
country = name[0].xpath(
'.//td[contains(text(),"Country")]//span[#class="blue_color"]/text()')
print(city[0], state[0], country[0])
team_dict['team'] = teamname
team_dict['rank'] = teamrank
team_dict['location']['city'] = city[0]
team_dict['location']['state'] = state[0]
team_dict['location']['country'] = country[0]
print(team_dict)
Desired output is a list of teams where each team is a dict.
[{'team': ['Foxes'], 'rank': ['1'], 'location': {'city': 'Tualatin', 'state': 'Oregon', 'country': 'United States'}}]
//table[.//span[#id="teams_players"]]
or
//span[#id="teams_players"]/ancestor::table
I had search reference and the reference say to try like this :
<?php
...
class ReportExport implements ShouldAutoSize, FromView, WithColumnFormatting, WithEvents
{
...
public function registerEvents(): array
{
return [
AfterSheet::class => function(AfterSheet $event) {
...
$event->sheet->getDelegate()->getRowDimension(37)->setRowHeight(-1);
$event->sheet->getDelegate()->getStyle('R37:Z37')->getAlignment()->setWrapText(true);
},
];
}
}
I try like that, but the result like this :
Should the height of row automatic added based content/text. But it does not added
How can I solve this problem?
Update :
Seems this script : $event->sheet->getDelegate()->getRowDimension(37)->setRowHeight(-1); is not working in the table
I tried the script outside the table, it worked. So the script only work outside table tag
My table like this :
<table>
....
#php ($group = 'A')
#php ($number = 0)
#foreach($values as $item)
#if($number==0 || $group!=$item['group'])
<tr>
<td colspan="9">Kelompok {{$item['group']}}</td>
<td colspan="2"></td>
<td colspan="3"></td>
<td colspan="3"></td>
<td colspan="9"></td>
<td colspan="2"></td>
<td colspan="3"></td>
<td colspan="3"></td>
<td colspan="9"></td>
</tr>
#php ($number = 0)
#endif
<tr>
<td style="text-align:center;" colspan="2">{{++$number}}</td>
<td colspan="7">{{$item['lesson_name']}}</td>
<td style="text-align:center;" colspan="2">{{$item['kb_pengetahuan']}}</td>
<td style="text-align:center;" colspan="3">{{$item['nilai_pengetahuan']}}</td>
<td style="text-align:center;" colspan="3">{{$item['predikat_pengetahuan']}}</td>
<td colspan="9">{{$item['deskripsi_pengetahuan']}}</td>
<td style="text-align:center;" colspan="2">{{$item['kb_keterampilan']}}</td>
<td style="text-align:center;" colspan="3">{{$item['nilai_keterampilan']}}</td>
<td style="text-align:center;" colspan="3">{{$item['predikat_keterampilan']}}</td>
<td colspan="9">{{$item['deskripsi_keterampilan']}}</td>
</tr>
#php ($group = $item['group'])
#endforeach
</table>
Please help me. I need support for PhpSpreadsheet functionality
public function registerEvents(): array
{
return [
AfterSheet::class => function(AfterSheet $event) {
...
$event->sheet->getDelegate()
->getStyle('R37:Z37')
->applyFromArray([ 'alignment' => ['wrapText' => true]])
},
];
}
I'm in a bit of a quinch here:
its an ASP site which is really messy that I am trying to get data from:
I'm trying to use a for loop to get an href and the text of all the rows of the 4th table that is on the site, so I first did:
table = soup.findAll('table')[3]
Then from this table I need to get all text inside the <tr> tags and the href's of the <a> inside.
i tried something like this:
for product in table.findAll('tbody'):
product_title = product.find('tr').text
product_link = product.find('a')['href']
print (product_title, product_link)
But I get nothing in return
The table Im working on:
<tr bgcolor="#EFEFEF">
<td>
<a href="free.asp?detail=hide&c_id=4342141">
<img align="absmiddle" border="0" hspace="0" src="pic/bullet.gif" vspace="0"/>
</a>
</td>
<td>
4342141
</td>
<td width="10">
</td>
<td>
25.07.2018 09:00
</td>
<td width="10">
</td>
<td>
Ankara
</td>
<td width="10">
-
</td>
<td>
Konya
</td>
<td colspan="2">
</td>
</tr>
<tr bgcolor="#EFEFEF" height="3">
<td colspan="10">
</td>
</tr>
<tr bgcolor="#FFFFFF" height="1">
<td colspan="10">
</td>
</tr>
<tr bgcolor="#DDDDDD" height="6">
<td colspan="10">
</td>
</tr>
<tr bgcolor="#FFFFFF" height="1">
<td colspan="10">
</td>
</tr>
<tr bgcolor="#DEE3E7" height="3">
<td colspan="10">
</td>
</tr>
<tr bgcolor="#DEE3E7">
<td>
<a href="free.asp?detail=hide&c_id=4134123">
<img align="absmiddle" border="0" hspace="0" src="pic/bullet.gif" vspace="0"/>
</a>
</td>
<td>
4134123
</td>
<td width="10">
</td>
<td>
26.07.2018 09:00
</td>
<td width="10">
</td>
<td>
Van
</td>
<td width="10">
-
</td>
<td>
Istanbul
</td>
<td colspan="2">
</td>
</tr>
Instead of extracting text from tbody from table, you can directly get all tr tags.
Based on your snippet you can refer to this code snippet for data extraction from table.
soup = BeautifulSoup(text, 'html.parser')
all_products = []
for tr in soup.find_all('tr'):
text = tr.get_text(separator=' ', strip=True)
if text:
a_tag = tr.find('a')
if a_tag:
product_link = a_tag.attrs['href']
all_text = text + ' ' + product_link
all_products.append(all_text.split(' '))
print(all_products)
Output is:
[['4342141', '25.07.2018', '09:00', 'Ankara', '-', 'Konya', 'free.asp?detail=hide&c_id=4342141'], ['4134123', '26.07.2018', '09:00', 'Van', '-', 'Istanbul', 'free.asp?detail=hide&c_id=4134123']]
I keep getting a
ReferenceError: del is not defined.
Before it was working where it would refresh the page, but I set it up so that it would only refresh the div when clicking.
while($row = $result->fetch_assoc()) {
$fileID = $row['fileID'];
echo "<tbody><tr>";
echo "
<td bgcolor='white'>
<input type='checkbox' checked>
</td>
<td bgcolor='white'>
{$row['name']}
</td>
<td bgcolor='white'>
{$row['type']}
</td>
<td bgcolor='white'>
{$row['size']}
</td>
<td bgcolor='white'>
{$row['created']}
</td>
<td>
<input type='button' name='download' value='Download' onclick='window.location="get_file.php?fileID=$fileID";'>
</td>
<td>
<script type='text/javascript'>
function del() {
console.log('Im working!');
var r = confirm('Do you want to remove this file?');
if (r == true) {
$.ajax({url: 'delete.php',
data: {action: '<?php print $fileID;?>'}
type: 'post';
success: function() {
$('#fileTable').load(document.URL + ' #fileTable');
}
});
}
}
</script>
<input type='button' name='delete' value='Delete' onclick='del()'>
</td>
You're duplicating your function for every row, and when you press a button, the function does not know what ID you're after.
Change it to something like:
echo <<<EOHTML
<script type='text/javascript'>
function del(id) {
console.log('Im working!', id);
var r = confirm('Do you want to remove this file?');
if (r == true) {
$.ajax({url: 'delete.php',
data: {action: id.toString()}
type: 'post';
success: function() {
$('#fileTable').load(document.URL + ' #fileTable');
}
});
}
}
</script>
EOHTML;
while($row = $result->fetch_assoc()) {
$fileID = $row['fileID'];
echo <<<EOHTML
<tbody><tr>
<td bgcolor='white'>
<input type='checkbox' checked>
</td>
<td bgcolor='white'>
{$row['name']}
</td>
<td bgcolor='white'>
{$row['type']}
</td>
<td bgcolor='white'>
{$row['size']}
</td>
<td bgcolor='white'>
{$row['created']}
</td>
<td>
<input type='button' name='download' value='Download' onclick='window.location="get_file.php?fileID={$fileID}";'>
</td>
<td>
<input type='button' name='delete' value='Delete' onclick='del({$fileID})'>
</td>
EOHTML;
}