Below my code that have I used for the Sweet alert : you can follow the below step .
1- First you have to Install the plugin. or download Sweetalert.css and Sweetalert.min.js
you can download from go to Code Area section > File Download : download : Sweet alert file
2- Now create an common function to show the message and focus related input box :
function SweetAlert(AlertMessage, Type, Focus) {
var alertType = ""
if (Type == "S" || Type == "SUCCESS") {
alertType = "success";
}
else {
alertType = "error";
}
if (AlertMessage != "") {
swal(AlertMessage, "", alertType).then(function () {
if (Focus != "") {
$("#" + Focus).focus();
}
});
}
}
3- Now Use above defined function like this .
function UnsubscribeNewsLetter() {
try {
SubscriberEmailId = querystring();
$.post(CommonURL + "Home/UnsubscribeNewsLater", {
SubscriberEmailId: SubscriberEmailId
}, function (data) {
if (data.Status == "1") {
SweetAlert(data.Result, "S", "");
} else if (data.Status == "0") {
SweetAlert(data.Result, "E", "");
}
})
} catch (e) {
alert("Error in Method : UnsubscribeNewsLetter " + e.message);
}
}
Let's break the above code and try to understand :
The UnsubscribeNewsLetter function in jQuery is designed to handle the process of unsubscribing a user from a newsletter. It utilizes AJAX (Asynchronous JavaScript and XML) to send a POST request to the server, passing the subscriber's email ID to the designated endpoint for unsubscription.
Key Concepts :
- AJAX Post Request: The function uses jQuery's $.post method to send a POST request to the server asynchronously. This allows the unsubscription process to occur without reloading the entire webpage.
- Callback Function: Upon receiving a response from the server, the function executes a callback function to handle the data returned. Depending on the status of the unsubscription process (success or failure), different actions are taken.
- Error Handling: The function includes a try-catch block to catch any exceptions that may occur during the unsubscription process. If an error is caught, an alert is displayed with details of the error.
The UnsubscribeNewsLetter function follows a structured approach to handle the unsubscription process:
- Retrieve the subscriber's email ID using the querystring() function.
- Send a POST request to the server using $.post, passing the SubscriberEmailId to the designated endpoint.
- Handle the server response in the callback function, displaying a success or error message using the SweetAlert function.
- Implement error handling using a try-catch block to manage exceptions that may arise during the unsubscription process.
In conclusion, the UnsubscribeNewsLetter function in jQuery provides a structured approach to handle the unsubscription process for newsletters. By utilizing AJAX for asynchronous communication with the server, handling server responses, and implementing error handling, this function ensures a smooth and efficient unsubscription experience for users. By understanding the key concepts and code structure of this function, developers can effectively manage newsletter unsubscriptions within their web applications.