JavaScript, jQuery and Ajax

In this lecture, we will see what we are going to learn in this course. We will start from the old way section, where we see why we shouldn't use it anymore. Then, in section 2, we will learn some JavaScript and jQuery scripts and events, that we may need them in AJAX. And the final section will be about Ajax, and how to send data to server through it, without reloading web page.

In this lecture, we are going to create a database and a table to work with all along this course. If you are not familiar with MySQL workbench, you can always work with wamp and xamp (for windows) or mamp (for mac).

In this lecture, we are going to create the project folder inside our server. Create a new folder inside wamp directory folder (www).

We will include bootstrap in our project so we can see a well designed interface while, we are working with jQuery and Ajax. So download bootstrap library and in the next lectures, you will be able to see the difference, when using it in a web page.

In this lecture, we are going to display all data inside our database into the web page.

In this lecture, we are going to insert and add some data and see how the server needs to refresh the page so we can see it again.

In this lecture, we are going to see how to access DOM objects using JavaScript.

In this lecture, we will learn how to access DOM object values.

In this lecture, we will learn how to make a simple form validation.

In this lecture, we are going to refresh our memory with the ready() event in jQuery.

In this lecture, we will learn the click() and the change() events, on jQuery. Those events are easy, and essentials to learn.

In this lecture, we will learn Append, prepend, after and before functions. Those functions, will help us, to add data to the current web page with no reloading.

In this lecture, we will learn the slideToggle() function that help us to show and hide an HTML element.

Animate() function help us to change position, width, height, opacity, and other features, of an HTML element.

Delay() function help us to put a timer between consecutive animation. We will use the fadeIn() and fadeOut() functions to show how delay() works.

Stop() function will help us to stop an animation in any stage of it.

In this lecture, we are going to make a simple jQuery effect and animation for form validation, where if a text box is empty, it will fade in and out with changing border color.

In this lecture, we will learn how to use .keyup() and .keydown() functions in jquery, and we will make a simple project about how we confirm if a new password is equal to the confirmation text box using .keyup().

In this project, we will learn how to get key codes of our keyboard and make some conditions using them.

In this lecture, we will learn about .on() and .off(). Then we will make a simple project about how we can set a clickable button off.

This lecture will be an introduction about AJAX and why we should use it in our web development projects.

In this lecture, we will specify the server code URL, where we will send our data.

Their is 2 types to send data through: POST and GET. In this lecture, we will learn how to define the type inside AJAX script.

In this lecture, we will learn how to send data as an object into our PHP server code using Ajax.

We have 3 main type of data we could return when finishing executing PHP server code: text, JSON, and HTML. In this lecture, we will concentrate on the "text" type.

In this lecture, we will make some modifications in our form, where we will change the button type, and remove the method and action from HTML for, then we will write the php server code.

In this lecture, we will type the error function, where when data not added for some reason.

In this lecture, we will see how to append data into our page, with no more refresh and reload.

This lecture is a simple and fast introduction about what should you have at the end of this exercise.

The next step is to generate buttons for each row in the table. So this lecture will show you how to do that.

In this lecture, we are going to write the PHP delete code.

In this lecture, we are going to write the Ajax script.

In this lecture, we will see the result and we will take another exercise

In this lecture, we will resolve the exercise about how to add a button with the new appended line.

In this lecture, we will create our first json string and parse it into an object.

In this lecture we will learn how to type a JSON array and access it.

In this section we will learn how to use JSON as datatype in our AJAX script, and what changes we should do before.

In this lecture, we will learn how to make changes and echo HTML data from our PHP server code into AJAX script.

Every filter should have a field inside database table, so before we start scripting, we need to make some changes to our database and web page.

In this lecture, we are going to specify what we need to send from AJAX to PHP search page, and then what we should return back.

In this section, we should know what are the basic conditions to set and use. We should take all the possibilities in consideration. And we can use only one AJAX script with multiple PHP IF statements.

In this lecture, we will combine multiple AJAX filters together to get more specifc data according to a specific criteria.

In this part 1, we will take an introduction about what is FullCalendar and how to use it, in our web development.

In this lecture, we will get data from MySQL database using PHP, and fetch them into JSON array, to be used by AJAX script.

In this final part of this project, we will get the json array returned from PHP code into AJAX, and then set it inside FullCalendar events, to be generated automatically.