2nd level child in jtable

we have written following script to display 2nd level of child. but when I click on imgdelhe, function is not triggering..

any ideas really appreciated..

thanks
nithik

BranchAddresses: {
                    title: '',	
					width: '5%',
                    sorting: false,
                    edit: false,
					openChildAsAccordion: true,
                    create: false,
                    display: function (BranchAddressData) {
                        //Create an image that will be used to open child table
                        var $imgdetalhe = $('<img src="/practicumBeta/images/address_icon.png" with="30" height="30" title="Address List" />');
                        //Open child table when user clicks the image
                        $imgdetalhe.click(function () {						
                            $imgdetalhe.closest('.jtable-child-table-container').jtable('openChildTable',
									 $imgdetalhe.closest('tr'),
                                    {
                                        title: branchData.record.Name + ' - Related Addresses',
                                        messages: {
        									addNewRecord: '+ Add New Address'
    									},
										selecting: true, //Enable selecting
           								multiselect: false, //Allow multiple selecting
            							selectingCheckboxes: true, //Show checkboxes on first column
										actions: {
                                            listAction: '/practicumBeta/rewrite.cfm/app.Practicums/SearchBranchAddress?format=json&SiteID=' + BranchAddressData.record.BranchID,
                                            //deleteAction: '/Demo/DeletePhone',
                                           // updateAction: '/Demo/UpdatePhone',
                                            createAction: '/Demo/CreatePhone'
                                        },
                                        fields: {
                                            AddressID: {
                                                type: 'hidden',
                                                defaultValue: organizationAddressData.record.AddressID
                                            },
                                            BranchID: {
                                                key: true,
                                                create: false,
                                                edit: false,
                                                list: false
                                            },                                            
										    FullAddress: {
                                                title: 'Address',
                                                width: '40%'                                               
                                            },
                                            CityName: {
                                                title: 'City',
                                                width: '20%'
                                            },
                                            ZipCode: {
                                                title: 'Zip',
                                                width: '10%'                                               
                                            },				
											 PhoneNumber: {
                                                title: 'Phone',
                                                width: '10%'                                               
                                            },				
																		
											CountryCode: {
                                                title: 'Country',
                                                width: '10%',
                                                options: '/practicumBeta/rewrite.cfm/app.Practicums/SearchResults?mode=countryList&format=json'
                                            },
									
										 AddressStateID: {
						                    title: 'State',
						                    width: '5%',
						                    display: function (data) {
						                        return( data.record.StateName );
						                    },
						                    dependsOn: 'CountryCode', //Cities depends on countries. Thus, jTable builds cascade dropdowns!
						                    options: function (data) {
						                        if (data.source == 'list') {
						                            return '/practicumBeta/rewrite.cfm/app.Practicums/SearchResults?mode=stateList&CountryCode=0&format=json';
						                        }
						                        return '/practicumBeta/rewrite.cfm/app.Practicums/SearchResults?mode=stateList&format=json&CountryCode=' + data.dependedValues.CountryCode;
						                    }
						                },	
											
											
											
                                        }
                                    
                                    });
                        });
                        //Return image to show on the person row
                        return $imgdetalhe;
                    }
                },		
			// end child table	

Open in new window

RNithikAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Julian HansenCommented:
There is no reference to "imgdelhe" in the script you provided do you mean "imgdetalhe"

Can you post a link so we can see this in context.
0
RNithikAuthor Commented:
Yes. imgdetalhe.. i spelled wrong in my previous post..

you can see imgdetalhe in the script.

followed this example.

https://github.com/hikalkan/jtable/issues/314 )

-nithik
0
Julian HansenCommented:
Ok but need to see the code on your page - not the sample page.
0
Exploring SQL Server 2016: Fundamentals

Learn the fundamentals of Microsoft SQL Server, a relational database management system that stores and retrieves data when requested by other software applications.

RNithikAuthor Commented:
oh sorry I mistaken.. here is the code. Thanks for your positive responses..

