Solved

Grey out an entire table row - php/javascript

Posted on 2013-05-13
7
1,250 Views
Last Modified: 2013-06-13
Hi,
I have a php page where I query the database and generate a table to display the results. Now in the table, on clicking an element I want to grey out that row.
code snippet for the table
echo "<table><tr>
                                        <th>Exclude</th>
&#9;&#9;&#9;&#9;&#9;<th>Hospital</th>
&#9;&#9;&#9;&#9;&#9;<th>Patient</th>
&#9;&#9;&#9;&#9;&#9;<th>NS</th>
&#9;&#9;&#9;&#9;&#9;<th>MRN</th>
&#9;&#9;&#9;&#9;</tr>";
<?

for($i=0; $i < 10; $i++){
?>
            <tr>
              <th align="left" class="form-matrix-row-headers" nowrap="nowrap">
                <? echo $i+1;?>
              </th>
              <td align="center" class="form-matrix-values">
                <input class="form-textbox" type="text" size="5" name="qt6_clickPatient[<? echo $i;?>][]" />
              </td>
              <td align="center" class="form-matrix-values">
                <input class="form-textbox" type="text" size="5" value = <? echo $census_report[$i]["Bed"];?> name="qt6_clickPatient[<? echo $i;?>][]" />
              </td>
              <td align="center" class="form-matrix-values">
                <input class="form-textbox" type="text" size="5" value = <? echo $census_report[$i]["Patient"];?> name="qt6_clickPatient[<? echo $i;?>][]" />
              </td>
<?
}
?>

Open in new window


Now if I click on patient name both bed and patient name should be greyed out, indicating that this record has been disabled for further processing, and a check mark appear under exclude.
Appreciate any help.
I have a javascript which fires up on onChange event
     document.getElementById("Patient").disabled = true;
But this does not work as the records are inside a for loop and in an array.
Thanks,
0
Comment
Question by:Mohit_t
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 3
7 Comments
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
ID: 39163556
0
 

Author Comment

by:Mohit_t
ID: 39186243
Hi leakim971,
Thanks for the quick response. I was caught up in other development activities so could not reply earlier. I implemented your solution, this works fine in IE but not in FF or Chrome. Appreciate if you can help me make it cross-browser compatible.
Also I need to be able to toggle i.e. once greyed out I also need to re-enable the cells by clicking on the table row, this was not there in my original post.

Thanks,
0
 

Author Comment

by:Mohit_t
ID: 39205126
Appreciate any comments / solutions/ inputs on this question
0
How our DevOps Teams Maximize Uptime

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us. Read the use case whitepaper.

 
LVL 82

Expert Comment

by:leakim971
ID: 39206028
the solution work fine for me on FF and Chrome
0
 

Author Comment

by:Mohit_t
ID: 39206762
Hi  leakim971,
In IE 9 the solution works correctly I choose some table rows and they are greyed out and on submission of the form, I don't see the greyed out records on the next page.
In Chrome 27.0.x, table rows are greyed but on form submission, I see the greyed out results also on the next page.
In FF 21.0 nothing happens on clicking the table rows.
Seems like both FF and chrome behave differently to the same code, there  might be some browser specific adjustments that need to be made.
Also how can we make this toggle between greying out the table rows and deselecting the greyed out rows when it is clicked again.
Could there be a solution for this in jquery, I have not used jquery very much so not sure of a solutio in jquery.
 
Thanks
0
 
LVL 82

Expert Comment

by:leakim971
ID: 39207326
I don't see the greyed out records on the next page
Why do you think you will see them greyed on the next page?

In FF 21.0 nothing happens on clicking the table rows.
Not mine :
on FF 21
Look like we're not working on the same code? You should confirm the jsfiddle work for you first between integrating the code in your webpage and saying it don't work but perhaps I miss something?
0

Featured Post

Secure Your WordPress Site: 5 Essential Approaches

WordPress is the web's most popular CMS, but its dominance also makes it a target for attackers. Our eBook will show you how to:

Prevent costly exploits of core and plugin vulnerabilities
Repel automated attacks
Lock down your dashboard, secure your code, and protect your users

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article will inform Clients about common and important expectations from the freelancers (Experts) who are looking at your Gig.
FAQ pages provide a simple way for you to supply and for customers to find answers to the most common questions about your company. Here are six reasons why your company website should have a FAQ page
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).

728 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question