Display text as popup - popup

I want to show "Please go back and check the I am not a robot box" in pop up,how can I do it? this is in html page
This will display if captcha is not selected ( google captcha).
if(isset($_POST['g-recaptcha-response'])){
$captcha=$_POST['g-recaptcha-response'];
}
if(!$captcha){
echo '<h2>Please go back and check the I am not a robot box.</h2>';
exit;
}
Thank you in advance.

You can use the javascript alert box.
alert("Please go back and check the I am not a robot box.");
http://www.w3schools.com/js/js_popup.asp
If you'd rather have something nicer (And it's probably a better idea as an Alert box can be interpreted as an error) I'd go with a jquery popup, dialog works well, here's a quick look at how it's implemented in the code:
$('#dialog-confirm').dialog("option", "buttons", [
{
text: 'Please go back and check the I am not a robot box.',
click: function () { $("#dialog-confirm").dialog("close"); }
}
]); //end buttons
$('#dialog-confirm').dialog("open");
https://jqueryui.com/dialog/

Related

Nightwatch setvalue method not working at all

I am new to NightWatch and trying to use .setValue method to enter email/password on http://app.insight360.io
It simply fails to set the value. I have tried waitForElementPresent and waitForElementVisible to see if that helps, but nothing seems to be working.
I would love it if somebody can post a code snippet that would set the value to any string you like in the email and password field and click the Login button.
I was able to input email and password and click on Login button with the below snippet, using setValue. Can you once try and let me know.
module.exports = {
'DemoTest 1': function (browser) {
browser
.url('https://app.insight360.io/')
.waitForElementVisible('.input.ng-valid-email:nth-child(1)', 5000)
.setValue('.input.ng-valid-email:nth-child(1)', 'abc#text.com')
.setValue('div.form-wrapper > form > div:nth-child(2) > input', 'password123')
.click('.button.highlight-primary:nth-child(1)')
.end()
},
};

cannot react to close tab event with cloudfare app

I am using the app creator and trying to react to close tab window event using the code below.
I then preview the app in a separate window, but when I close the tab I don't get the confirmation pop up.
When I inject this code in the js console it works as expected.
Doesn't cloudfare app support such functionality?
window.onbeforeunload = function (e) {
// Your logic to prepare for 'Stay on this Page' goes here
return "Please click 'Stay on this Page' and we will give you candy";
};
I tested this and was able to see the pop up when after clicking to close the tab. Are you certain that this assignment is happening? In the previewed window, what is the output of window.onbeforeunload?
You also need to make sure to set the returnValueof e to something other than null e.g. :
function sendAlert() {
window.onbeforeunload = (e) => {
const dialogText = 'Random Text';
e.returnValue = dialogText;
return dialogText; }
}

Stop window from closing in tinyMCE in onSubmit function