$(document).ready(function () {
        $('#OrganizationTableContainer').jtable({
            title: 'Organization Search results',
			selecting: true, //Enable selecting
			multiselect: false, //Allow multiple selecting
			selectingCheckboxes: true, //Show checkboxes on first column	
			messages: {
        	addNewRecord: '+ Add New Organization'
    		},
			openChildAsAccordion: true,
            actions: {
                listAction: '/practicumBeta/rewrite.cfm/app.Practicums/SearchOrganizations?format=json',			  
                createAction: '/practicumBeta/rewrite.cfm/app.Practicums/CreateOrganization?format=json',
               // updateAction: '/GettingStarted/UpdatePerson',
               // deleteAction: '/GettingStarted/DeletePerson'
            },
            fields: {
                SiteID: {
                    key: true,
                    list: false
                },
		 //CHILD TABLE DEFINITION FOR "Organizations"		
		Orgs: {
                    title: '',	
					width: '5%',
                    sorting: false,
                    edit: false,
					openChildAsAccordion: true,
                    create: false,
                    display: function (organizationAddressData) {
                        //Create an image that will be used to open child table
                        var $img = $('<img src="/practicumBeta/images/address_icon.png" with="30" height="30" title="Address List" />');
                        //Open child table when user clicks the image
                        $img.click(function () {						
                            $('#OrganizationTableContainer').jtable('openChildTable',
                                    $img.closest('tr'),
                                    {
                                        title: organizationAddressData.record.OrgName + ' - Related Addresses',
                                        messages: {
        									addNewRecord: '+ Add New Address'
    									},
										selecting: true, //Enable selecting
           								multiselect: false, //Allow multiple selecting
            							selectingCheckboxes: true, //Show checkboxes on first column
										actions: {
                                            listAction: '/practicumBeta/rewrite.cfm/app.Practicums/SearchSiteAddress?format=json&SiteID=' + organizationAddressData.record.SiteID,
                                            //deleteAction: '/Demo/DeletePhone',
                                           // updateAction: '/Demo/UpdatePhone',
                                            createAction: '/Demo/CreatePhone'
                                        },
                                        fields: {
                                            AddressID: {
                                                type: 'hidden',
                                                defaultValue: organizationAddressData.record.AddressID
                                            },
                                            BranchID: {
                                                key: true,
                                                create: false,
                                                edit: false,
                                                list: false
                                            },                                            
										    FullAddress: {
                                                title: 'Address',
                                                width: '40%'                                               
                                            },
                                            CityName: {
                                                title: 'City',
                                                width: '20%'
                                            },
                                            ZipCode: {
                                                title: 'Zip',
                                                width: '10%'                                               
                                            },				
											 PhoneNumber: {
                                                title: 'Phone',
                                                width: '10%'                                               
                                            },				
																		
											CountryCode: {
                                                title: 'Country',
                                                width: '10%',
                                                options: '/practicumBeta/rewrite.cfm/app.Practicums/SearchResults?mode=countryList&format=json'
                                            },
									
										 AddressStateID: {
						                    title: 'State',
						                    width: '5%',
						                    display: function (data) {
						                        return( data.record.StateName );
						                    },
						                    dependsOn: 'CountryCode', //Cities depends on countries. Thus, jTable builds cascade dropdowns!
						                    options: function (data) {
						                        if (data.source == 'list') {
						                            return '/practicumBeta/rewrite.cfm/app.Practicums/SearchResults?mode=stateList&CountryCode=0&format=json';
						                        }
						                        return '/practicumBeta/rewrite.cfm/app.Practicums/SearchResults?mode=stateList&format=json&CountryCode=' + data.dependedValues.CountryCode;
						                    }
						                },	
											
											
											
                                        }
                                    }, function (data) { //opened handler
                                        data.childTable.jtable('load');
                                    });
                        });
                        //Return image to show on the person row
                        return $img;
                    }
                },		
			// end child table	
			
			 Branches: {
                    title: '',
                    width: '5%',
                    sorting: false,
                    edit: false,
					openChildAsAccordion: true,
                    create: false,
                    display: function (branchData) {
                        //Create an image that will be used to open child table
                        var $img = $('<img src="/practicumBeta/images/branches.png" with="35" height="30" title="Branch List" />');
                        //Open child table when user clicks the image
                        $img.click(function () {
                            $('#OrganizationTableContainer').jtable('openChildTable',
                                    $img.closest('tr'), //Parent row
                                    {
                                    title: branchData.record.OrgName + ' - Branch List',
									messages: {
        									addNewRecord: '+ Add New Branch'
    									},
									selecting: true, //Enable selecting
           							multiselect: false, //Allow multiple selecting
            						selectingCheckboxes: true, //Show checkboxes on first column
                                    actions: {
                                        listAction: '/practicumBeta/rewrite.cfm/app.Practicums/GetBranchList?format=json&SiteID=' + branchData.record.SiteID,
                                        //deleteAction: '/Demo/DeleteExam',
                                        //updateAction: '/Demo/UpdateExam',
                                        createAction: '/Demo/CreateExam'
                                    },
                                    fields: {
                                        BranchID: {
                                            type: 'hidden',
                                            defaultValue: branchData.record.BranchID
                                        },
                                       
	 //CHILD TABLE DEFINITION FOR "Branch Addresses"		
		BranchAddresses: {
                    title: '',	
					width: '5%',
                    sorting: false,
                    edit: false,
					openChildAsAccordion: true,
                    create: false,
                    display: function (BranchAddressData) {
                        //Create an image that will be used to open child table
                        var $imgdetalhe = $('<img src="/practicumBeta/images/address_icon.png" with="30" height="30"  title="Address List" />');
                        //Open child table when user clicks the image
                        $imgdetalhe.click(function () {						
                            $imgdetalhe.closest('.jtable-data-row jtable-row-even').jtable('openChildTable',
									 $imgdetalhe.closest('tr'),
                                    {
                                        title: branchData.record.Name + ' - Related Addresses',
                                        messages: {
        									addNewRecord: '+ Add New Address'
    									},
										selecting: true, //Enable selecting
           								multiselect: false, //Allow multiple selecting
            							selectingCheckboxes: true, //Show checkboxes on first column
										actions: {
                                            listAction: '/practicumBeta/rewrite.cfm/app.Practicums/SearchBranchAddress?format=json&SiteID=' + BranchAddressData.record.BranchID,
                                            //deleteAction: '/Demo/DeletePhone',
                                           // updateAction: '/Demo/UpdatePhone',
                                            createAction: '/Demo/CreatePhone'
                                        },
                                        fields: {
                                            AddressID: {
                                                type: 'hidden',
                                                defaultValue: organizationAddressData.record.AddressID
                                            },
                                            BranchID: {
                                                key: true,
                                                create: false,
                                                edit: false,
                                                list: false
                                            },                                            
										    FullAddress: {
                                                title: 'Address',
                                                width: '40%'                                               
                                            },
                                            CityName: {
                                                title: 'City',
                                                width: '20%'
                                            },
                                            ZipCode: {
                                                title: 'Zip',
                                                width: '10%'                                               
                                            },				
											 PhoneNumber: {
                                                title: 'Phone',
                                                width: '10%'                                               
                                            },				
																		
											CountryCode: {
                                                title: 'Country',
                                                width: '10%',
                                                options: '/practicumBeta/rewrite.cfm/app.Practicums/SearchResults?mode=countryList&format=json'
                                            },
									
										 AddressStateID: {
						                    title: 'State',
						                    width: '5%',
						                    display: function (data) {
						                        return( data.record.StateName );
						                    },
						                    dependsOn: 'CountryCode', //Cities depends on countries. Thus, jTable builds cascade dropdowns!
						                    options: function (data) {
						                        if (data.source == 'list') {
						                            return '/practicumBeta/rewrite.cfm/app.Practicums/SearchResults?mode=stateList&CountryCode=0&format=json';
						                        }
						                        return '/practicumBeta/rewrite.cfm/app.Practicums/SearchResults?mode=stateList&format=json&CountryCode=' + data.dependedValues.CountryCode;
						                    }
						                },	
											
											
											
                                        }
                                    
                                    });
                        });
                        //Return image to show on the person row
                        return $imgdetalhe;
                    }
                },		
			// end child table	
									   
									   
                                        Name: {
                                            title: 'Branch name',
                                            width: '40%'
                                        }
                                    }
                                }, function (data) { //opened handler
                                    data.childTable.jtable('load');
                                });
                        });
                        //Return image to show on the person row
                        return $img;
                    }
                },
				// END of Branches table 
				
			
                OrgName: {
                    title: 'Organization',
                    width: '30%'
                },
                SiteCode: {
                    title: 'Code',
                    width: '30%'
                }
            }
        });
		
		 $('#LoadOrgRecordsButton').click(function (e) {
            e.preventDefault();
            $('#OrganizationTableContainer').jtable('load', {
                orgName: $('#orgName').val()               
            });
        });
 
        //Load all records when page is first shown
       // $('#OrganizationTableContainer').click();		
		//$('#OrganizationTableContainer').jtable('load');		
    });

