JavaScript – Page 7 – My Point of View

Using Silkgrid

Resource for Silkgrid;

https://www.codeproject.com/Articles/365223/Using-a-SlickGrid-within-an-ASP-NET-MVC-3-Applicat

How do i check if an element is hidden in jQuery

Very simple;

// Checks CSS content for display:[none|block], ignores visibility:[true|false]
$(element).is(":visible");

// The same works with hidden
$(element).is(":hidden");

Reference

https://stackoverflow.com/questions/178325/how-do-i-check-if-an-element-is-hidden-in-jquery

ASP.NET Core Telerik UI Configuration

This tutorial demonstrates how to start working with Telerik UI for ASP.NET Core. You will implement the Telerik UI DatePicker for ASP.NET Core in your project by using its dedicated HtmlHelper or TagHelper. In this guide, you will download and implement the components by using NuGet and Visual Studio 2022 for Windows.

The approach demonstrated in this guide is applicable both for new projects and for existing projects where you want to implement Telerik UI controls.

Click here to read about demonstrated approach for application configuration.

After configuration, Click here to read about getting started with Grid.

For applying different design pattern, click here.

SessionStorage property in JavaScript

The read-only sessionStorage property accesses a session Storage object for the current origin. sessionStorage is similar to localStorage; the difference is that while data in localStorage doesn’t expire, data in sessionStorage is cleared when the page session ends.

// Save data to sessionStorage
sessionStorage.setItem("key", "value");

// Get saved data from sessionStorage
let data = sessionStorage.getItem("key");

// Remove saved data from sessionStorage
sessionStorage.removeItem("key");

// Remove all saved data from sessionStorage
sessionStorage.clear();

This is a good candidate for saving text between refreshes. Here is an example;

// Get the text field that we're going to track
let field = document.getElementById("field");

// See if we have an autosave value
// (this will only happen if the page is accidentally refreshed)
if (sessionStorage.getItem("autosave")) {
  // Restore the contents of the text field
  field.value = sessionStorage.getItem("autosave");
}

// Listen for changes in the text field
field.addEventListener("change", () => {
  // And save the results into the session storage object
  sessionStorage.setItem("autosave", field.value);
});

Reference

https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage

Page is Dirty using JavaScript

In the bad old days of desktop applications, every form object in the world had a Dirty property that let you easily check to see if the user had made any changes to the data on the form. It’s almost as easy with client-side code running in the Web browser, provided you use jQuery. This line finds every input tag and ties the tag’s change event to a JavaScript function called flagChanges:

$("input").change(function () 
            {
              flagChanges();
            });