Solved

Grey out an entire table row - php/javascript

Posted on 2013-05-13
7
1,132 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
  • 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
3 Use Cases for Connected Systems

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

 
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

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

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

Although it can be difficult to imagine, someday your child will have a career of his or her own. He or she will likely start a family, buy a home and start having their own children. So, while being a kid is still extremely important, it’s also …
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
This tutorial demonstrates how to identify and create boundary or building outlines in Google Maps. In this example, I outline the boundaries of an enclosed skatepark within a community park.  Login to your Google Account, then  Google for "Google M…
This tutorial walks through the best practices in adding a local business to Google Maps including how to properly search for duplicates, marker placement, and inputing business details. Login to your Google Account, then search for "Google Mapmaker…

932 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

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now