Open in new window

0
Julian HansenCommented:
Can we not see the page where it is running ? If not a direct link - can you do a view source of the page and save to a file and attach?
0
RNithikAuthor Commented:
here is the source of page.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>RSPH Dev Web Client</title>
<head>
<script>
	Page = '127.0.0.1';
</script>

<link href="/DevBeta/stylesheets/header.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/ddcolortabs.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/pro_drop_1.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/styles.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/demo_table_jui.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/demo_page.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/jquery-ui-1.10.2.custom.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/jquery-ui.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/jquery.ui.accordion.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/jquery.ui.all.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/jquery.ui.autocomplete.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/jquery.ui.base.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/jquery.ui.button.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/jquery.ui.core.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/jquery.ui.datepicker.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/jquery.ui.dialog.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/jquery.ui.menu.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/jquery.ui.progressbar.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/jquery.ui.resizable.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/jquery.ui.selectable.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/jquery.ui.slider.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/jquery.ui.spinner.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/jquery.ui.tabs.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/jquery.ui.theme.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/jquery.ui.tooltip.css" media="all" rel="stylesheet" type="text/css" />
<link href="/DevBeta/stylesheets/jtable/themes/metro/blue/jtable.min.css" media="all" rel="stylesheet" type="text/css" />
<script src="/DevBeta/javascripts/jquery-1.9.1.js" type="text/javascript"></script>
<script src="/DevBeta/javascripts/wheels.js" type="text/javascript"></script>
<script src="/DevBeta/javascripts/dropdowntabs.js" type="text/javascript"></script>
<script src="/DevBeta/javascripts/jquery-ui-1.10.2.custom.js" type="text/javascript"></script>
<script src="/DevBeta/javascripts/stuHover.js" type="text/javascript"></script>
<script src="/DevBeta/javascripts/jquery.dataTables.js" type="text/javascript"></script>
<script src="/DevBeta/javascripts/jquery-migrate-1.2.1.min.js" type="text/javascript"></script>
<script src="/DevBeta/javascripts/jquery.validate.js" type="text/javascript"></script>
<script src="/DevBeta/javascripts/jtable/jquery.jtable.min.js" type="text/javascript"></script>

        	
		
        
       
