I wanna add buttons "Choose all" and "Remove all" for the Tokenize2, to be able to past at once all possible options or to remove all at once . Is it possible? Please help.
I have managed to clear all :
$('button').on('click', function(){
$('.tokenizeSelectClass').trigger('tokenize:clear');
});
I have managed to check all :
$('button').on('click', function(){
$('.tokenizeSelectClass options').attr('selected', 'selected');
$('.tokenizeSelectClass').trigger('tokenize:remap');
});
Related
I tried below code but its still trying to click the button even if its disabled and the test is getting failed.
cy.get('button').should('not.be.disabled').click()<br>
cy.get('button').should('be.enabled').click()
You can use the jQuery disabled-selector to achieve this. Your code should look like:
cy.get('button').then(($btn) => {
if ($btn.is(":disabled")) {
return
} else {
cy.wrap($btn).click()
}
})
I suggest invoke attribute:
cy.get('button')
.invoke('attr', 'disabled')
.then(disabled =>{
disabled ? cy.log('buttonIsDiabled') : cy.get('button').click()
})
I have this annoying thing that although is not a blocker-blocker, is very annoying. Let me explain.
I have this code inside of a MCE plugin:
var theWindow = editor.windowManager.open({
html: '<iframe id="iframeID" src="iframeURL" frameborder="0"></iframe>',
buttons: [
{
text: 'Cancel',
subtype: 'secondary'
},
{
text: 'Submit',
onclick: 'submit',
subtype: 'primary mySubmitButton'
}
],
});
$('#iframeID').on('load', function(){
selectedSnippets.on('change', function(e){
theWindow.statusbar.$el.find('.mySubmitButton .mce-txt').text(text);
});
});
(I avoided the plugin declaration and the code that will trigger the window opening for brevity)
Ok, so this works, the window is opened, it does have a title, a footer and two buttons on this footer.
My issue now is this: how do I update the text on the footer buttons? I mean I could simply do it with js. That works, but the problem is the buttons are positioned absolute and computed on first render:
So, my question is: how the hell do I re-render those buttons? The documentation of TinyMCE doesn't really help (or I may not know what/where to look for).
And as a subquestion: how to disable one button?
Thanks!
I managed to re-render the buttons in two steps in a probably not-so-clean way:
// you will need to run this for each **updated** button
theWindow.statusbar._items[0].$el.find('.mce-txt').text('my long value goes here');
theWindow.statusbar._items[0].updateLayoutRect();
// You will need to call this once
theWindow.statusbar.reflow()
I still have no idea how to disable/enable buttons though :)
I am using TextExtJs for an autocomplete feature where you start typing and the dropdown of suggestions appears below the text input and you can select a suggested option with arrow keys or mouse.
Everything is working great except that I am trying to perform a function after the user selects one of the suggestions. There is a hideDropdown event which I think is the proper event to use for this. Unfortunately I'm not understanding how to do this, this is what I have tried:
$('#usearch').textext({
plugins : 'autocomplete ajax',
ajax : {
url : 'usersuggest.php',
dataType : 'json',
cacheResults : true
},
autocomplete : {
onHideDropdown : function(){
alert('A happened');
},
hideDropdown : function(){
alert('B happened');
}
},
onHideDropdown : function(){
alert('C happened');
},
hideDropdown : function(){
alert('D happened');
}
});
None of these functions with the alert actually ever run. They do not interfere with the suggestion piece of it. How do I attach a callback to this event?
I'm facing the same problem here....
Unfortunately there is no proper solution. The manual is as rudimental as the examples provided on the plugin page.
I managed to bind a kind of "onAddingTag" event, refer to this: http://textextjs.com/manual/plugins/tags.html#istagallowed
$('#textarea').textext().bind('isTagAllowed', function(e, data) {
var valueAdded = data.tag;
data.result = true; //needs to be done, since we're abusing this event
};
Despite the fact that this may help with this issue, your next problem would be: when does the user remove a tag?
Finally I ended up, using another autocomplete library.
Thanks for reading. I have some codes on my wordpress site, the first one adds an overlay over an image with a color, the article title and a link to go to the project. The second code adds an ajax pagination using jQuery.
The thing is that i have my projects with images and the jquery overlay owrking perfect, but when they click on the previous projects link that calls the ajax pagination, the jquery overlay stops working.
I have been trying different options, but maybe i'm not on the correct way to solve it. Does anyone has a clue?
Thanks in advance.
The codes:
// PORTFOLIO HOVER EFFECT
jQuery('ul.portfolio-thumbs li').hover(function(){
jQuery(".overlay", this).stop().animate({top:'0px'},{queue:false,duration:300});
}, function() {
jQuery(".overlay", this).stop().animate({top:'190px'},{queue:false,duration:300});
});
// POSTS NAVIGATION
jQuery('#posts-navigation a').live('click', function(e){
e.preventDefault();
var link = jQuery(this).attr('href');
jQuery('#ajax-container').fadeOut(500).load(link + ' #ajax-inner', function(){ jQuery('#ajax-container').fadeIn(500); });
});
I've found the solution in the same day and #BrockAdams helped me with the doubts. I'm putting here the code because it can be helpful for someone.
jQuery('ul.portfolio-thumbs li').live('hover', function(event){
if (event.type == 'mouseenter') {
jQuery(".overlay", this).stop().animate({top:'0px'},{queue:false,duration:300});
} else {
jQuery(".overlay", this).stop().animate({top:'190px'},{queue:false,duration:300});
}
});
jQuery('#posts-navigation a').live('click', function(e){
e.preventDefault();
var link = jQuery(this).attr('href');
jQuery('#ajax-container').fadeOut(500).load(link + ' #ajax-inner', function(){ jQuery('#ajax-container').fadeIn(500); });
});
You can post answers to your own question.
And, you needed to use live()Doc on the hover, because the pagination presumably loads in new portfolio-thumbs lis.
Without the live(), these new lis would have no events attached to them (unless you re-called jQuery('ul.portfolio-thumbs li').hover after every pagination event).
Live is easier, and avoids the pitfall of having multiple copies of the same event-listener attached to an element.
And, yes, you can use both live() calls (or more) on the same page without problems.
I know IE7 has issues...
I've read posts here and on Google telling me I need to set the style by hand onfocus() and onblur(). However, everything I try isn't working!
Here is my jQuery
$(document).ready(function(){
if (jQuery.browser.msie === true) {
$("input.date-picker").each(function(i)
{
var $foo= $(this);
$foo.bind('onfocus onblur', function() {
$(this).toggleClass('smalltxt-active');
});
});
}//end if
});
The a corresponding box
<input name="ctl00$SelectionContent$Selections1$txtDestinationDate" type="text"
id="ctl00_SelectionContent_Selections1_txtDestinationDate" class="date-picker"
style="width:80px;" />
I have already confirmed that my code is detecting MSIE. That I am getting a count of 2 input.date-picker objects.
Any ideas?
Thanks in advance,
$foo.bind('onfocus onblur', function() {
should be
$foo.bind('focus blur', function() {
You don't need the each-loop really,
$("input.date-picker").bind('focusin focusout', function(){
$(this).toggleClass('smalltxt-active');
}
Is just fine. It will select all input elements with the class 'date-picker' and bind the events to it.
You may also want to read about the .focusin() and .focusout() events.
try this for many form element
$("input,select,button").bind('focusin focusout', function(){
$(this).toggleClass('focu');
});