JQuery Initialization on Listings Pages: Difference between revisions

From Littledamien Wiki
Jump to navigation Jump to search
Line 22: Line 22:
==Keyword bindListingsHandlers()==
==Keyword bindListingsHandlers()==


*<code>LITTLED.Keyword.bindListingsHandlers(parent_selector)</code>
*<code>$('#listings-container').keywords('bindListingsHandlers')</code>
*<code>parent_selector</code> targets the element containing the listings
*<code><code>#listings-container</code></code> targets the element containing the listings. It's the most common element to use in this case, but any appropriate selector may be used.
*Loading inline editor: <code>.edit-kw-btn</code> click
*Loading inline editor: <code>.edit-kw-btn</code> click
*Submitting and canceling inline edits: <code>.kw-commit-btn</code> and <code>.kw-cancel-btn</code> click
*Submitting and canceling inline edits: <code>.kw-commit-btn</code> and <code>.kw-cancel-btn</code> click
*Button icons: <code>.ui-icon-edit</code>
*Button icons: <code>.ui-icon-edit</code>
*<code>bindListingsHandlers()</code> in turn calles <code>bindListingsButtons()</code>. The two routines are separated so <code>bindListingsHandlers()</code> doesn't need to be called multiple times to avoid attaching duplicate handlers to listings elements.
*<code>$.keywords('bindListingsHandlers')</code> in turn calles <code>$.keywords('bindListingsButtons')</code>. The two routines are separated so <code>$.keywords('bindListingsHandlers')</code> doesn't need to be called multiple times to avoid attaching duplicate handlers to listings elements.
*Button element handlers should persist after listings content is refreshed.
*Button element handlers should persist after listings content is refreshed.
*The routine doesn't handle refreshing the button elements when the listings content is refreshed.  
*The routine doesn't handle refreshing the button elements when the listings content is refreshed.


==Keyword filter autocomplete==
==Keyword filter autocomplete==

Revision as of 17:46, 24 March 2012

Listings bindListingsHandlers()

  • $('#listings-container').listings('bindListingsHandlers')
  • $('#listings-container') targets the element containing the listings. #listings-container is the most common element for this, but any appropriate selector can be specified.
  • Inline edits: .inline-edit-cell double-click
  • Pagination & paging button handlers (.page-btn)
  • Update cache: .update-cache-btn click
  • Delete records: .trash-btn click
  • Makes button icons for the following elements: .details-btn, .preview-btn, .edit-btn, .print-btn, .update-cache-btn, .trash-btn.
  • Button element handlers should persist after listings content is refreshed.
  • $.listings('bindListingsHandlers') in turn calles $.listings('bindListingsButtons'). The two routines are separated so $.listings('bindListingsHandlers') doesn't need to be called multiple times to avoid attaching duplicate handlers to listings elements.
  • This routine does not refresh the handlers or buttons after the listings are refreshed. This can be achieved with
$(document).ready(function() {
	$('#listings-container').listings('bindListingsHandlers');
	LITTLED.init({setSortables: function() {
			$('#listings-container').listings('bindListingsButtons');
		}
	});
});

Keyword bindListingsHandlers()

  • $('#listings-container').keywords('bindListingsHandlers')
  • #listings-container targets the element containing the listings. It's the most common element to use in this case, but any appropriate selector may be used.
  • Loading inline editor: .edit-kw-btn click
  • Submitting and canceling inline edits: .kw-commit-btn and .kw-cancel-btn click
  • Button icons: .ui-icon-edit
  • $.keywords('bindListingsHandlers') in turn calles $.keywords('bindListingsButtons'). The two routines are separated so $.keywords('bindListingsHandlers') doesn't need to be called multiple times to avoid attaching duplicate handlers to listings elements.
  • Button element handlers should persist after listings content is refreshed.
  • The routine doesn't handle refreshing the button elements when the listings content is refreshed.

Keyword filter autocomplete

  • $(selector).galleries('keywordAutocomplete')

Datepicker

$('.datepicker').datepicker();

See Also