<script>	
	
	$(function() {
		
		var dates = $( "#from, #to" ).datepicker({
			defaultDate: "+1w",
			changeMonth: true,
			numberOfMonths: 3,
			onSelect: function( selectedDate ) {
				var option = this.id == "from" ? "minDate" : "maxDate",
					instance = $( this ).data( "datepicker" ),
					date = $.datepicker.parseDate(
						instance.settings.dateFormat ||
						$.datepicker._defaults.dateFormat,
						selectedDate, instance.settings );
				dates.not( this ).datepicker( "option", option, date );
			}
		});


		// a workaround for a flaw in the demo system (http://dev.jqueryui.com/ticket/4375), ignore!
		$( "#dialog:ui-dialog" ).dialog( "destroy" );
		$('#tabs').tabs();
		
		$('#dialog_link, ul#icons li').hover(
					function() { $(this).addClass('ui-state-hover'); }, 
					function() { $(this).removeClass('ui-state-hover'); }
				);
	
		$( "#dialog-modal" ).dialog({
			 width: 400, height: 250, modal: true, show: "blind", hide: "explode"
		});
		


		
	});
</script>

    	<script type="text/javascript" charset="utf-8">
			var asInitVals = new Array();
			
				$(document).ready(function() {
					var oTable = $('#example').dataTable({
						"bLengthChange": true,
						"bStateSave": true,
						"iDisplayLength": 20,
						"aLengthMenu": [[10, 20, 50, 100, 200, 500], [10,  20, 50, 100, 200, 500]],
						"bJQueryUI": true,
						"sPaginationType": "full_numbers"
					});
					
					$("tfoot input").keyup( function () {
						/* Filter on the column (the index) of this element */
						oTable.fnFilter( this.value, $("tfoot input").index(this) );
					} );
					
					
	
					/*
					 * Support functions to provide a little bit of 'user friendlyness' to the textboxes in 
					 * the footer
					 */
					$("tfoot input").each( function (i) {
						asInitVals[i] = this.value;
					} );
					
					$("tfoot input").focus( function () {
						if ( this.className == "search_init" )
						{
							this.className = "";
							this.value = "";
						}
					} );
					
					$("tfoot input").blur( function (i) {
						if ( this.value == "" )
						{
							this.className = "search_init";
							this.value = asInitVals[$("tfoot input").index(this)];
						}
					} );
					
					
				} );
			</script>
			
			
			 <script>
			    $(function() {
			        $( "#datepicker" ).datepicker();
			    });
			 </script>
    
<script src="/DevBeta/javascripts/supervisor/search-modal-window.js" type="text/javascript"></script>
<script src="/DevBeta/javascripts/supervisor/search-result-table.js" type="text/javascript"></script>
<script src="/DevBeta/javascripts/supervisor/search-result-table-orgs.js" type="text/javascript"></script>
</head>
<body>

		<div id="wrapper">
		<div id="header">
			<a name="top" href="http://www.dev.edu/home/index-internal.html">
				<div id="logo">
					<img src="http://www.sph.dev.edu/cms/images/sph_banner_dev.gif" alt="Dev University">
				</div>
			</a>
			<a href="http://www.sph.dev.edu/cms/index.html">
				<div id="logRight">
					<img src="http://www.sph.dev.edu/cms/images/sph_banner_rsph.gif" id="logoRight" alt="School of Public Health">
				</div>
			</a>
		</div>
		
		
			



		
			
		
    
    
    <ul id="nav">
    	<li class="top"> <a class="top_link" href="/DevBeta/rewrite.cfm/"><span>Home</span></a> </li>
		
	
    
    
			
                   <li class="top"><a class="top_link" href="/DevBeta/rewrite.cfm/app.-practicums"><span class='down'>Get Started</span></a>
                          <ul class="sub">
                              <li><a href="http://e.sph.dev.edu/DevProposal/docs/DevGuide_Student.pdf"><span>Dev Handbook</span></a></li>
                              <li><a href="http://cfusion.sph.dev.edu/DevProposal/docs/DevGLOSSARY.pdf"><span>Glossary</span></a></li>
                              <li><a href="http://cfusion.sph.dev.edu/DevProposal/docs/DevFAQ_Student.pdf"><span>FAQs</span></a></li>
                              <li><a href="http://cfusion.sph.dev.edu/DevProposal/Includes/TimeSheet.xls"><span>Timesheet</span></a></li>
                          </ul>
                      </li>
                      <li class="top"><a class="top_link" href="/DevBeta/rewrite.cfm/app/students/978/practicums"><span class='down'>My Practica</span></a>
                          <ul class="sub">

                              
                              <li><a href="/DevBeta/rewrite.cfm/app/students/978/edit"><span>Demographic Data</span></a></li>
                              <li><a href="/DevBeta/rewrite.cfm/app/students/978/practicums"><span>Dev Data</span></a></li>

                          </ul>
                      </li>
                     
                      <li class="top"><a class="top_link" href="/DevBeta/rewrite.cfm/app/students/978/summary.cfm" practicumkey="1"><span>Summary</span></a></li>
                      <li class="top"><a class="top_link" href="/DevBeta/rewrite.cfm/main/logout"><span>Logout</span></a></li>
                      </li>
             			
				
		
	
    </ul>
	
		
		<div id="content">
        
        	<div id="FlashMessage">
            	
            </div>
        
        	 
		
