Уведомление о тосте не появляется в проекте ASP.NET ⇐ Javascript

[Anonymous]

здесь новичок. Я создал макет уведомлений о тосте, используя Bootstrap и используя метод JavaScript, чтобы в моих файлах aspx.cs я мог определить свои пути значков, цвета и т. Д. Однако, когда я нажимаю на кнопку, есть логика сохранения данных, но уведомление о тосте не отображается. Затем я продолжаю добавлять временную кнопку, чтобы проверить ее, и это работает? Интересно, в чем проблема?






- My ASP.NET Application

[*]







body, html {
padding-inline: 0 !important;
}

.sidebar-custom {
background-color: var(--bg-white);
min-height: 100vh;
}

.sidebar-custom a {
color: black;
text-decoration: none;
display: block;
padding: 0.75rem 2rem;
width: 100%; /* Ensures the link takes up the full width */
box-sizing: border-box; /* Includes padding and borders in the width calculation */
transition: background-color 0.2s ease;
margin: 0;
}

.sidebar-custom a:hover {
background-color: var(--secondary-colour);
}

.dynamic-content {
min-height: 100vh;
background-color: var(--bg-white);
padding-top: 20px;
padding-bottom: 20px;
}

.custom-toast {
position: fixed;
bottom: 20px;
right: 20px;
background-color: #fff;
color: #000;
border-radius: 8px;
min-width: 300px;
max-width: 400px;
z-index: 9999;
box-shadow: 0 8px 4px -4px rgba(0, 0, 0, 0.2);
padding: 0;
margin: 0;
opacity: 0; /* Initially hidden */
transition: opacity 0.3s ease, transform 0.3s ease;
}

.custom-toast.d-flex {
opacity: 1; /* Show toast */
transform: translateY(0); /* Transition from bottom */
}

.custom-toast.d-none {
opacity: 0; /* Hide toast */
transform: translateY(10px); /* Slide out effect */
}





Home
[*] Projects
[*] Reports
[*] Settings
[/list]







Users


Category


Products



















Title
Subtitle text here




function showToast(iconPath, borderColor, title, subtitle) {
const toast = document.getElementById('customToast');

// Set icon and text
document.getElementById('toastIcon').innerHTML = `

`;
toast.style.borderLeft = `5px solid ${borderColor}`;
document.getElementById('toastTitle').textContent = title;
document.getElementById('toastSubtitle').textContent = subtitle;

// Show the toast (by removing d-none and adding d-flex)
toast.classList.remove('d-none');
toast.classList.add('d-flex'); // Makes the toast visible with flex display

// Hide the toast after 3 seconds
setTimeout(function () {
toast.classList.add('d-none'); // Hide toast
toast.classList.remove('d-flex'); // Remove flex class after hiding
}, 3000);
}





< /code>
using System;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace OnlineGroceryShop
{
public partial class category : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}

// Add category logic
protected void btnAdd_Click(object sender, EventArgs e)
{
lblDtCreated.Text = DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss");

try
{
int rowsAffected = CategorySqlDS.Insert();

if (rowsAffected > 0)
{
ShowToast("Category added successfully.", "Images/correct-icon.png");
}
else
{
ShowToast("Category insertion failed.", "Images/alert-icon.png");
}
}
catch
{
ShowToast("An error occurred while adding the category.", "Images/error.png");
}
}

// Delete category logic
protected void btnDelete_Click(object sender, EventArgs e)
{
CategorySqlDS.Delete();
}

// Update category logic
protected void btnUpdate_Click(object sender, EventArgs e)
{
CategorySqlDS.Update();
}

// GridView row selection logic
protected void GridView1_SelectedIndexChanged(object sender, EventArgs e)
{
txtName.Text = Server.HtmlDecode(GridView1.SelectedRow.Cells[1].Text);
txtDescription.Text = Server.HtmlDecode(GridView1.SelectedRow.Cells[2].Text);
lblCatID.Text = GridView1.SelectedDataKey.Value.ToString();
}

// Toast message helper method
private void ShowToast(string message, string iconPath)
{
string script = $"showToast('{iconPath}', '#28a745', 'Success', '{message}');";
ScriptManager.RegisterStartupScript(this, GetType(), "showToast", script, true);
}
}
}


Подробнее здесь: https://stackoverflow.com/questions/795 ... et-project