How to Shake an element with jQuery UI

In WordPress Admin dashboard login form animate with a shake effect whenever the user enters the wrong details.

This can easily implement using the jQuery UI library.

With jQuery UI you can shake an element in a specific direction and distance.

Using this you can warn the user when invalid input is entered.

In the demonstration, I am creating a login form and which gets shake when the wrong username and password entered.

How to Shake an element with jQuery UI

Read more

Sorting the Table by clicking Header with AJAX

With sorting the list it is easier for the user to locate items in a sorted list than unsorted. It rearranges the data in specific order (ascending or descending).

You can either use PHP or AJAX to get the sorted data.

I am using AJAX to sort the list in this tutorial.

In this tutorial, I am displaying the employee’s list and attach click event on the table column header. Whenever header gets clicked then send an AJAX request with column name to sort with.

Sorting the Table by clicking Header with AJAX

Read more

Dynamically show data in jQuery UI Tooltip using PHP

In the constantly e­volving world of web developme­nt, creating an immersive and e­ngaging user experie­nce is crucial. One way to achieve­ this is by utilizing tooltips – a powerful tool that provides additional context and information whe­n users interact with specific e­lements on a website­.

By combining jQuery UI Tooltip with PHP, you can create dynamic tooltips that seamle­ssly fetch and display data in real-time.

In this article­, readers will embark on a journe­y to explore the fusion of the­se technologies, discove­ring how interactive tooltips can captivate and inform use­rs while showcasing data in creative ways. So why wait? Le­t’s dive into the exciting world of dynamically showcasing data in jQue­ry UI using PHP!

Dynamically show data in jQuery UI Tooltip using PHP

Read more

jQuery UI Tooltip: A Quick and Easy Way to Enhance Element Explanations

Tooltips are important for giving users extra information and improving their experience on a website or app. When you add a tooltip to an element, it shows a brief description or extra details about that element.

Tooltips are useful for explaining button functions, helping users with input values, or giving helpful hints.

In this tutorial, I show how you can add jQuery UI tooltip to an HTML control like – label, input element, span, paragraph, etc.

jQuery UI Tooltip: A Quick and Easy Way to Enhance Element Explanations

Read more