<div style="display:none" title="Search For Supervisor" id="dialog-comp">
	<div align="right"><button  id="simpleConfirm" type="button">Close</button>	</div>
	    <fieldset>
	        <legend><h3>Search Creteria</h3></legend>			
				<form action="" id="searchSupervisors" onsubmit="return false" name="FindSupervisor" method="post">              
	       		Last Name: <input type="input" name="lastname" id="lastname" >    
		  		Email: <input type="input" name="email" id="email" onkeyup="validateForm()">  <input type="button" value="Search" id="LoadRecordsButton" />  <br>	
		</fieldset>
			  
		
	<form action="/DevBeta/rewrite.cfm/app.-practicums/search-organizations/10" method="post" onsubmit="return false" studentkey="978">			 
		<fieldset>
	        <legend><h3>Search Results</h3></legend>			 
			  	<div id="SupervisorTableContainer">
			  	 NOTE: If you were not able to find supervisor, please click on  "Add New Supervisor" button.
				</div>
		</fieldset>
			 NOTE: if you were not able to find Organization that you are looking for in this list, you could do it on next screen.
		<input id="SelSupCheck" type="submit" value="Submit openorg " class="open-org"   />
        <input id="SelSupCheck1" type="submit" value="Submit noopenorg" class="open-org1" style="display:none" /> 
        
       </p> 
		
	</form>	 
	
	
		<div id="Mastertable">
		</div>
	
</div>





<div id="dialog-confirm" title="confirmation" style="display:none" >
    <p><span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;"></span>
    Are you sure you want to leave this window ?</p>
</div>	
    
<div style="display:none" title="System Message" id="dialog-error">
   <p id="error-message" style="text-align:center"></p>
</div>

<div style="display:none" title="Organization Search" id="dialog-orgs">
	 <fieldset>
	        <legend><h3>Search Creteria</h3></legend>
			<form action="" id="searchOrganizations" onsubmit="return false" name="FindOrganization" method="post">  
			 Organization Name: <input type="input" name="orgName" id="orgName" >    <input type="submit" value="Search" id="LoadOrgRecordsButton" />  <br>	
			 </form>
	</fieldset> 	
	<fieldset>
	        <legend><h3>Search Results</h3></legend>	
			<div id="OrganizationTableContainer"></div>
	</fieldset> 
	
	<input id="Done" type="submit" value="Submit"   />	
</div>
<form action="/DevBeta/rewrite.cfm/app/students/978/practicums/10" method="post" studentkey="978">
	 
	<input type="hidden" name="_method" value="put" />	
	
		
		
            	<h1>Dev Information</h1> 
				
    			<style type="text/css">
		.dlg-no-close .ui-dialog-titlebar-close {
			display: none;
		}
