diff --git a/init.php b/init.php
index a678c75..429a94f 100644
--- a/init.php
+++ b/init.php
@@ -179,7 +179,7 @@ public function render( $field, $escaped_value, $object_id, $object_type, $field
// Open our attached posts list
echo '
';
- echo '
' . sprintf( __( 'Attached %s', 'cmb' ), $post_type_labels ) . '
';
+ echo '' . sprintf( __( 'Attached %s', 'cmb' ), $post_type_labels ) . '( remaining)
';
if ( $filter_boxes ) {
printf( $filter_boxes, 'attached-search' );
diff --git a/js/attached-posts.js b/js/attached-posts.js
index 02e4b16..8fd0c21 100755
--- a/js/attached-posts.js
+++ b/js/attached-posts.js
@@ -14,6 +14,46 @@ window.CMBAP = window.CMBAP || {};
app.doType = $wrap.find( '.object-label' ).length;
};
+ // Helper function to determine whteher we have exceeded our limit or not.
+ app._hasExceeded = function ($wrap) {
+ var $input = app.getPostIdsInput($wrap);
+ var maxItems = $input.data('max-items');
+ var currentNumberItems = app.getPostIdsVal($input).length;
+
+ return (typeof maxItems !== "undefined") && currentNumberItems >= maxItems;
+ };
+
+ // Make sure we cannot attach more posts than we would like.
+ app.updateReadOnly = function ($wrap) {
+
+ // If we have exceeded our limit, then ensure the user cannot attach more items.
+ // If we haven't, make sure the user can attach items.
+ if (app._hasExceeded($wrap)) {
+ // Also ensure items aren't draggable
+ // @see https://stackoverflow.com/questions/1324044/how-do-i-disable-a-jquery-ui-draggable
+ // app.$retrievedPosts().draggable('disable');
+ $wrap.find('.attached').droppable("option", "accept", ".doesnotexist");
+ } else {
+ // app.$retrievedPosts().draggable('enable');
+ $wrap.find('.attached').droppable("option", "accept", ".retrieved li");
+ }
+ };
+
+ app.updateRemaining = function ($wrap) {
+ var $input = app.getPostIdsInput($wrap);
+ var currentNumberItems = app.getPostIdsVal($input).length;
+ var maxItems = $input.data('max-items');
+ var $remainingLabel = $wrap.find('.attached-posts-remaining');
+ var $remainingNumberLabel = $remainingLabel.find('.attached-posts-remaining-number');
+ var remainingNumber = 0;
+ if (typeof maxItems !== "undefined") {
+ // How many can we add?
+ remainingNumber = maxItems - currentNumberItems;
+ // Show the label and update the number inside
+ $remainingLabel.removeClass("hidden");
+ $remainingNumberLabel.html(remainingNumber);
+ }
+ };
app.init = function() {
app.cache();
@@ -23,6 +63,14 @@ window.CMBAP = window.CMBAP || {};
// Allow the right list to be droppable and sortable
app.makeDroppable();
+
+ $(".attached-posts-wrap").each(function () {
+ // Update whether or not the lists should be editable by the user. This is usually when a user has attached too many items.
+ app.updateReadOnly($(this));
+
+ app.updateRemaining($(this))
+ });
+
$( '.cmb2-wrap > .cmb2-metabox' )
// Add posts when the plus icon is clicked
.on( 'click', '.attached-posts-wrap .retrieved .add-remove', app._moveRowToAttached )
@@ -75,6 +123,8 @@ window.CMBAP = window.CMBAP || {};
item.clone().appendTo( $wrap.find( '.attached' ) );
app.resetAttachedListItems( $wrap );
+ app.updateRemaining($wrap);
+
};
// Add the items when the plus icon is clicked
@@ -87,6 +137,10 @@ window.CMBAP = window.CMBAP || {};
var itemID = $li.data( 'id' );
var $wrap = $li.parents( '.attached-posts-wrap' );
+ if (app._hasExceeded($wrap)) {
+ return;
+ }
+
if ( $li.hasClass( 'added' ) ) {
return;
}
@@ -103,6 +157,8 @@ window.CMBAP = window.CMBAP || {};
$wrap.find( '.attached' ).append( $li.clone() );
app.resetAttachedListItems( $wrap );
+ app.updateReadOnly($wrap);
+ app.updateRemaining($wrap);
};
// Remove items from our attached list when the minus icon is clicked
@@ -123,6 +179,8 @@ window.CMBAP = window.CMBAP || {};
$wrap.find('.retrieved li[data-id="' + itemID +'"]').removeClass('added');
app.resetAttachedListItems( $wrap );
+ app.updateReadOnly($wrap);
+ app.updateRemaining($wrap);
};
app.inputHasId = function( $wrap, itemID ) {