I have a method to ask the user to edit the text,
swal({
text: "Edit your Task",
content: {
element: "input",
attributes: {
value: data,
}
},
buttons:{
cancel: {
text: 'Cancel',
value: 'cancel'
},
edit:{
text: 'Edit',
value: 'edit'
}
}
}).then((value)=>{
console.log(value);
})
This is my code, now how to get the updated input text when the user clicks the Ok button
take a look at the Doc , https://sweetalert.js.org/guides/ at ajax requests, you need to search before ask here
Related
I want to localize jQuery confirm buttons in WordPress. For this I coded in PHP file like this:
function Confirmation()
{
// Register the script
wp_register_script('eux-conf', '/js/eux-js.js');
// Localize the script with new data
$translation_array = array(
'confirmation' => __('Confirmation', 'eux-loc'),
'message' => __('Do you want to delete this item?', 'eux-loc'),
'yes' => __('Yes', 'eux-loc'),
'no' => __('No', 'eux-loc')
);
// Enqueued script with localized data.
wp_enqueue_script('eux-conf');
wp_localize_script('eux-conf', 'meta', $translation_array);
}
add_action('admin_print_scripts', 'Confirmation');
And jQuery codes:
jQuery('.delete').click(function()
{
jQuery.confirm({
'title': meta.confirmation,
'message': meta.message,
buttons: [
{
text: meta.yes,
classes: 'widget btn primary',
id: "yes",
onclick: function() {
}
},
{
text: meta.no,
classes: 'widget btn secondary',
id: "no",
onclick: 'close'
}
]
});
EDIT: After David Lee's answer, I realized, if I write "This is a String" instead of meta.yes, I get 0 and 1 again like here:
buttons: [
{
text: "This is a String",
classes: 'widget btn primary',
id: "yes",
onclick: function() {
}
},
{
text: meta.no,
classes: 'widget btn secondary',
id: "no",
onclick: 'close'
}
]
I think firstly, I must correct my buttons parameters, but I don't know.
But this gives me like here:
You see, my buttos are Yes and No, but the code shows 0 and 1. How do I correct this?
try
function Confirmation()
{
// Register the script
wp_register_script('eux-conf', '/js/eux-js.js');
// Localize the script with new data
$translation_array = array(
'confirmation' => __('Confirmation', 'eux-loc'),
'message' => __('Do you want to delete this item?', 'eux-loc'),
'yes_s' => __('Yes', 'eux-loc'),
'no_s' => __('No', 'eux-loc')
);
// Enqueued script with localized data.
wp_localize_script('eux-conf', 'meta', $translation_array);//this one first
wp_enqueue_script('eux-conf');
}
add_action('admin_enqueue_scripts', 'Confirmation');
and in jQuery:
jQuery('.delete').click(function()
{
jQuery.confirm({
'title': meta.confirmation,
'message': meta.message,
buttons: [
{
text: meta.yes_s,
classes: 'widget btn primary',
id: "yes",
onclick: function() {
}
},
{
text: meta.no_s,
classes: 'widget btn secondary',
id: "no",
onclick: 'close'
}
]
});
i changed the order, you need to localize first then enqueue, also i changed the hook to admin_enqueue_scripts, and changed the name of the variables since no is a reserved one.
Try,
jQuery.confirm({
'title': meta.confirmation,
'message': meta.message,
buttons: {
yes: {
text: meta.yes_s, // OR text: "'"+meta.yes_s+"'",
classes: 'widget btn primary',
id: "yes",
onclick: function() {
}
},
no: {
text: meta.no_s, // OR text: "'"+meta.no_s+"'",
classes: 'widget btn secondary',
id: "no",
onclick: 'close'
},
}
});
jQuery Confirm is just a plugin and not just one. There are one more plugins named jQuery.confirm. Which is your plugin jQuery-Confirm or BootboxJS or others. I suggest that update your plugin. Because Jaydip Nimavat's example works.
I try to write a plugin for the CKEditor (Version 4.x), with a Dialog UI element.
the definition of the dialog looks like:
CKEDITOR.dialog.add('abbrDialog', function(editor) {
return {
title: editor.lang.abbr.title,
label: editor.lang.abbr.title,
minWidth: 400,
minHeight: 200,
contents: [{
id: 'abbreviation-dialog',
label: editor.lang.abbr.label,
elements: [
{
id: 'abbreviation-found-label',
type: 'html',
label: editor.lang.abbr.found,
html: '<span id="foundLabelId">'+ editor.lang.abbr.found + '<\/span>'
},
{
id: 'abbreviation-current-item',
type: 'html',
label: editor.lang.abbr.currentLabel,
html: '<span id="currentLabelId">'+ editor.lang.abbr.currentLabel + '<\/span>'
},
{
id: 'abbreviation-replace-button',
type: 'checkbox',
label: editor.lang.abbr.replaceButton,
onClick : function() {
replaceAbbreviation(editor.lang.abbr.currentLabel, editor.lang.abbr.noMore);
}
},
{
id: 'abbreviation-next-button',
type: 'button',
label: editor.lang.abbr.nextButton,
onClick : function() {
nextAbbreviation(editor.lang.abbr.currentLabel, editor.lang.abbr.noMore);
}
},
{
id: 'abbreviation-all-button',
type: 'button',
label: editor.lang.abbr.allButton,
onClick : function() {
replaceAllAbbreviations(editor.lang.abbr.currentLabel, editor.lang.abbr.noMore);
//alert('Replace all!!');
}
}]
}],
buttons: [CKEDITOR.dialog.okButton],
onShow: function() {
initDialog(editor.lang.abbr.found, editor.lang.abbr.currentLabel);
},
onOk: function() {
// nothing to do
}
In one function i try to disable a button. This looks like:
CKEDITOR.dialog.getCurrent().getContentElement("abbreviation-dialog", "abbreviation-replace-button").disable();
Unfortunately this button gets not disable (but the additional CSS-class cke_disabled is added).
Also strange: if i turn that abbreviation-replace-button into a checkbox, this checkbox gets disabled (with no further code modifications).
My Questions:
How can i disable a button on a plugin dialog?
Why gets the checkbox disabled but the button not?
Where is my mistake?
I think you need to call a special method to disable buttons,
i.e. `disableButton('btn')
you can disable ok or cancel button by following way
CKEDITOR.dialog.getCurrent().disableButton('ok')
CKEDITOR.dialog.getCurrent().disableButton('cancel')
in your case you can try
CKEDITOR.dialog.getCurrent().disableButton('abbreviation-next-button')
I want to hide the destructiveText property conditionally, is that possible? So, say there is a variable called showDelete. I want to show destructiveText to show only when showDelete = true. Is it possible to conditionally exclude it from the json?
$ionicActionSheet.show({
buttons: [
{ text: 'Share' },
{ text: 'Report'},
],
destructiveText: 'Delete', //I want to hide this delete element when showDelete is false
titleText: 'Actions',
cancelText: 'Cancel',
cancel: function() {
// add cancel code..
},
...
Define your config object outside of the function call, then you can modify properties using conditionals as well as use methods like angular.extend()
var opts = {
buttons: [
{ text: 'Share' },
{ text: 'Report'},
],
titleText: 'Actions',
cancelText: 'Cancel',
cancel: function() {
// add cancel code..
}
}
if(showDelete){
opts.destructiveText = 'Delete';
}
$ionicActionSheet.show(opts);
I made a jQuery plugin where one of the properties needing to be passed is a multi-dimensional object, each requiring three properties. Problem is, I don't know how to send more than two. I have provided an example to show the current effect and the needed effect:
What I currently do:
$.dialog({
title: "Delete Comment",
text: "Are you sure you want to delete this comment?",
buttons: {
"Yes": function() { /*some operation*/ }
}
});
What I need to do:
$.dialog({
title: "Delete Comment",
text: "Are you sure you want to delete this comment?",
buttons: {
"Yes": function() { /*some operation*/ } : true
}
});
In order to show it's a special type of button (internally, the plugin would do something with the third value).
How is this achievable?
In this case, "Yes" is not a property ... it is a key and the function is the value. You need to add another key/value pair. Try ...
buttons: {
"Yes": function() { /*some operation*/ },
"Special" : true
}
Then you can check to see if Special exists and has the value of true.
You can put whatever operations before the closes.
$.dialog({
title: "Delete Comment",
text: "Are you sure you want to delete this comment?",
buttons: [{
"Yes": function () {
$(this).dialog("close");
}
}, {
"No": function () {
$(this).dialog("close");
}
}, {
"Maybe": function () {
$(this).dialog("close");
}
}]
});
I've got a Kendo UI Grid that loads a popup when creating a new or editing an existing record.
I struggling to find a way to change the change the text of the Update button to "Save" when I'm creating a new record (it currently says "Update" - and its not correct).
I was able to change the title of the popup window, but my question is: how do I change the button text?
This is the code:
$("#grid").kendoGrid({
dataSource: dataSource,
pageable: true,
sortable: true,
groupable: true,
height: resizeGrid(),
filterable: true,
toolbar: ["create"],
columns: [
{ field: "OfficeName", title: "Office Name" },
{ field: "SupportNo", title: "Phone No.", width: "100px" },
{ field: "SupportEmail", title: "Email Address", width: "130px" },
{ field: "SupportFax", title: "Fax No.", width: "100px" },
{ field: "SupportFtp", title: "Ftp Url", width: "150px" },
{ command: ["edit", "destroy"], title: "Actions", width: "160px" }],
editable: "popup",
edit: function (e) {
var editWindow = e.container.data("kendoWindow");
if (e.model.isNew()) {
e.container.data("kendoWindow").title('Add New Office');
$(".k-grid-update").text = "Save";
}
else {
e.container.data("kendoWindow").title('Edit Office');
}
}
});
You should define command as:
command: [
{
name: "edit",
text: {
edit: "Edit", // This is the localization for Edit button
update: "Save", // This is the localization for Update button
cancel: "Cancel changes" // This is the localization for Cancel button
}
},
{
name: "destroy",
text: "Delete Office" // This is the localization for Delete button
}
]
In addition, if you also want to change the text Edit in the popup window, you should use:
editable : {
mode : "popup",
window : {
title: "Edit Office", // Localization for Edit in the popup window
}
}
This will update the text in the button of the PopUp Editor:
if (e.model.isNew()) {
$("a.k-grid-update")[0].innerHTML = "<span class='k-icon k-update'></span>Activate";
}
else {
$("a.k-grid-update")[0].innerHTML = "<span class='k-icon k-update'></span>Save";
}
edit: function (e) {
if (e.model.isNew()) {
$(".k-window-title")[0].innerHTML = "Add";
}
}