how to limit notification(notify) - javascript

I want to show just a one-time error message. But not other classnames ex (classname success message show itself every time but error message just one time shows). When I triggered error message last error message must close and open new error message.
$.notify(Util.Localize.Resource(
"bb53c064-e1d6-429d-b49f-bd1ec5fc83b6",
"{
en: 'Please Fill the Branch Name Field',
tr: 'Lütfen şube alanını giriniz.',
ar: 'يرجى ملء حقل اسم الفرع'
}"
),
{
position: 'top-right',
showAnimation: 'slideDown',
hideAnimation: 'slideUp',
className: 'error'
});

I add notify to util.js and get class name from view.
if (notificationType === Enum.NotificationType.Warning) {
if (document.getElementsByClassName("notifyjs-wrapper notifyjs-hidable").length !== 0)
return;
else {
$.notify(message, {
position: 'top-right',
showAnimation: 'slideDown',
hideAnimation: 'slideUp',
className: 'error'
});
}
}

Related

Discord Modal with SelectMenu

I'm trying to add a select menu inside a modal (I pretty sure it's possible) but I ended up in this situation and getting this error in the console:
const modal = new client.discord.ModalBuilder()
.setCustomId('verification-modal')
.setTitle('Verify yourself')
.addComponents([
new client.discord.ActionRowBuilder().addComponents(
new client.discord.SelectMenuBuilder()
.setCustomId('t')
.setPlaceholder('Nothing selected')
.addOptions(
{
label: 'Select me',
description: 'This is a description',
value: 'first_option',
},
{
label: 'You can select me too',
description: 'This is also a description',
value: 'second_option',
},
),
new client.discord.TextInputBuilder()
.setCustomId('verification-input')
.setLabel('Answer')
.setStyle(client.discord.TextInputStyle.Short)
.setMinLength(4)
.setMaxLength(12)
.setPlaceholder('ABCDEF')
.setRequired(true),
),
]);
await interaction.showModal(modal);
ode:events:490
throw er; // Unhandled 'error' event
^
DiscordAPIError[50035]: Invalid Form Body
data.components[0].components[0][UNION_TYPE_CHOICES]: Value of field "type" must be one of (4,).
if you have any solution '^^
Only text inputs are supported on modals.
documentation

No popup when product is present in the cart

