Tag: JavaScript

Hide default search in DataTables

To hide default search box, simply pass ‘dom’:’lrtip’. This will hide default search box but searching feature still working so we can add any other custom searching.

$(‘#myTable’).DataTable({
   “dom”:”lrtip”
});

If you want to hide default search box and disable searching you can pass searching: false. In this we can not add any custom searching.

$(‘#myTable’).DataTable({
    searching: false
});

Reference

https://datatables.net/reference/api/search()

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