v1.0.1
Group fields support Widget area support Use of devbridgeAutocomplete() instead of autocomplete() to avoid errors
This commit is contained in:
Ruben Garcia
parent
95f31838d8
commit
527ddc5195
|
|
@ -4,7 +4,7 @@ Plugin Name: CMB2 Field Type: Ajax Search
|
|||
Plugin URI: https://github.com/rubengc/cmb2-field-ajax-search
|
||||
GitHub Plugin URI: https://github.com/rubengc/cmb2-field-ajax-search
|
||||
Description: CMB2 field type to attach posts, users or terms.
|
||||
Version: 1.0.0
|
||||
Version: 1.0.1
|
||||
Author: Ruben Garcia
|
||||
Author URI: http://rubengc.com/
|
||||
License: GPLv2+
|
||||
|
|
@ -23,7 +23,7 @@ if( ! class_exists( 'CMB2_Field_Ajax_Search' ) ) {
|
|||
/**
|
||||
* Current version number
|
||||
*/
|
||||
const VERSION = '1.0.0';
|
||||
const VERSION = '1.0.1';
|
||||
|
||||
/**
|
||||
* Initialize the plugin by hooking into CMB2
|
||||
|
|
@ -179,8 +179,8 @@ if( ! class_exists( 'CMB2_Field_Ajax_Search' ) ) {
|
|||
*/
|
||||
public function setup_admin_scripts() {
|
||||
|
||||
wp_register_script( 'jquery-autocomplete', plugins_url( 'js/jquery.autocomplete.min.js', __FILE__ ), array( 'jquery' ), self::VERSION, true );
|
||||
wp_register_script( 'cmb-ajax-search', plugins_url( 'js/ajax-search.js', __FILE__ ), array( 'jquery', 'jquery-autocomplete', 'jquery-ui-sortable' ), self::VERSION, true );
|
||||
wp_register_script( 'jquery-autocomplete-ajax-search', plugins_url( 'js/jquery.autocomplete.min.js', __FILE__ ), array( 'jquery' ), self::VERSION, true );
|
||||
wp_register_script( 'cmb-ajax-search', plugins_url( 'js/ajax-search.js', __FILE__ ), array( 'jquery', 'jquery-autocomplete-ajax-search', 'jquery-ui-sortable' ), self::VERSION, true );
|
||||
|
||||
wp_localize_script( 'cmb-ajax-search', 'cmb_ajax_search', array(
|
||||
'ajaxurl' => admin_url( 'admin-ajax.php' ),
|
||||
|
|
|
|||
|
|
@ -6,8 +6,8 @@
|
|||
.autocomplete-group { padding: 2px 5px; }
|
||||
.autocomplete-group strong { display: block; border-bottom: 1px solid #000; }
|
||||
|
||||
input.cmb-ajax-search { width: 30em; }
|
||||
.cmb-ajax-search-results { width: 30em; padding: 0 1px; box-sizing: border-box; margin-bottom: 5px; }
|
||||
input.cmb-ajax-search { width: 25em; }
|
||||
.cmb-ajax-search-results { width: 25em; padding: 0 1px; box-sizing: border-box; margin-bottom: 5px; }
|
||||
.cmb-ajax-search-results li { margin: 0; border-bottom: 1px solid #f4f4f4; padding: 7px 5px; background: #fff; }
|
||||
.cmb-ajax-search-results li:last-child { border-bottom: none; }
|
||||
.cmb-ajax-search-results li span.hndl { font-size: 13px; line-height: 16px; color: #ccc; margin: 0 8px 0 0; height: 16px; cursor: s-resize; }
|
||||
|
|
@ -27,3 +27,6 @@ input.cmb-ajax-search { width: 30em; }
|
|||
|
||||
#side-sortables .cmb2-wrap input + input.cmb-ajax-search { margin-top: 1px; } /* Fix extra margin from CMB2 */
|
||||
|
||||
/* Repeatable groups */
|
||||
.cmb-repeatable-group .cmb-type-post-ajax-search .cmb-td, .cmb-repeatable-group .cmb-type-user-ajax-search .cmb-td, .cmb-repeatable-group .cmb-type-term-ajax-search .cmb-td { position: relative; }
|
||||
.cmb-repeatable-group .cmb-ajax-search-spinner { position: absolute; top: 50%; right: 10px; margin: -7px 0 0 0; }
|
||||
|
|
|
|||
|
|
@ -1,99 +1,119 @@
|
|||
(function( $ ) {
|
||||
$('.cmb-ajax-search').each(function () {
|
||||
var input_id = $(this).attr('id'); // Field id with '_input' sufix (the searchable field)
|
||||
var field_id = $(this).attr('id').replace( new RegExp('_input$'), '' ); // Field id, the true one field
|
||||
var object_type = $(this).attr('data-object-type');
|
||||
var query_args = $(this).attr('data-query-args');
|
||||
(function( document, $ ) {
|
||||
function init_ajax_search() {
|
||||
$('.cmb-ajax-search:not([data-ajax-search="true"])').each(function () {
|
||||
$(this).attr('data-ajax-search', true);
|
||||
|
||||
$(this).autocomplete({
|
||||
serviceUrl: cmb_ajax_search.ajaxurl,
|
||||
type: 'POST',
|
||||
triggerSelectOnValidInput: false,
|
||||
showNoSuggestionNotice: true,
|
||||
params: {
|
||||
action : 'cmb_ajax_search_get_results',
|
||||
nonce : cmb_ajax_search.nonce, // nonce
|
||||
field_id : field_id, // Field id for hook purposes
|
||||
object_type : object_type, // post, user or term
|
||||
query_args : query_args, // Query args passed to field
|
||||
},
|
||||
transformResult: function( results ) {
|
||||
var suggestions = $.parseJSON( results );
|
||||
var input_id = $(this).attr('id'); // Field id with '_input' sufix (the searchable field)
|
||||
var field_id = $(this).attr('id').replace( new RegExp('_input$'), '' ); // Field id, the true one field
|
||||
var object_type = $(this).attr('data-object-type');
|
||||
var query_args = $(this).attr('data-query-args');
|
||||
|
||||
if( $('#' + field_id + '_results li').length ) {
|
||||
var selected_vals = [];
|
||||
var d = 0;
|
||||
$(this).devbridgeAutocomplete({
|
||||
serviceUrl: cmb_ajax_search.ajaxurl,
|
||||
type: 'POST',
|
||||
triggerSelectOnValidInput: false,
|
||||
showNoSuggestionNotice: true,
|
||||
params: {
|
||||
action : 'cmb_ajax_search_get_results',
|
||||
nonce : cmb_ajax_search.nonce, // nonce
|
||||
field_id : field_id, // Field id for hook purposes
|
||||
object_type : object_type, // post, user or term
|
||||
query_args : query_args, // Query args passed to field
|
||||
},
|
||||
transformResult: function( results ) {
|
||||
var suggestions = $.parseJSON( results );
|
||||
|
||||
$('#' + field_id + '_results input').each(function( index, element ) {
|
||||
selected_vals.push( $(this).val() );
|
||||
});
|
||||
if( $('#' + field_id + '_results li').length ) {
|
||||
var selected_vals = [];
|
||||
var d = 0;
|
||||
|
||||
// Remove already picked suggestions
|
||||
$(suggestions).each(function( index, suggestion ) {
|
||||
if( $.inArray( ( suggestion.id ).toString(), selected_vals ) > -1 ) {
|
||||
suggestions.splice( index - d, 1 );
|
||||
d++;
|
||||
}
|
||||
});
|
||||
}
|
||||
$('#' + field_id + '_results input').each(function( index, element ) {
|
||||
selected_vals.push( $(this).val() );
|
||||
});
|
||||
|
||||
return { suggestions: suggestions };
|
||||
},
|
||||
onSearchStart: function(){
|
||||
$(this).next('img.cmb-ajax-search-spinner').css( 'display', 'inline-block' );
|
||||
},
|
||||
onSearchComplete: function(){
|
||||
$(this).next('img.cmb-ajax-search-spinner').hide();
|
||||
},
|
||||
onSelect: function ( suggestion ) {
|
||||
$(this).autocomplete('clearCache');
|
||||
|
||||
var field_name = $(this).attr('id').replace( new RegExp('_input$'), '' );
|
||||
var multiple = $(this).attr('data-multiple');
|
||||
var limit = parseInt( $(this).attr('data-limit') );
|
||||
var sortable = $(this).attr('data-sortable');
|
||||
|
||||
if( multiple == 1 ) {
|
||||
// Multiple
|
||||
$('#' + field_name + '_results' ).append( '<li>' +
|
||||
( ( sortable == 1 ) ? '<span class="hndl"></span>' : '' ) +
|
||||
'<input type="hidden" name="' + field_name + '[]" value="' + suggestion.id + '">' +
|
||||
'<a href="' + suggestion.link + '" target="_blank" class="edit-link">' + suggestion.value + '</a>' +
|
||||
'<a class="remover"><span class="dashicons dashicons-no"></span><span class="dashicons dashicons-dismiss"></span></a>' +
|
||||
'</li>' );
|
||||
|
||||
$(this).val( '' );
|
||||
|
||||
// Checks if there is the max allowed results, limit < 0 means unlimited
|
||||
if( limit > 0 && limit == $('#' + field_name + '_results li').length ) {
|
||||
$(this).prop( 'disabled', 'disabled' );
|
||||
} else {
|
||||
$(this).focus();
|
||||
// Remove already picked suggestions
|
||||
$(suggestions).each(function( index, suggestion ) {
|
||||
if( $.inArray( ( suggestion.id ).toString(), selected_vals ) > -1 ) {
|
||||
suggestions.splice( index - d, 1 );
|
||||
d++;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return { suggestions: suggestions };
|
||||
},
|
||||
onSearchStart: function(){
|
||||
$(this).next('img.cmb-ajax-search-spinner').css( 'display', 'inline-block' );
|
||||
},
|
||||
onSearchComplete: function(){
|
||||
$(this).next('img.cmb-ajax-search-spinner').hide();
|
||||
},
|
||||
onSelect: function ( suggestion ) {
|
||||
$(this).devbridgeAutocomplete('clearCache');
|
||||
|
||||
var field_name = $(this).attr('id').replace( new RegExp('_input$'), '' );
|
||||
var multiple = $(this).attr('data-multiple');
|
||||
var limit = parseInt( $(this).attr('data-limit') );
|
||||
var sortable = $(this).attr('data-sortable');
|
||||
|
||||
if( multiple == 1 ) {
|
||||
// Multiple
|
||||
$('#' + field_name + '_results' ).append( '<li>' +
|
||||
( ( sortable == 1 ) ? '<span class="hndl"></span>' : '' ) +
|
||||
'<input type="hidden" name="' + field_name + '[]" value="' + suggestion.id + '">' +
|
||||
'<a href="' + suggestion.link + '" target="_blank" class="edit-link">' + suggestion.value + '</a>' +
|
||||
'<a class="remover"><span class="dashicons dashicons-no"></span><span class="dashicons dashicons-dismiss"></span></a>' +
|
||||
'</li>' );
|
||||
|
||||
$(this).val( '' );
|
||||
|
||||
// Checks if there is the max allowed results, limit < 0 means unlimited
|
||||
if( limit > 0 && limit == $('#' + field_name + '_results li').length ) {
|
||||
$(this).prop( 'disabled', 'disabled' );
|
||||
} else {
|
||||
$(this).focus();
|
||||
}
|
||||
} else {
|
||||
// Singular
|
||||
$('input[name=' + field_name + ']').val( suggestion.id ).change();
|
||||
}
|
||||
} else {
|
||||
// Singular
|
||||
$('input[name=' + field_name + ']').val( suggestion.id ).change();
|
||||
}
|
||||
});
|
||||
|
||||
if( $(this).attr('data-sortable') == 1 ){
|
||||
$('#' + field_id + '_results').sortable({
|
||||
handle : '.hndl',
|
||||
placeholder : 'ui-state-highlight',
|
||||
forcePlaceholderSize : true
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if( $(this).attr('data-sortable') == 1 ){
|
||||
$('#' + field_id + '_results').sortable({
|
||||
handle : '.hndl',
|
||||
placeholder : 'ui-state-highlight',
|
||||
forcePlaceholderSize : true
|
||||
});
|
||||
}
|
||||
// Initialize ajax search
|
||||
init_ajax_search();
|
||||
|
||||
// Initialize on group fields add row
|
||||
$( document ).on( 'cmb2_add_row', function( evt, $row ) {
|
||||
$row.find('.cmb-ajax-search').attr('data-ajax-search', false);
|
||||
|
||||
init_ajax_search();
|
||||
});
|
||||
|
||||
$('.cmb-ajax-search-results').on( 'click', 'a.remover', function() {
|
||||
// Initialize on widgets area
|
||||
$(document).on('widget-updated widget-added', function() {
|
||||
init_ajax_search();
|
||||
});
|
||||
|
||||
// On click remover listener
|
||||
$('body').on( 'click', '.cmb-ajax-search-results a.remover', function() {
|
||||
$(this).parent('li').fadeOut( 400, function(){
|
||||
var field_id = $(this).parents('ul').attr('id').replace('_results', '');
|
||||
|
||||
$('#' + field_id).removeProp( 'disabled' );
|
||||
$('#' + field_id).autocomplete('clearCache');
|
||||
$('#' + field_id).devbridgeAutocomplete('clearCache');
|
||||
|
||||
$(this).remove();
|
||||
});
|
||||
});
|
||||
})(jQuery);
|
||||
})(document, jQuery);
|
||||
Loading…
Reference in New Issue