jquery doesn't take hidden td
jquery doesn't take hidden td
JCR1951
Posts: 34Questions: 6Answers: 0
$('#example tr').each(function() {
$('td', this).slice(-3).on('click', function() {
// do what you want
var $columns = $(this).siblings('td').andSelf();
$.each($columns, function(i, item) {
alert($(item).html());
});
});
});
I'm a starter with datatables.
And no code specialist.
The code gives all the td values in a row.
But on every click it looped more and more.
And it doesn't take the hidden columns.
Please help me with an updated script.
This question has an accepted answers - jump to answer
This discussion has been closed.
Answers
Not sure what you're trying to accomplish. If you're trying to get the value of a hidden TD within the same row of a TD that was clicked on, then try this:
Thanks for the comment.
I will try this one.
I want in all rows 3 logo's (images). Facebook, Website, Youtube video.
When I click on one it opens the corresponding facebook-account, website, or youtube-video.
I tried a couple of scripts, but it doesn't work for me.
Now I was trying with hidden fields.
But all other options are open.
In my database I change the image(s) if there is content in the fields of facebook, youtube or website.
But now i want the images clickable and linked to the right hidden td in the row so it can open _blank.
This is a link from this problem..
The hidden td's are in the fields after the website column (logo).
The colored logo's have to keep the corresponding values.
http://www.pctraverse.nl/DataTables-1.10.11/examples/server_side/simple.html
Because both the links and the img's coming from the database I put it together now.
And split it in the script. The hidden fields are not longer needed.
But I don't get the window.open in a new window.
Please help.
I would strongly suggest you use a single delegated event handler like in this example. At the moment on the first click it is then adding another click event handler, which is white confusing and will almost certainly lead to memory leaks.
Allan
Thanks Allen for your comment.
But I already tried every manual concept.
But for some reasen it gives always "non defined row".
And it takes not the hidden columns.
So I tried another move.
Oke, I can now retrieve every column value in a row, but not the hidden fields.
Is there a way ?
You cannot use jQuery selector to search for hidden columns as they don't exist in the HTML. You will want to use https://datatables.net/reference/api/row() along with https://datatables.net/reference/api/cells() or https://datatables.net/reference/api/columns() . These functions can also be passed a string or array that contains th class of column/s you want.
If you want the raw data, add https://datatables.net/reference/api/data() to column or cell. If you want the rendered content, add https://datatables.net/reference/api/cell().render() to cell.
Use
row().data()
to get the data for the row (which includes the hidden data).Allan
Thanks Allan and Gordon.
Sorry for the lot of questions.
But I just started with datatables.
Now I have 1 scripts that can retrieve the hidden values.
And I have a script that knows on what column I clicked.
But I can't bring it together.
The part of retrieving the hidden values.
The column clicked
I'm not actually sure what you are trying to achieve. What is your end goal?
Allan
In every row of the table I have 3 images (logo).
Facebook, youtube, website.
The links are in hidden columns.
If I click on the facebook logo the corresponding hidden link from facebook is fired and it opens the facebookaccount.
So it also with the youtube and website logo.
Now I can fire the hidden fields, but i have to know what column I was clicking.
The scripts do that but I can't take them together.
http://www.pctraverse.nl/DataTables-1.10.11/examples/server_side/simpleA.html
http://www.pctraverse.nl/DataTables-1.10.11/examples/server_side/simpleB.html
Why not have the images in the links? Putting the links in hidden columns appears to just add complexity and would also hurt accessibility?
Having said that, perhaps you should add a class to each of the
img
elements so you can determine which one was clicked on?(modified to suit your needs of course).
Allan
I tried it your way Allan.
But with rowData I recieved an 'object Object'.
I have it running now with the hidden columns.
But there will be a better/more simple way.
So for learning the datables better, if you have the time.
Please make it better.
Thanks for the help!
It's great to work with datatables.
http://pctraverse.nl/DataTables-1.10.11/examples/server_side/simpleB.html
Yes - its an object :-). Access its properties using
rowData.name
orrowData.address
, etc.Allan
You really don't need an event handler for what you are doing. Don't use an img but rather an anchor tag with fixed height and use 'background-image' to insert your image. Also add following to anchor tag so it opens a new window
Here is some HTML and styling i used to achieve this.
Thanks for the reply Gordon.
Now I place a link for the image in the database.
It change the image link whenever a member gives a link to facebook.
So it loads always the correct image.
If I do this in CSS the background image has to change if a facebook account is found.
Hope I find with the comments a more simple way....
I will try again the options...
I now have the other option from Allan. (But still the links hidden)
That looks its probably the most elegant option available. Nice one (although line 6 looks odd).
Allan
I tried your window.location.href Allan. Even with target _blank.
The table window is replaced by the new window.
And you have to go back in browser to find the table window.
If you close the window the table is gone.
With window.open the window table is still under the new window.
So if you close the new window the table is still there.
I'm using Chrome browser. I don't know it is cross-browser.
Yes - sorry, I haven't quite realised that you wanted it in a new window rather than in the current one.
window.open
is the correct method to use to open a new window.Allan
I found a little trick for pointing my mouse on clickable pictures.
Why show the image at all if it isn't going to be clickable? Seems it would only cause confusion on the user end.
That's also possible Gordon....
But in a table with lots of images, I think it's just confsusing when there
is nothing in a cell in the row.
But it can be changed, haha.
Thanks for your comment.