How To Archives - Page 8 of 10

How to Delete Record from MySQL Table with AJAX

Last updated on November 14, 2022 by Yogesh Singh

There are many things you can do with AJAX to improve the user experience, for example, Add, edit or delete the record and update the layout without reloading the page.

With only PHP you can easily delete records but require to submit the page or send value by URL and according to it delete a record.

This works and removes the record but it reloads the page every time.

You can do this with jQuery AJAX where you need to pass the record id from AJAX which needs to delete.

In the example, I am creating the HTML table which shows the list of records with a delete button. When the button gets clicked then remove the record and also remove the HTML table row with fadeOut() effect.

How to Delete Record from MySQL Table with AJAX

How to include HTML page with jQuery

Last updated on March 27, 2023 by Yogesh Singh

If you are familiar with PHP, there you can quickly embed another PHP or HTML file within your page using include and require statements.

This saves time when you need to add the same line of code in several files.

If you are not using the server-side script on your webpage then you can use the iframe or Client-side scripting language.

There are two ways in jQuery for including a file in another HTML file –

AJAX request
.load() method

How to include HTML page with jQuery

How to Use before() and after() method in jQuery

Last updated on November 23, 2022 by Yogesh Singh

In CSS before and after pseudo-elements use to add style to the targeted selector elements.

There are two methods with a similar name in jQuery.

They adjust the position or add the element before and after instead of changing CSS.

In this tutorial, with examples, I show how you can use before() and after() methods on your webpage.

How to Use before() and after() method in jQuery

How to make Editable Div Element with contentEditable Attribute

Last updated on July 28, 2021 by Yogesh Singh

Did you ever thought to make an editable div element or <p>, <span>, etc. that works the same as a Text field and Textarea.

Some websites allow the user to edit their content by just pointing to the content and start to update it.

You will already know that <div> is a read-only container that means you can’t edit the content inside of it.

In this tutorial, I show how you can do this with the contentEditable attribute.