Quantcast
Channel: Recent Discussions — DataTables forums
Viewing all articles
Browse latest Browse all 82121

Pagination input plug-in enhancement

$
0
0
Hello

First of all, thanks for this very useful piece of software. I wanted input pagination and I saw you had it. So I took it and saw few enhancement to make, which I did.

Here is the code now:

$.fn.dataTableExt.oPagination.input = {

	"fnInit" : function(oSettings, nPaging, fnCallbackDraw) {

		/* build button controls */
		var nFirst = document.createElement('button');
		var nPrevious = document.createElement('button');
		var nNext = document.createElement('button');
		var nLast = document.createElement('button');

		nFirst.type = "button";
		nPrevious.type = "button";
		nNext.type = "button";
		nLast.type = "button";

		nFirst.className = oSettings.oClasses.sPageFirst + " "
				+ oSettings.oClasses.sPageButtonStaticDisabled;
		nPrevious.className = oSettings.oClasses.sPagePrevious + " "
				+ oSettings.oClasses.sPageButtonStaticDisabled;
		nNext.className = oSettings.oClasses.sPageNext + " "
				+ oSettings.oClasses.sPageButtonStaticDisabled;
		nLast.className = oSettings.oClasses.sPageLast + " "
				+ oSettings.oClasses.sPageButtonStaticDisabled;

		nFirst.setAttribute("disabled", "disabled");
		nPrevious.setAttribute("disabled", "disabled");
		nNext.setAttribute("disabled", "disabled");
		nLast.setAttribute("disabled", "disabled");

		nFirst.innerHTML = oSettings.oLanguage.oPaginate.sFirst;
		nPrevious.innerHTML = oSettings.oLanguage.oPaginate.sPrevious;
		nNext.innerHTML = oSettings.oLanguage.oPaginate.sNext;
		nLast.innerHTML = oSettings.oLanguage.oPaginate.sLast;

		if (oSettings.sTableId !== ''
				&& typeof oSettings.aanFeatures.p == "undefined") {
			nFirst.setAttribute('id', oSettings.sTableId + '_first');
			nPrevious.setAttribute('id', oSettings.sTableId + '_previous');
			nNext.setAttribute('id', oSettings.sTableId + '_next');
			nLast.setAttribute('id', oSettings.sTableId + '_last');
			nPaging.setAttribute('id', oSettings.sTableId + '_paginate');
		}

		$(nFirst).click(function() {
			if (oSettings.oApi._fnPageChange(oSettings, "first")) {
				fnCallbackDraw(oSettings);
			}
		});

		$(nPrevious).click(function() {
			if (oSettings.oApi._fnPageChange(oSettings, "previous")) {
				fnCallbackDraw(oSettings);
			}
		});

		$(nNext).click(function() {
			if (oSettings.oApi._fnPageChange(oSettings, "next")) {
				fnCallbackDraw(oSettings);
			}
		});

		$(nLast).click(function() {
			if (oSettings.oApi._fnPageChange(oSettings, "last")) {
				fnCallbackDraw(oSettings);
			}
		});

		/* build other controls */
		var nInput = document.createElement('input');
		var nPage = document.createElement('span');
		var nOf = document.createElement('span');

		nInput.type = "number";

		nInput.className = "paginate_textInput";
		nPage.className = "paginate_page";
		nOf.className = "paginate_of";

		nPage.innerHTML = oSettings.oLanguage.oPaginate.sPage;

		$(nInput).change(
				function(e) {

					/*
					 * iFirstPageNumber: computing convention is to start
					 * counting at 0, non-computing convention at 1
					 */
					var iFirstPageNumber = 1;

					/*
					 * input must be an integer starting from iFirstPageNumber,
					 * default to iFirstPageNumber if invalid
					 */
					var iCurrentPageNumber = +this.value;
					if (isNaN(iCurrentPageNumber)
							|| iFirstPageNumber > iCurrentPageNumber) {
						iCurrentPageNumber = iFirstPageNumber;
					}
					var iCurrentPageIndex = iCurrentPageNumber
							- iFirstPageNumber;

					var iItemStartIndex = iCurrentPageIndex
							* oSettings._iDisplayLength;

					/*
					 * if iItemStartIndex exceed max limit, default to the item
					 * start index of the last page
					 */
					if (iItemStartIndex >= oSettings.fnRecordsDisplay()) {

						var iNumberOfPages = Math.ceil(oSettings
								.fnRecordsDisplay()
								/ oSettings._iDisplayLength);

						if (0 < iNumberOfPages) {
							iItemStartIndex = (iNumberOfPages - 1)
									* oSettings._iDisplayLength;
						} else {
							iItemStartIndex = 0;
						}
					}

					oSettings._iDisplayStart = iItemStartIndex;
					fnCallbackDraw(oSettings);
				});

		/* add controls */
		nPaging.appendChild(nFirst);
		nPaging.appendChild(nPrevious);
		nPaging.appendChild(nPage);
		nPaging.appendChild(nInput);
		nPaging.appendChild(nOf);
		nPaging.appendChild(nNext);
		nPaging.appendChild(nLast);
	},

	"fnUpdate" : function(oSettings, fnCallbackDraw) {

		if (!oSettings.aanFeatures.p) {
			return;
		}

		var iNumberOfPages = Math.ceil(oSettings.fnRecordsDisplay()
				/ oSettings._iDisplayLength);
		/*
		 * iFirstPageNumber: computing convention is to start counting at 0,
		 * non-computing convention at 1
		 */
		var iFirstPageNumber = 1;
		var iLastPageNumber = iFirstPageNumber;
		if (0 < iNumberOfPages) {
			iLastPageNumber = iFirstPageNumber + iNumberOfPages - 1;
		}

		var iCurrentPageIndex = Math.ceil(oSettings._iDisplayStart
				/ oSettings._iDisplayLength);
		var iCurrentPageNumber = iCurrentPageIndex + iFirstPageNumber;

		var oClasses = oSettings.oClasses;

		/* Loop over each instance of the pager */
		var an = oSettings.aanFeatures.p;
		for ( var i = 0, iLen = an.length; i < iLen; i++) {

			/* pages details */
			var inputs = an[i].getElementsByTagName('input');
			var nInput = inputs[0];
			nInput.value = iCurrentPageNumber;

			var spans = an[i].getElementsByTagName('span');
			var nOf = spans[1];
			nOf.innerHTML = oSettings.oLanguage.oPaginate.sPageOf
					+ iNumberOfPages

			/* button styles */
			var buttons = an[i].getElementsByTagName('button');
			var nFirst = buttons[0];
			var nPrevious = buttons[1];
			var nNext = buttons[2];
			var nLast = buttons[3];

			$(buttons).removeClass(
					oClasses.sPageButton + " " + oClasses.sPageButtonActive
							+ " " + oClasses.sPageButtonStaticDisabled);

			if (iFirstPageNumber == iCurrentPageNumber) {
				nFirst.className += " " + oClasses.sPageButtonStaticDisabled;
				nFirst.setAttribute("disabled", "disabled");
				nPrevious.className += " " + oClasses.sPageButtonStaticDisabled;
				nPrevious.setAttribute("disabled", "disabled");
			} else {
				nFirst.className += " " + oClasses.sPageButton;
				nFirst.disabled = false;
				nPrevious.className += " " + oClasses.sPageButton;
				nPrevious.disabled = false;
			}

			if (iLastPageNumber == iCurrentPageNumber) {
				nNext.className += " " + oClasses.sPageButtonStaticDisabled;
				nNext.setAttribute("disabled", "disabled");
				nLast.className += " " + oClasses.sPageButtonStaticDisabled;
				nLast.setAttribute("disabled", "disabled");
			} else {
				nNext.className += " " + oClasses.sPageButton;
				nNext.disabled = false;
				nLast.className += " " + oClasses.sPageButton;
				nLast.disabled = false;
			}
		}
	}
}

However, I still have few question about a part that I did not changed. It is the two tests in the if conditions on lines 35 and 36:
		if (oSettings.sTableId !== ''
				&& typeof oSettings.aanFeatures.p == "undefined") {

Question 1: Why « oSettings.sTableId !== '' » and not « oSettings.sTableId != '' » ?
Question 2: Why the second test « typeof oSettings.aanFeatures.p == "undefined" » ? What does it means?

Viewing all articles
Browse latest Browse all 82121

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>