I have this structure to get data from another webstie
$searchURL = "http://www.anotherwebsite.com";
$html = file_get_contents($searchURL);
$patternform = '/(<tbody.*<\/tbody>)/sm';
preg_match_all($patternform ,$html,$matches);
preg
echo $matches[0][0];
<tr class="even hidden">
<td colspan="3">OB I</td>
<td colspan="5">vízilabda, ffi</td>
</tr>
<tr class="odd">
<td class="opener nowrap"><ins></ins>063</td>
<td class="center nowrap"><ins class="sport jegkorong" title="jégkorong"><span>jégkorong</span></ins>3</td>
<td><strong>Magyarország - Lengyelország</strong></td>
<td class="center">
1.59 </td>
<td class="center">
4.20 </td>
<td class="center">
3.55 </td>
<td class="nowrap">
P 18:15 </td>
<td class="nowrap">
nov. 08 </td>
</tr>
^^
I had this "input"
Question is:
How can I change three td value to javascript onclick event (extra: that I want to store the name of the event and I want to store the selected odds and add to new div or table line by line.)
I think preg_replace need but regexp. not my desk.
Why must javascript be used? Would simply using the HTML onclick work?
<td onclick="SomethingFunky">
Related
In this reactjs app I have a table with the following body:
<tbody>
{results.map(result =>
<tr key={result.metric} onClick={this.handleClick}>
<td className="inpt-td">{result.t00}</td>
<td className="inpt-td">{result.t01}</td>
<td className="inpt-td">{result.t02}</td>
<td className="inpt-td">{result.t03}</td>
<td className="inpt-td">{result.t04}</td>
<td className="inpt-td">{result.t05}</td>
<td className="inpt-td">{result.t06}</td>
<td className="inpt-td">{result.t07}</td>
<td className="inpt-td">{result.t08}</td>
<td className="inpt-td">{result.t09}</td>
<td className="inpt-td">{result.t10}</td>
<td className="inpt-td">{result.t11}</td>
<td className="inpt-td">{result.t12}</td>
<td className="inpt-td">{result.t13}</td>
<td className="inpt-td">{result.t14}</td>
<td className="inpt-td">{result.t15}</td>
<td className="inpt-td">{result.t16}</td>
<td className="inpt-td">{result.t17}</td>
<td className="inpt-td">{result.t18}</td>
<td className="inpt-td">{result.t19}</td>
<td className="inpt-td">{result.t20}</td>
<td className="inpt-td">{result.t21}</td>
<td className="inpt-td">{result.t22}</td>
<td className="inpt-td">{result.t23}</td>
</tr>
)}
</tbody>
The header does not exist for this particular table, but I was wondering if there was a way to obtain the column name of a clicked cell. So for example if you clicked on the second cell in a given row, it would return "t01", which is the column name.
My searches online did not provide an efficient way of doing this. Is there a method to retrieve this info?
In your handleClick you can get access to the event.target property, which is a cell.
After that you can do:
var child = event.target;
var parent = child.parentNode;
// equivalent of parent.children.indexOf(child)
var index = Array.prototype.indexOf.call(parent.children, child);
var value = 't' + index // this will be value what you are looking for
If you need information how to use event.target - here is an example.
I wasn't quite sure how to word this in the title, so thank you for clicking to on this.
So now to my problem:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<style>
.block {
background-color: black;
}
</style>
<table border='1px'>
<tr>
<td id='11'></td>
<td id='12'></td>
<td id='13'></td>
<td id='14'></td>
<td id='15'></td>
</tr>
<tr>
<td id='21'></td>
<td id='22'></td>
<td id='23'></td>
<td id='24'></td>
<td id='25'></td>
</tr>
<tr>
<td id='31'></td>
<td id='32'></td>
<td id='33' class="block"></td>
<td id='34'></td>
<td id='35'></td>
</tr>
<tr>
<td id='41'></td>
<td id='42'></td>
<td id='43'></td>
<td id='44'></td>
<td id='45'></td>
</tr>
<tr>
<td id='51'></td>
<td id='52'></td>
<td id='53'></td>
<td id='54'></td>
<td id='55'></td>
</tr>
</table>
<button onclick="blockUp()">Up</button>
<button onclick="blockDown()">Down</button>
<button onclick="blockLeft()">Left</button>
<button onclick="blockRight()">Right</button>
<script>
var blockUp = function() {
var oldBlock = document.getElementsByClassName("block")[0].id;
var newBlock = Math.floor(oldBlock + 1);
document.getElementById(newBlock).classList.add("block");
document.getElementById(oldBlock).classList.remove("block");
}
</script>
</body>
</html>
This code is not complete, as I want to fix this problem first.
I want to use Math.floor to get a certain ID (thus, IDs as numbers), and manipulate them. More specifically, I want to find the ID of the cell that currently has the .block class, find the ID of the cell above that using Math.floor(oldBlock + 1), remove the class from the original cell, and add the class to the new cell. I used variables so that the function would always be able to run, rather than making a million if/else if/else statements.
Unfortunately, this doesn't work with my current code. How would I be able to do this?
Any help is appreciated!
You have to make sure that "oldBlock" contains a number before trying to do math with it (like adding 1):
var oldBlock = +document.getElementsByClassName("block")[0].id;
That's one way of doing it. You could also use parseInt():
var oldBlock = parseInt(document.getElementsByClassName("block")[0].id, 10);
The value of the "id" property will be a string, so if you involve that in an addition operation JavaScript will treat it as string concatenation. By forcing it to be a number first, you'll get the effect you want.
I would like to get all values in the td tag as two questions below:
2004 2005 2006
An approximately: From the third td to the fifth td (should use with: td.eq(3) --> td.eq(5)). The result must be: 2005 2006 2007
Demo
HTML:
<table border="1">
<tr>
<td class="ms-vb-title">Year </td>
<td class="ms-vh2">2004 </td>
<td class="ms-vh2">2005 </td>
<td class="ms-vh2">2006 </td>
<td class="ms-vh2">2007 </td>
<td class="ms-vh2">2008 </td>
<td class="ms-vh2">2009 </td>
<td class="ms-vh2">2010</td>
</tr>
</table>
Javascript:
$("document").ready(function () {
var arrayList1 = $("td.ms-vb-title:contains('')").closest('table').find('tr').eq(0).find('td').not(".ms-vb-title");
alert(arrayList1.text());
});
Try
.find('tr').eq(0).find('td').slice(1, 4)
Demo: Fiddle
You can try something like this:
var $firstThreeTds = $('tr:first-child td.ms-vh2').filter(function(index){
return index <= 3;
});
I was checking the site and found JavaScript: How to strip HTML tags from string? but this doesn't really explains how to take this:
<tr id="element.incident.comments.additional">
<td colspan="2">
<span style="">
<table cellpadding="0" cellspacing="0" style="table-layout:fixed" width="100%">
<tbody>
<tr>
<td colspan="2">
<hr>
</td>
</tr>
<tr style="">
<td class="tdwrap"><strong>2014-01-23 14:45:40 - <a style="color:blue" href="sys_user.do?sysparm_view=itil&sysparm_query=user_name=Superhero#superhero.com">SuperHero</a></strong></td>
<td align="right" nowrap="true"><sup>Additional comments</sup></td></tr>
<tr style="">
<td colspan="2"><span style="word-wrap:break-word;">received from: SDUperhero#superhero.com<br><br>lalalalalala
<br>lotsofwords<br><br><br><br><br><br>
The information transmitted, including any attachments, is intended only for the person or entity to which it is addressed and may contain confidential and/or privileged material</span></td></tr></tbody></table></span></td>
</tr>
and get the text inside:
<tr id="element.incident.comments.additional">
for further parsing.
I tried with
function strip(html)
{
var tmp = document.createElement("DIV");
tmp.innerHTML = html;
return tmp.textContent||tmp.innerText;
}
var commentsField = document.getElementById("element.incident.comments.additional").innerHTML;
alert(strip(commentsField));
but I'm not sure if this is the right way as I'm not getting anything in the alert.
Any thoughts?
Because you have . in your ids, you will need to escape them in your jQuery selector:
$("#txt").val($("#element\\.incident\\.comments\\.additional").html());
and that should work.
jsFiddle: http://jsfiddle.net/hescano/EQ9b3/
I have a grid and for one of the columns i want to dynamically change the css used based on the value of another field in the resultset.
So instead of something like
<td class='class1'>
${firstname}
</td>
pseudo-wise I would like
{{if anotherColumnIsTrue }}
<td class='class1'>
${firstname}
</td>
{{/if}}
{{if !anotherColumnIsTrue }}
<td class='class2'>
${firstname}
</td>
{{/if}}
Is this thing possible..?
I think that jQuery makes this a lot easier.
It is very possible. I assume that you would want this for each row. Lets assume you have the following table:
<table id="coolTable">
<tr>
<td class="anotherColumn">True</td>
<td class="firstName">Chris</td>
</tr>
<tr>
<td class="anotherColumn">False</td>
<td class="firstName">Roger</td>
</tr>
</table>
You could go through rows and selectively add classes using the following code:
$(function(){
$("#coolTable tr").each(function(i,row){
if($(row).children("td.anotherColumn").html()=="True") // Any condition here
{
$(row).children("td.firstName").addClass("class1");
}else{
$(row).children("td.firstName").addClass("class2");
}
});
});
Have a look at this fiddle: http://jsfiddle.net/mrfunnel/LXq3w/2/