How to make only one column of a table clickable
I am trying to make a table cell clickable so that I can extract the cell value (member ID)and submit it to the server then re-direct the user to a new page displaying that member's profile data. I have used the following code to delegate the cells of the table as clickable, but it makes all cells clickable and I only want the first column of cells to be clickable.
The cell data for the ID is:
<td align="center" class="member_id" id="member_id" >
<?php echo $wpdb->get_var( "SELECT * FROM $table_name ORDER BY $table_name.`last_name` ASC ", 0, $cur_row); ?>
</td> <!--- ID --->
The JS file is:
$jq("#mem_dir").delegate("td", "click", function() {
alert("Clicked on a cell");
if ($jq(this).hasClass("member_id")) {
alert("Clicked on a member ID");
var member_id = $jq(this).text();
alert ("Member ID is: " + member_id);
}
I would really like to do what I did for the email address cell data, but have not figured out how to do that.
Clickable email cell data:
<td><?php echo make_clickable($wpdb->get_var( "SELECT * FROM $table_name ORDER BY $table_name.`last_name` ASC ", 3, $cur_row)); ?></td> <!--- email --->
Thanks for any help or suggestions.
cell clickable
add a comment |
I am trying to make a table cell clickable so that I can extract the cell value (member ID)and submit it to the server then re-direct the user to a new page displaying that member's profile data. I have used the following code to delegate the cells of the table as clickable, but it makes all cells clickable and I only want the first column of cells to be clickable.
The cell data for the ID is:
<td align="center" class="member_id" id="member_id" >
<?php echo $wpdb->get_var( "SELECT * FROM $table_name ORDER BY $table_name.`last_name` ASC ", 0, $cur_row); ?>
</td> <!--- ID --->
The JS file is:
$jq("#mem_dir").delegate("td", "click", function() {
alert("Clicked on a cell");
if ($jq(this).hasClass("member_id")) {
alert("Clicked on a member ID");
var member_id = $jq(this).text();
alert ("Member ID is: " + member_id);
}
I would really like to do what I did for the email address cell data, but have not figured out how to do that.
Clickable email cell data:
<td><?php echo make_clickable($wpdb->get_var( "SELECT * FROM $table_name ORDER BY $table_name.`last_name` ASC ", 3, $cur_row)); ?></td> <!--- email --->
Thanks for any help or suggestions.
cell clickable
add a comment |
I am trying to make a table cell clickable so that I can extract the cell value (member ID)and submit it to the server then re-direct the user to a new page displaying that member's profile data. I have used the following code to delegate the cells of the table as clickable, but it makes all cells clickable and I only want the first column of cells to be clickable.
The cell data for the ID is:
<td align="center" class="member_id" id="member_id" >
<?php echo $wpdb->get_var( "SELECT * FROM $table_name ORDER BY $table_name.`last_name` ASC ", 0, $cur_row); ?>
</td> <!--- ID --->
The JS file is:
$jq("#mem_dir").delegate("td", "click", function() {
alert("Clicked on a cell");
if ($jq(this).hasClass("member_id")) {
alert("Clicked on a member ID");
var member_id = $jq(this).text();
alert ("Member ID is: " + member_id);
}
I would really like to do what I did for the email address cell data, but have not figured out how to do that.
Clickable email cell data:
<td><?php echo make_clickable($wpdb->get_var( "SELECT * FROM $table_name ORDER BY $table_name.`last_name` ASC ", 3, $cur_row)); ?></td> <!--- email --->
Thanks for any help or suggestions.
cell clickable
I am trying to make a table cell clickable so that I can extract the cell value (member ID)and submit it to the server then re-direct the user to a new page displaying that member's profile data. I have used the following code to delegate the cells of the table as clickable, but it makes all cells clickable and I only want the first column of cells to be clickable.
The cell data for the ID is:
<td align="center" class="member_id" id="member_id" >
<?php echo $wpdb->get_var( "SELECT * FROM $table_name ORDER BY $table_name.`last_name` ASC ", 0, $cur_row); ?>
</td> <!--- ID --->
The JS file is:
$jq("#mem_dir").delegate("td", "click", function() {
alert("Clicked on a cell");
if ($jq(this).hasClass("member_id")) {
alert("Clicked on a member ID");
var member_id = $jq(this).text();
alert ("Member ID is: " + member_id);
}
I would really like to do what I did for the email address cell data, but have not figured out how to do that.
Clickable email cell data:
<td><?php echo make_clickable($wpdb->get_var( "SELECT * FROM $table_name ORDER BY $table_name.`last_name` ASC ", 3, $cur_row)); ?></td> <!--- email --->
Thanks for any help or suggestions.
cell clickable
cell clickable
asked Nov 28 '18 at 21:00
LCSFLCSF
22
22
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
Actually, this was far simpler than I had thought. I simply changed the selector of the delegate method to be the class of the column of interest:
$jq("#mem_dir").delegate(".member_id", "click", function() {
var member_id = $jq(this).text();
var member_id = member_id.trim();
alert ("ID is: " + member_id);
With a little CSS on the class to create a pointer when hovering over the cell all worked fine:
#member_id {
color: blue;
text-decoration: underline;
cursor: pointer;
}
add a comment |
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53528014%2fhow-to-make-only-one-column-of-a-table-clickable%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
Actually, this was far simpler than I had thought. I simply changed the selector of the delegate method to be the class of the column of interest:
$jq("#mem_dir").delegate(".member_id", "click", function() {
var member_id = $jq(this).text();
var member_id = member_id.trim();
alert ("ID is: " + member_id);
With a little CSS on the class to create a pointer when hovering over the cell all worked fine:
#member_id {
color: blue;
text-decoration: underline;
cursor: pointer;
}
add a comment |
Actually, this was far simpler than I had thought. I simply changed the selector of the delegate method to be the class of the column of interest:
$jq("#mem_dir").delegate(".member_id", "click", function() {
var member_id = $jq(this).text();
var member_id = member_id.trim();
alert ("ID is: " + member_id);
With a little CSS on the class to create a pointer when hovering over the cell all worked fine:
#member_id {
color: blue;
text-decoration: underline;
cursor: pointer;
}
add a comment |
Actually, this was far simpler than I had thought. I simply changed the selector of the delegate method to be the class of the column of interest:
$jq("#mem_dir").delegate(".member_id", "click", function() {
var member_id = $jq(this).text();
var member_id = member_id.trim();
alert ("ID is: " + member_id);
With a little CSS on the class to create a pointer when hovering over the cell all worked fine:
#member_id {
color: blue;
text-decoration: underline;
cursor: pointer;
}
Actually, this was far simpler than I had thought. I simply changed the selector of the delegate method to be the class of the column of interest:
$jq("#mem_dir").delegate(".member_id", "click", function() {
var member_id = $jq(this).text();
var member_id = member_id.trim();
alert ("ID is: " + member_id);
With a little CSS on the class to create a pointer when hovering over the cell all worked fine:
#member_id {
color: blue;
text-decoration: underline;
cursor: pointer;
}
answered Nov 29 '18 at 23:32
LCSFLCSF
22
22
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53528014%2fhow-to-make-only-one-column-of-a-table-clickable%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