</style>

	
  <p>* indicates a required field.</p>
        
	    <h3>First, enter your Dev Information. </h3>
		
        <!--<div style="position:relative; float:right; left:-400px;">
       		<img src="/DevBeta/images/mockup/sutdent.jpg" height="150" width="140" />
        </div>-->
        
   			<fieldset>        	
            	<legend><h3>Your Dev</h3></legend>
                
                  <div><label for="practicum-semesterEnrolled">Semester/Year of Dev *</label><select id="practicum-semesterEnrolled" name="practicum[semesterEnrolled]"><option value="0">Select</option><option value="5031">SP 2003</option><option value="5036">SU 2003</option><option value="5039">FA 2003</option><option value="5041">SP 2004</option><option value="5046">SU 2004</option><option value="5049">FA 2004</option><option value="5051">SP 2005</option><option value="5056">SU 2005</option><option value="5059">FA 2005</option><option value="5061">SP 2006</option><option value="5066">SU 2006</option><option value="5069">FA 2006</option><option value="5071">SP 2007</option><option value="5076">SU 2007</option><option value="5079">FA 2007</option><option value="5081">SP 2008</option><option value="5086">SU 2008</option><option value="5089">FA 2008</option><option value="5091">SP 2009</option><option value="5096">SU 2009</option><option value="5099">FA 2009</option><option value="5101">SP 2010</option><option value="5106">SU 2010</option><option value="5109">FA 2010</option><option value="5111">SP 2011</option><option value="5116">SU 2011</option><option value="5119">FA 2011</option><option value="5121">SP 2012</option><option value="5126">SU 2012</option><option value="5129">FA 2012</option><option selected="selected" value="5131">SP 2013</option><option value="5136">SU 2013</option><option value="5139">FA 2013</option><option value="5141">SP 2014</option><option value="5146">SU 2014</option><option value="5149">FA 2014</option><option value="5151">SP 2015</option><option value="5156">SU 2015</option><option value="5159">FA 2015</option><option value="5161">SP 2016</option><option value="5166">SU 2016</option><option value="5169">FA 2016</option><option value="5171">SP 2017</option><option value="5176">SU 2017</option><option value="5179">FA 2017</option><option value="5181">SP 2018</option><option value="5186">SU 2018</option><option value="5189">FA 2018</option><option value="5191">SP 2019</option><option value="5196">SU 2019</option><option value="5199">FA 2019</option><option value="5201">SP 2020</option><option value="5206">SU 2020</option><option value="5209">FA 2020</option></select></div><br /> <div class='clear-left-el'><label for="practicum-DevStartDate">Dev Start Date *</label><input id="practicum-DevStartDate" name="practicum[DevStartDate]" type="text" value="2013-03-01 00:00:00.0" /></div> <div class='clear-left-el'><label for="practicum-DevEndDate">Dev End Date *</label><input id="practicum-DevEndDate" name="practicum[DevEndDate]" type="text" value="2014-05-01 00:00:00.0" /></div> <div class='clear-left-el'><label for="practicum-PositionTitle">Dev Position Title *</label><input id="practicum-PositionTitle" maxlength="100" name="practicum[PositionTitle]" type="text" value="Research Assistant" /></div> <div class='clear-left-el'><label for="practicum-DevSummary">Summary of Dev *</label><br /><textarea cols="85" id="practicum-DevSummary" name="practicum[DevSummary]" rows="5">And the rockets red glare, the bombs bursting in air gave proof through the night that our flag was still there.</textarea></div> 
            </fieldset>            
           
          	<fieldset>        	
            	<legend><h3>Supervisor Search</h3></legend>
				NOTE: Please follw the supervisor search process. <br>
				<form onsubmit="return false" id="searchSupervisors" name="FindSupervisor" method="post">
				Lastname: <input type="input" name="lastname" id="ssl" >    
		  		Email: <input type="input" name="email"  id="sse" >  
		  		<input type="button" value="Search" id="search-button" onclick="javascript:void(0);" class="open-comp" />  <br>	
          		</form>
			</fieldset>		
              
           
             
             <fieldset class="student-practicum">
             
             	<legend><h3>Your Supervisor</h3></legend>
                
             			<input id="practicum-SupervisorContactID" label="Supervisor Contact ID (will be a hidden field)" name="practicum[SupervisorContactID]" type="hidden" value="985" /> <div class='clear-left-el'><label for="supervisor-contact-lastName">Site Supervisor Last Name</label><input id="supervisor-contact-lastName" maxlength="50" name="supervisor[contact][lastName]" readonly="readonly" type="text" value="TufonCDC" /></div> <div class='clear-left-el'><label for="supervisor-contact-firstName">Site Supervisor First Name</label><input id="supervisor-contact-firstName" maxlength="50" name="supervisor[contact][firstName]" type="text" value="Rosemary" /></div> <div class='clear-left-el'><label for="supervisor-contact-title">Site Supervisor Title</label><input id="supervisor-contact-title" name="supervisor[contact][title]" type="text" value="" /></div> <div class='clear-left-el'><label for="supervisor-contact-primaryEmail">Site Supervisor Email</label><input id="supervisor-contact-primaryEmail" maxlength="200" name="supervisor[contact][primaryEmail]" type="text" value="rtufon@hotmail.com" /></div> <div class='clear-left-el'><label for="supervisor-contact-primaryPhone">Site Supervisor Phone</label><input id="supervisor-contact-primaryPhone" maxlength="20" name="supervisor[contact][primaryPhone]" type="text" value="" /></div>
       		</fieldset>
        	
            
             <h3>Finally, please enter your Dev Organization Information.</h3>
            
            <fieldset class="student-practicum">
            
             	<legend><h3>Your Organization</h3></legend>
                
                		
                        <input id="site_address_list" label="Site Address ID (will be a hidden field)" name="practicum[SiteAddressID]" type="hidden" value="50" />
                        
                        
						
						
                       
                      
                        
                      <div class="clear-left-el">
                      	<label for="Address1_Dev_Site">Address1 of Dev Site</label>
                      	<input type="text" value="" name="address1" maxlength="50" id="id_Address1" readonly="readonly">
                      </div>
                      <div class="clear-left-el">
                      	<label for="Address2_Dev_Site">Address2 of Dev Site</label>
                      	<input type="text" value="" name="address2" maxlength="50" id="id_Address2" readonly="readonly">
                      </div>
                      <div class="clear-left-el">
                      	<label for="City_Dev_Site">City of Dev Site</label>
                      	<input type="text" value="" name="city" maxlength="50" id="city_id" readonly="readonly">
                      </div>
                      <div class="clear-left-el">
                      	<label for="State_Dev_Site">State of Dev Site</label>
                      	<input type="text" value="" name="state" maxlength="50" id="id_state" readonly="readonly">
                      </div>
                      <div class="clear-left-el">
                      	<label for="Zip_Dev_Site">Zip code of Dev Site</label>
                      	<input type="text" value="" name="zip" maxlength="50" id="id_zip" readonly="readonly">
                      </div>
            </fieldset>
	   

