Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <tr>
- <td class="expand"><img src="plus.gif"/></td>
- <td>Data1</td><td>Data2</td><td>Data3</td>
- </tr>
- <tr class="show hide">
- <td> </td>
- <td>Data4</td><td>Data5</td><td>Data6</td>
- </tr>
- $(document).ready(function(){
- $('.expand').click(function() {
- if( $(this).hasClass('hidden') )
- $('img', this).attr("src", "plus.jpg");
- else
- $('img', this).attr("src", "minus.jpg");
- $(this).toggleClass('hidden');
- $(this).parent().next().toggle();
- });
- });
- $(document).ready( function () {
- $(".expand").click(function() {
- $("img",this).attr("src",
- $("img",this)
- .attr("src")=="minus.gif" ? "plus.gif" : "minus.gif"
- );
- $(this).parent().next().toggle();
- });
- });
- //this will bind the click event
- //put this in a $(document).ready or something
- $(".expand").click(expand_ClickEvent);
- //this is your event handler
- function expand_ClickEvent(){
- //get the TR that you want to show/hide
- var TR = $('.expand').parent().next();
- //check its class
- if (TR.hasClass('hide')){
- TR.removeClass('hide'); //remove the hide class
- TR.addClass('show'); //change it to the show class
- TR.show(); //show the TR (you can use any jquery animation)
- //change the image URL
- //select the expand class and the img in it, then change its src attribute
- $('.expand img').attr('src', 'minus.gif');
- } else {
- TR.removeClass('show'); //remove the show class
- TR.addClass('hide'); //change it to the hide class
- TR.hide(); //hide the TR (you can use any jquery animation)
- //change the image URL
- //select the expand class and the img in it, then change its src attribute
- $('.expand img').attr('src', 'plus.gif');
- }
- }
- <tr>
- <td colspan="2" align="center"
- <input type="image" src="save.gif" id="saveButton" name="saveButton"
- style="visibility: collapse; display: none"
- onclick="ToggleFunction(false)"/>
- <input type="image" src="saveDisabled.jpg" id="saveButtonDisabled"
- name="saveButton" style="visibility: collapse; display: inline"
- onclick="ToggleFunction(true)"/>
- </td>
- </tr>
- ToggleFunction(seeSaveButton){
- if(seeSaveButton){
- $("#saveButton").attr("disabled", true)
- .attr("style", "visibility: collapse; display: none;");
- $("#saveButtonDisabled").attr("disabled", true)
- .attr("style", "display: inline;");
- }
- else {
- $("#saveButton").attr("disabled", false)
- .attr("style", "display: inline;");
- $("#saveButtonDisabled")
- .attr("disabled", true)
- .attr("style", "visibility: collapse; display: none;");
- }
- }
Add Comment
Please, Sign In to add comment