When I add a product to the cart I am using the code below:
addproduct(itemId) {
this.showLoading = true
this.$http.post('/shampoo', {'item': itemId}).then((response) => {
swal({
title: "Success!",
text: "Product added to your basket!",
type: "success",
timer: 1500,
showConfirmButton: false
})
this.showLoading = false
}, (response) => {
this.showLoading = false
})
I created a popup form which for no product was at the cart, once they click on the add to cart button it popups, once the product was their at the cart, if any one need to add another product it again showing popup. I don't want the popup if product was at the cart
here is the code for popup form
show() {
this.showLoading = true;
$(".loading").css('display', 'block');
$('#products').modal("hide");
//
let code = $('input[name=code]').val();
if(code) {
this.$http.post('/codee', { code: code}).then((response) => {
// $('#basic-form').submit();
}, (response) => {
swal({
title: "Error!",
text: "Sorry this Code is invalid!",
type: "error",
timer: 2500,
showConfirmButton: false
})
$(".loading").css('display', 'none');
this.showLoading = false
$('input[name=code]').val('')
})
When you click add to cart, at the server side, you need to check if the item id is in the cart and return a flag to either indicate the item is in the cat or not. I assume this code is responsible for the pop up.
swal({
title: "Error!",
text: "Sorry this Code is invalid!",
type: "error",
timer: 2500,
showConfirmButton: false
})
You need to check for the returned value from the server, if it returns a flag indicating that the item already exist, just return false; that will block the pop up code from being reached. or you could wrap the pop code in an if statement. e.g
if(response.flag === 1){
return false;
// your pop up code goes here
}
or
if(response.flag === 0){
// your pop up code goes here
}
// flag can assume 0 => Added but does not exist, 1=> added but already
// exist. ect
// while the actual data will be stored in response.data
But I am wondering of the reason you are implementing this. If a user clicks add to cart, you are supposed to increment the number of that same item if already exist in the cart

jQuery error "Uncaught TypeError: Cannot read property 'apply' of undefined"

I'm enabling an OK button in a jQuery dialog box based on changes to a Select field.
That part works, but when I click on OK or 'Close' in order to save that information and proceed, the following errors appear.
Chrome: Uncaught TypeError: Cannot read property 'apply' of undefined
Firefox: TypeError: d.click is undefined
... e="button">').click(function(){d.click.apply(c.element[0],arguments)})....
jquery-ui.min.js (line 14, col 5350)
var disposition; // I'm using this so that the alert('fixed') doesn't get call on load...
// Callback Disposition Dialog
$('#disposition_modal').dialog({
open: function () { // removed the default close link
$(this).parent().children(':first').children('a').remove();
},
buttons: [{
text: 'Cancel',
Ok: function () {
$(this).dialog("close");
}
}, {
text: 'OK',
disabled: true,
id: 'dm_btn',
Ok: function () {
if (disposition !== '' && undefined !== disposition) {
alert('fixed');
$(this).dialog("close");
}
}
}]
});
// toggle the OK button
$('#disposition_id_in2').change(function () {
disposition = $('#disposition_id_in2').val();
if ($('#disposition_id_in2').val()) {
$('#dm_btn').attr('disabled', false);
} else {
$('#dm_btn').attr('disabled', true);
}
});
Here's a JSFiddle distillation of the problem to its barest minimum: JSFiddle button error
You need to change "Ok" to "click" for the buttons.
buttons: [{
text: 'Cancel',
click: function () {
$(this).dialog("close");
}
}, {
text: 'OK',
disabled: true,
id: 'dm_btn',
click: function () {
console.log(disposition);
if (disposition !== '' && undefined !== disposition) {
alert('fixed');
$(this).dialog("close");
}
}
}]
jsfiddle

How to hide angular-strap $alert

I have this code and on socket.connect I want to be able to hide the alert that was shown in socket.disconnect.
I see there is a reference in the docs to $scope methods hide, show, and toggle but how can I use them in this example?
socket.on('disconnect', function () {
// Show login error message
$alert({
title: 'Connection lost.',
content: 'Please reload the page.',
placement: 'top-right',
type: 'danger',
show: true
});
});
socket.on('connect', function () {
// TODO: Check if connection alert is showing and if it is, hide it
});
I feel stupid today...
var alert = $alert({
title: 'Connection lost.',
content: 'Please reload the page.',
placement: 'top-right',
type: 'danger',
show: false
});
socket.on('disconnect', function () {
alert.show();
});
socket.on('connect', function () {
alert.hide();
});

how to give default alert function behaviour to qtip 2 alert

I am using qtip2 for displaying the alert messages for my web application ( as shown at http://craigsworks.com/projects/qtip2/demos/#dialogues )
my code is
1) for dialogue
function dialogue(content, title) {
/*
* Since the dialogue isn't really a tooltip as such, we'll use a dummy
* out-of-DOM element as our target instead of an actual element like document.body
*/
$('<div />').qtip(
{
content: {
text: content
, title: {
text: 'PMGSY ',
button: 'Close'
}
},
position: {
my: 'center', at: 'center', // Center it...
target: $(window) // ... in the window
},
show: {
ready: true, // Show it straight away
modal: {
on: true, // Make it modal (darken the rest of the page)...
blur: false, // ... but don't close the tooltip when clicked
escape: false
}
},
hide: false, // We'll hide it maunally so disable hide events
style: {
classes: 'qtip-shadow qtip-rounded qtip-dialogue', // Optional shadow...
widget: true //themeroller
},
events: {
// Hide the tooltip when any buttons in the dialogue are clicked
render: function (event, api) {
$('button', api.elements.content).click(api.hide);
},
// Destroy the tooltip once it's hidden as we no longer need it!
hide: function (event, api) { api.destroy(); }
}
});
}
2) to call it as alert
function Alert(message) {
// Content will consist of the message and an ok button
var message = $('<p />', { text: message }),
ok = $('<button />', { text: 'Ok', 'class': 'full' });
dialogue(message.add(ok), 'Alert!');
}
the problem is when i use it ,its does not block the further processing until user click on ok button (like default alert function).
e.g this alert does not even show up.
Alert("Customised alerts"); //this doesent show
window.location.replace("/Home/startPage");
how to make my custom alert mimic the default alert function ?
Please help
Replace
ok = $('<button />', { text: 'Ok', 'class': 'full' });
with
ok = $('<button />', { text: 'Ok', 'class': 'full' }).click(function(){
window.location.replace("/Home/startPage");
});

Categories

Resources