make tabs fully parameterised
This commit is contained in:
		
							
								
								
									
										67
									
								
								Netdisco/views/inc/js/search.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										67
									
								
								Netdisco/views/inc/js/search.js
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,67 @@ | ||||
|   $(document).ready(function() { | ||||
|     // parameterised for the active tab - submits search form and injects | ||||
|     // HTML response into the tab pane, or an error/empty-results message | ||||
|     function do_search (event, tab) { | ||||
|       var form = '#' + tab + '_form'; | ||||
|       var target = '#' + tab + '_pane'; | ||||
|  | ||||
|       // stop form from submitting normally | ||||
|       event.preventDefault(); | ||||
|  | ||||
|       // get the form params | ||||
|       var query = $(form).serialize(); | ||||
|  | ||||
|       // in case of slow data load, let the user know | ||||
|       $(target).html( | ||||
|         '<div class="span3 alert-message notice"><p>Waiting for results...</p></div>' | ||||
|       ); | ||||
|  | ||||
|       // submit the query and put results into the tab pane | ||||
|       $(target).load( '/ajax/content/search/' + tab + '?' + query, | ||||
|         function(response, status, xhr) { | ||||
|           if (status !== "success") { | ||||
|             $(target).html( | ||||
|               '<div class="span6 alert-message error">' + | ||||
|               '<p>Search failed! Please contact your site administrator.</p></div>' | ||||
|             ); | ||||
|             return; | ||||
|           } | ||||
|           if (response === "") { | ||||
|             $(target).html( | ||||
|               '<div class="span3 alert-message info"><p>No matching records.</p></div>' | ||||
|             ); | ||||
|             return; | ||||
|           } | ||||
|         } | ||||
|       ); | ||||
|     } | ||||
|  | ||||
|     // search hook for each tab | ||||
|     [% FOREACH tab IN vars.tabs %] | ||||
|     $('[% "#${tab.id}_form" %]').submit(function(event){ do_search(event, '[% tab.id %]'); }); | ||||
|     [% END %] | ||||
|  | ||||
|     // on page load, load the content for the active tab | ||||
|     [% IF params.tab %] | ||||
|     $('#[% params.tab %]_form').trigger("submit"); | ||||
|     [% END %] | ||||
|  | ||||
|     // on tab change, hide previous tab's search form and show new tab's | ||||
|     // search form. also trigger to load the content for the newly active tab. | ||||
|     $('#search_results').bind('change', function(e) { | ||||
|       var to = $(e.target).attr('href').replace(/^#/,"").replace(/_pane$/,""); | ||||
|       var from = $(e.relatedTarget).attr('href').replace(/^#/,"").replace(/_pane$/,""); | ||||
|  | ||||
|       $('#' + from + '_search').toggleClass('active'); | ||||
|       $('#' + to + '_search').toggleClass('active'); | ||||
|  | ||||
|       $('#' + to + '_form').trigger("submit"); | ||||
|     }); | ||||
|  | ||||
|     // fix green background on search checkboxes | ||||
|     // https://github.com/twitter/bootstrap/issues/742 | ||||
|     syncCheckBox = function() { | ||||
|       $(this).parents('.add-on').toggleClass('active', $(this).is(':checked')); | ||||
|     }; | ||||
|     $('.add-on :checkbox').each(syncCheckBox).click(syncCheckBox); | ||||
|   }); | ||||
							
								
								
									
										12
									
								
								Netdisco/views/inc/search/device.tt
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										12
									
								
								Netdisco/views/inc/search/device.tt
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,12 @@ | ||||
|         <div id="device_search" class="tab-pane [% 'active' IF params.tab == 'device' %]"> | ||||
|           <form id="device_form" class="nd_sidesearchform form-stacked" method="get" action="/search"> | ||||
|             <div class="clearfix"> | ||||
|               <input class="span3" name="q" value="[% params.q %]" type="text"/> | ||||
|             </div> | ||||
|             <p><em>Device Search Options</em></p> | ||||
|             <input name="tab" value="device" type="hidden"/> | ||||
|             <div class="clearfix"> | ||||
|               <button id="device_submit" type="submit" class="btn info">Search Again</button> | ||||
|             </div> | ||||
|           </form> | ||||
|         </div> <!-- /tab-pane --> | ||||
							
								
								
									
										36
									
								
								Netdisco/views/inc/search/node.tt
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										36
									
								
								Netdisco/views/inc/search/node.tt
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,36 @@ | ||||
|         <div id="node_search" class="tab-pane [% 'active' IF params.tab == 'node' %]"> | ||||
|           <form id="node_form" class="nd_sidesearchform form-stacked" method="get" action="/search"> | ||||
|             <div class="clearfix"> | ||||
|               <input class="span3" name="q" value="[% params.q %]" type="text"/> | ||||
|             </div> | ||||
|             <p><em>Node Search Options</em></p> | ||||
|             <input name="tab" value="node" type="hidden"/> | ||||
|             <div class="clearfix input-prepend"> | ||||
|               <label class="add-on"> | ||||
|                 <input type="checkbox" id="stamps" name="stamps"[% ' checked="checked"' IF params.stamps %]/> | ||||
|               </label> | ||||
|               <label for="stamps"> | ||||
|                 <span class="nd_searchcheckbox uneditable-input">Time Stamps</span> | ||||
|               </label> | ||||
|             </div> | ||||
|             <div class="clearfix input-prepend"> | ||||
|               <label class="add-on"> | ||||
|                 <input type="checkbox" id="vendor" name="vendor"[% ' checked="checked"' IF params.vendor %]/> | ||||
|               </label> | ||||
|               <label for="vendor"> | ||||
|                 <span class="nd_searchcheckbox uneditable-input">Vendor</span> | ||||
|               </label> | ||||
|             </div> | ||||
|             <div class="clearfix input-prepend"> | ||||
|               <label class="add-on"> | ||||
|                 <input type="checkbox" id="archived" name="archived"[% ' checked="checked"' IF params.archived %]/> | ||||
|               </label> | ||||
|               <label for="archived"> | ||||
|                 <span class="nd_searchcheckbox uneditable-input">Archived Data</span> | ||||
|               </label> | ||||
|             </div> | ||||
|             <div class="clearfix"> | ||||
|               <button id="node_submit" type="submit" class="btn info">Search Again</button> | ||||
|             </div> | ||||
|           </form> | ||||
|         </div> <!-- /tab-pane --> | ||||
							
								
								
									
										11
									
								
								Netdisco/views/inc/search/port.tt
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										11
									
								
								Netdisco/views/inc/search/port.tt
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,11 @@ | ||||
|         <div id="port_search" class="tab-pane [% 'active' IF params.tab == 'port' %]"> | ||||
|           <form id="port_form" class="nd_sidesearchform form-stacked" method="get" action="/search"> | ||||
|             <div class="clearfix"> | ||||
|               <input class="span3" name="q" value="[% params.q %]" type="text"/> | ||||
|             </div> | ||||
|             <input name="tab" value="vlan" type="hidden"/> | ||||
|             <div class="clearfix"> | ||||
|               <button id="port_submit" type="submit" class="btn info">Search Again</button> | ||||
|             </div> | ||||
|           </form> | ||||
|         </div> <!-- /tab-pane --> | ||||
							
								
								
									
										11
									
								
								Netdisco/views/inc/search/vlan.tt
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										11
									
								
								Netdisco/views/inc/search/vlan.tt
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,11 @@ | ||||
|         <div id="vlan_search" class="tab-pane [% 'active' IF params.tab == 'vlan' %]"> | ||||
|           <form id="vlan_form" class="nd_sidesearchform form-stacked" method="get" action="/search"> | ||||
|             <div class="clearfix"> | ||||
|               <input class="span3" name="q" value="[% params.q %]" type="text"/> | ||||
|             </div> | ||||
|             <input name="tab" value="vlan" type="hidden"/> | ||||
|             <div class="clearfix"> | ||||
|               <button id="vlan_submit" type="submit" class="btn info">Search Again</button> | ||||
|             </div> | ||||
|           </form> | ||||
|         </div> <!-- /tab-pane --> | ||||
		Reference in New Issue
	
	Block a user