<input type="submit" value="Update Information" /> </form> 
        </div>
		
		<div id="footer" style="position:relative; left:10px">
			<p>
				<a href="http://www.dev.edu/home/about-this-site/copyright.html">Copyright</a> &copy; 
				<script type="text/javascript">
					var theDate=new Date()
					document.write(theDate.getFullYear())
				</script>
				<a href="http://www.dev.edu/">Dev University</a> - All Rights Reserved | 1518 Clifton Road. Atlanta, Georgia 30322. USA
			</p>
			<div class="clear-all">
			</div>			
		</div>
        
		<div id="shadowBottom">
		</div>
        
	</div>
    
</body>
</html> 

<style type="text/css">
#wheels-debug-area
{
	clear: both;
	margin: 100px 0;
	text-align: left;
	background: #ececec;
	padding: 10px;
	border-top: 3px solid #999;
	border-bottom: 3px solid #999;
}

#wheels-debug-area td
{
	font: 12px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	line-height: 1.5em;
	color: #333;
}

#wheels-debug-area a
{
	color: #333;
	text-decoration: underline;
	padding: 0 1px;
}

#wheels-debug-area a:hover
{
	color: #fff;
	background: #333;
	text-decoration: none;
}
</style>

<div id="wheels-debug-area">
	<table cellspacing="0" cellpadding="0">
		
			<tr>
				<td valign="top"><strong><span style="color:red;">Warnings:</span></strong></td>
				<td>
					<span style="color:red;">
						The coldroute plugin may be incompatible with this version of Wheels, please look for a compatible version of the plugin<br />The uploadablefiles plugin may be incompatible with this version of Wheels, please look for a compatible version of the plugin<br /> 
					</span>
				</td>
			</tr>
		
		<tr>
			<td valign="top" style="width:125px;"><strong>Application:</strong></td>
			<td>8D519D46320DD2F1B2550BE7520AB15F [<a href="/DevBeta/app/students/978/practicums/10/edit?type=DevInfo&reload=true">Reload</a>, <a href="/DevBeta/rewrite.cfm?controller=wheels&action=wheels&view=tests&type=app&reload=true">Run Tests</a>]</td>
		</tr>
		<tr>
			<td valign="top"><strong>Framework:</strong></td>
			<td>Wheels 1.1.8</td>
		</tr>
		<tr>
			<td valign="top"><strong>CFML Engine:</strong></td>
			<td>Adobe ColdFusion 9,0,2,282541</td>
		</tr>
		<tr>
			<td valign="top"><strong>Default Data Source:</strong></td>
			<td>CareerServices</td>
		</tr>
		<tr>
			<td valign="top"><strong>Active Environment:</strong></td>
			<td>Design [<a href="/DevBeta/app/students/978/practicums/10/edit?type=DevInfo&reload=development">Development</a>, <a href="/DevBeta/app/students/978/practicums/10/edit?type=DevInfo&reload=testing">Testing</a>, <a href="/DevBeta/app/students/978/practicums/10/edit?type=DevInfo&reload=maintenance">Maintenance</a>, <a href="/DevBeta/app/students/978/practicums/10/edit?type=DevInfo&reload=production">Production</a>]</td>
		</tr>
		<tr>
			<td valign="top"><strong>URL Rewriting:</strong></td>
			<td>Partial</td>
		</tr>
		<tr>
			<td valign="top"><strong>URL Obfuscation:</strong></td>
			<td>Off</td>
		</tr>
		<tr>
			<td valign="top"><strong>Plugins:</strong></td>
			<td><a href="/DevBeta/rewrite.cfm?controller=wheels&action=wheels&view=plugins&name=coldroute">coldroute</a><br/><a href="/DevBeta/rewrite.cfm?controller=wheels&action=wheels&view=plugins&name=uploadablefiles">uploadablefiles</a></td>
		</tr>
		
			<tr>
				<td valign="top"><strong>Route:</strong></td>
				<td>editAppStudentDev</td>
			</tr>
		
		<tr>
			<td valign="top"><strong>Controller:</strong></td>
			<td>app.Devs</td>
		</tr>
		<tr>
			<td valign="top"><strong>Action:</strong></td>
			<td>edit</td>
		</tr>
		
			<tr>
				<td valign="top"><strong>Key(s):</strong></td>
				<td>10</td>
			</tr>
		
		<tr>
			<td valign="top"><strong>Additional Params:</strong></td>
			<td>
			studentkey = 978<br />
					type = DevInfo<br />
					
			</td>
		</tr>
		<tr>
			<td valign="top"><strong>Caching Stats:</strong></td>
			<td>hits: 0, culls: 0, misses: 4 </td>
		</tr>
		<tr>
			<td valign="top"><strong>Execution Time:</strong></td>
			<td>672ms (action ~385ms, view ~296ms, requeststart ~149ms, beforefilters ~126ms, setup ~2ms)</td>
		</tr>
	</table>