I am trying to add some validation logic to the code plugin for tinyMCE.
It seems, however, that when a window's onSubmit function is called, the window closes by default.
The onSubmit function currently looks like this:
onSubmit: function (e) {
// We get a lovely "Wrong document" error in IE 11 if we
// don't move the focus to the editor before creating an undo
editor.focus();
editor.undoManager.transact(function () {
editor.setContent(e.data.code);
});
editor.selection.setCursorLocation();
editor.nodeChanged();
}
What I would like to do is add some validation logic to the plugin to prevent tinyMCE from reformatting invalid html and, rather, display a message that the html is invalid. Essentially, something like this:
onSubmit: function (e) {
// We get a lovely "Wrong document" error in IE 11 if we
// don't move the focus to the editor before creating an undo
var isCodeValid = true;
//check if code valid
isCodeValid = ValidateCode(e.data.code);
if (isCodeValid) {
//if code valid, send to tinyMCE to let it do it's thing
editor.focus();
editor.undoManager.transact(function () {
editor.setContent(e.data.code);
});
editor.selection.setCursorLocation();
editor.nodeChanged();
}
else {
//if code invalid, display error message and keep text editor window open
tinyMCE.activeEditor.windowManager.alert("Your HTML is invalid. Please check your code and try submitting again.");
return;
}
}
However, it seems that the onSubmit function closes the text editor window regardless. I was wondering if there is a way to stop it from doing this. I have scoured the documentation which leaves much to be explained and have looked at other plugins as examples. The closest I can find is the searchandreplce plugin. The 'Find' button calls the onSubmit function, but it seems to stay open if the 'find' text field is blank. However, the logic behind it seems very different from what I can use in the Code plugin as it is.
Can anyone who is familiar with the tinyMCE API give me any ideas on how to prevent the window from closing when onSubmit is called? Or do I have to go another route?
As per this question the way to cancel an event is to return false;. This will keep the popup open. Your code would then become:
onSubmit: function (e) {
// We get a lovely "Wrong document" error in IE 11 if we
// don't move the focus to the editor before creating an undo
var isCodeValid = true;
//check if code valid
isCodeValid = ValidateCode(e.data.code);
if (isCodeValid) {
//if code valid, send to tinyMCE to let it do it's thing
editor.focus();
editor.undoManager.transact(function () {
editor.setContent(e.data.code);
});
editor.selection.setCursorLocation();
editor.nodeChanged();
}
else {
//if code invalid, display error message and keep text editor window open
tinyMCE.activeEditor.windowManager.alert("Your HTML is invalid. Please check your code and try submitting again.");
return false;
}
}
I figured it out finally. All you need to do is add e.preventDefault(); at the start of the onSubmit function and the window will not close. The documentation was no help, but looking at the searchandreplace plugin as an example lead me to the answer. What I have now is like this:
onSubmit: function (e) {
e.preventDefault();
// We get a lovely "Wrong document" error in IE 11 if we
// don't move the focus to the editor before creating an undo
var isCodeValid = true;
//check if code valid
isCodeValid = ValidateCode(e.data.code);
if (isCodeValid) {
//if code valid, send to tinyMCE to let it do it's thing
editor.focus();
editor.undoManager.transact(function () {
editor.setContent(e.data.code);
});
editor.selection.setCursorLocation();
editor.nodeChanged();
}
else {
//if code invalid, display error message and keep text editor window open
tinyMCE.activeEditor.windowManager.alert("Your HTML is invalid. Please check your code and try submitting again.");
return;
}
}
e.PreventDefault() seems to stop the default behavior of the onSubmit function.

Gravity forms use cookie to hide form div

Gravity form can create a cookie when the user submits the form. I would like to use this to hide the gform_wrapper div and replace it with a simple message "You have already filled out the form."
add_action( 'gform_after_submission_1', 'set_form_1_complete_cookie' );
This is a version of what I would like to do that uses Jquery-cookie I tested it independently and it works fine but I can't figure out how to implement something like this with my form.
// when clicked on “X” icon do something
$('.close').click(function() {
// check that “X” icon was not cliked before (hidden)
if (!$('.change-message--on-click').is('hide--first')) {
$('.change-message--on-click').removeClass('hide--second');
$('.change-message--on-click').addClass('hide--first');
// add cookie setting that user has clicked
$.cookie('hide-after-click', 'yes', {expires: 7 });
}
return false;
})
Any help would be greatly appreciated.

ui.tabs add callback not able to set tab

I am trying to get jQuery tabs to behave like IE and Firefox. I have a few tabs with an "addtab" at the end. When this tab is clicked a new tab is added, this is fine. But i want to select the second last tab. This is proving to be quite difficult.
my init code is
$tabs =$("#tabs").tabs({
add: function(event, ui) {
$tabs.tabs('select', $tabs.tabs( 'length' ) -2);
alert ("after setting tab");
}
});
my add tab code is
$("#addtab").click(function(){
showcal();
// The first thing to do is to deselect all the other selections
$("#tabs .ui-corner-top").each (function () {
$(this).removeClass ("ui-tabs-selected ui-state-active").addClass ("ui-state-default");
});
$tabs.tabs('add','#extra','Generate Report', ($tabs.tabs('length')-1));
tabContainerTabCount++;
});
however in the add callback the following line is resetting the selected tab
self._trigger('select', null, self._ui(this, $show[0])) === false)
If anyone has any solution or reason why this is done, can you let me know
Thanks
John
I was pointed to the answer at the following web page
http://forum.jquery.com/topic/ui-tabs-unable-to-set-index-after-add#14737000000698077
thanks tsukasa1989