At the moment to publish an unpublished article.
We need to edit the article at a valid publish date and time and update the article rijkaard.
Now that we know how to make Ajax requests Let's add a published button to make publishing articles
easier and quicker.
In the admen index Let's add a published button next to each unpublished article as there could be multiple
buttons.
We'll give it to class so we can identify it in the script.
In our script file.
Let's add a handler for the Click event of albertson's of this class.
The first thing we need to do in here is identify the article we want to publish.
So we need it's idae.
So we need to pass the article idae.
So the click handler when the button is clicked.
We can do this using data attributes we can add any attribute we like to an HP email element and store
any arbitrary value in it.
If we prefix the name of that attribute with the word data and a hyphen javascript defines a standard
way to access these values.
And as we're using Jake Query we can use the data function to easily retrieve these values.
So let's add a data attribute to the button element that will contain the idea of the article.
Then in the script when the button is clicked we can get the value of this attribute.
This variable represents the button object that's been clicked and we call the data function on that
passing in the name of the data attribute that we want without that data prefix to check this is working.
Let's show this idea in a message box.
When I click the button the idea of the article is shown.
Now we have the idea of the article.
We need to publish it first.
Let's add a method to the article class to publish an article.
In here we need Eskew L to update the article record with place holders father.
Published at field we're going to update the field in the workforce.
Then as always we'll prepare it and bind the deep place holder to the I.D. of the current rijkaard to
set the.
Published at field.
First let's assign the current date and time in the format expected by the database to a variable.
Then we can bind that value to the place holder.
If the update is successful we'll return this value.
Then we need a p h prescript that's going to call this method which is what will call in the Ajax request.
So let's add a new script in the admin folder called publish article.
P.
In here as with all our HP code will require the initialization file require log in as this is a script
for administrators only get the database connection.
Then the article getting the idea from the post array as we were making a change on the server updating
a value in the database.
We should use the post method.
Then we'll call the new published method on the article object and get its return value into a variable.
Let's send back the same code that's displayed.
If the article is published a time element containing the date and time.
So we'll end the HP.
And output a time element containing the return value from the published method.
Now there are several places in here where we could get an error.
If the post method isn't used if the article isn't found if the update doesn't work but will handle
those later on for now we'll assume that it's going to work.
Then in the button click handling script we can send the Ajax request passing in an array of options
father request.
The U R L.
We want to send the request to.
Is the script.
We just added.
We want to use the post method and we need to send the article idae to the page.
We do this in the data element like this.
You can add as many items in here as you like as this is the equivalent to inputs on a farm for example.
When the Ajax request is done the page returns a time element containing the new published date.
We want to replace the contents of this t d element with this data.
The button element is contained inside this t d element.
So the tedi element is the parent element of the button.
So first let's get the object that represents the button into a variable.
Then inside the done method we can call the parents method on the button object which returns an object
that represents the tedi elements.
Then we can call the h t a mail method passing in the data returned from the request.
This will replace the contents of the tedi element with the time element that comes back from the Ajax
request.
Let's give that a try.
If I click publish on one of the unpublished articles.
The button is changed to the published date and time and if we view that article we can see that it
has indeed been published.
Let's see exactly what's happening with the Ajax request with the network monitor feature of the Web
developer tools in this browser.
If I click the publish button we can see the request here.
We can see the parameters which is the article idae and the response that comes back.