</div>

Open in new window

0
Julian HansenCommented:
Without seeing this code in action it is going to be very difficult and time consuming to debug.

One thing I did notice though is this

                                   fields: {
                                        BranchID: {
                                            type: 'hidden',
                                            defaultValue: branchData.record.BranchID
                                        },
                                       
==> Missing a closing }
0
RNithikAuthor Commented:
there is NO missing closing bracket .. i maintained that bracket after title: 'Branch name',..

can we write  function on "imgdetalhe" ?

is there any alternative way to display level 2 child info..

thanks
nithik
0
RobOwner (Aidellio)Commented:
Hi nithik,

Just for my understanding are you trying to open a 3rd table (2nd sub table)?

like this:?
Parent table
-----> CHILD table
--------------> CHILD table <======= you're wanting to have yet another table of info here?
0
RNithikAuthor Commented:
Yes. you are right..

I have

branch id, orgid,  if they click on branch id, i twill show list of branches as first child table like

|
V

addressid, branch name  (if you click on addressid, it will show list of addresses as second child table (which is not opening now..)

|
V

address1, zip, country
address2, zip, country
etc

thanks
nithik
0
RobOwner (Aidellio)Commented:
Are you getting any errors in the console (developer tools - press F12)?
0
RNithikAuthor Commented:
i am getting following error..

prabably i need your eyes to see where i put wrong braces ({}) .. :)

ReferenceError: organizationAddressData is not defined
      
defaultValue: organizationAddressData.record.AddressID

Thanks
Rnithik
0
RobOwner (Aidellio)Commented:
It could be a scope issue:

This is your code as you have it.  the organizationAddressData is passed to the display function. You then set an event on click for the img and from within that try to access the organizationAddressData object but the reference may not be valid anymore.

 display: function (organizationAddressData) {
                        //Create an image that will be used to open child table
                        var $img = $('<img src="/practicumBeta/images/address_icon.png" with="30" height="30" title="Address List" />');
                        //Open child table when user clicks the image
                        $img.click(function () {						
                            $('#OrganizationTableContainer').jtable('openChildTable',
                                    $img.closest('tr'),
                                    {
                                        title: organizationAddressData.record.OrgName + ' - Related Addresses',
                                        messages: {

Open in new window


I would try setting a namespace variable that you can access from within the img:
 display: function (organizationAddressData) {
window.com = { };
window.com.mydomain = {};
window.com.mydomain.addressData = organizationAddressData;
                        //Create an image that will be used to open child table
                        var $img = $('<img src="/practicumBeta/images/address_icon.png" with="30" height="30" title="Address List" />');
                        //Open child table when user clicks the image
                        $img.click(function () {						
                            $('#OrganizationTableContainer').jtable('openChildTable',
 $img.closest('tr'),
                                    {
                                        title: window.com.mydomain.addressData.record.OrgName + ' - Related Addresses',
                                        messages: {

Open in new window

0
RNithikAuthor Commented:
it is showing error at 180th line.. (see my third comment for code,
by: RNithikPosted on 2013-09-05 at 09:08:12ID: 39467612 )


Thanks
Rnithik
0
RobOwner (Aidellio)Commented:
yes i see that.  you can't reference that variable there as it doesn't exist.  If you want to be able to get access to it then you'll need to do what I said in my last post eg namespace variable
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
RNithikAuthor Commented:
helped the suggestion..
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Scripting Languages

From novice to tech pro — start learning today.