I am trying to delete a post when clicking the (x) icon using Ajax request
here is my html code relating to this part :
I copied the JS and php parts from google , I've never written an Ajax request before
so I cannot figure out where I did wrong, please help
It seems that you have a problem with the right location of the php file.
It seems to be located on /static/delete.php, but you are calling /post/delete.php.
Other than that, you are not (at the moment) using DELETE, but POST.
Some frameworks use the POST as the method, but require some extra field (like _method on Laravel) to be present on the form, as some (if not all) HTTP servers do not accept methods other than GET or POST
$('#btnDeleteEmployees').click(function () {
$.ajax({
url: '/api/employees' + empID,
method: 'DELETE',
headers: {
"Content-Type": "application/json"
},
success: function (res) {
},
error: function (res) {
}
});
});
Related
I'm trying to create a simple "Register your interest" action. I have the front end working but I'm not sure how to link the AJAX to the PHP file. Where do I put the PHP file?
My current code for the AJAX is:
$.ajax({
url: "register-interest.php",
type: "GET",
dataType: "json",
data: {
type : "registerInterest",
email : userEmailLog,
user : userNameLog,
product : productTitle,
sku : productSku
},
success: function (response) {
JSON.stringify(response);
},
error: function (err) {
JSON.stringify(err);
},
complete : function() {
//$('.user-accept').addClass('unhide');
loading();
}
});
First you check url variable is correct or not and then provide response any data like
success: function (response) {
JSON.stringify(response);
},
Your url value is:
"register-interest.php"
This implies that the php file that processes the AJAX request needs to be available at the same directory level as the page that includes the javascript file that is performing the AJAX request.
Example:
If your page is at http://example.com/my/ajax/page.html
Then the javascript will perform the AJAX request to the URL http://example.com/my/ajax/register-interest.php
Alternatively if you change the JS url value to read "/register-interest.php", then the AJAX request will be made to: http://example.com/register-interest.php
Where you need to put it on your server depends on how your web server's webroot's folder structure is organised, but you should be able to work back from the URL the javascript will be requesting to work this out.
I just started learning AngularJS and will be using PHP for the backend.
I got the basics of Angular working, but now I'm at the point of form submission. Now I'm thinking that I could just do an $.ajax({...}); call to a PHP file and include that function at the bottom of my view.
However, I see there are other ways using controllers, which I'm researching; I just want to know if that would be considered bad practice or if there is a simple way to transition from one method to the other.
Thanks.
EDIT:
Here's what I did now and it's working great in my opinion. Doesn't hurt the integrity of Angular, the form submits, and all is good. Is there a downside to this:
function submitNewPatient(){
$.ajax({
url: 'ajax/patients/new_patient.php',
type: 'post',
data: $("#new_patient_form").serialize(),
success: function()
{
$("#new_patient_form")[0].reset();
}, error: function()
{
alert('something went wrong');
}
});
}
You'll want to look into the $http method.
Here's an example:
$http.post('api/user', {params: {id: '5'}
}).success(function(data, status, headers, config) {
// Do something successful.
}).error(function(data, status, headers, config) {
// Handle the error
});
Along with .get the $http service has .head, .post, .delete, .put, .jsonp. In your case $http.post, the params and URL in the example above evaluate to api/user?id=5
Also, forms in Angular come with an ng-submit directive which is very useful for calling a function on submission. The ng-submit prevents the browser from its default POST action. This way you can use it to call a function on the controller attached to the view.
<form ng-submit="sendForm()" ng-controller="FormSubmission">
<button>send form!</button>
</form>
I have the below function that I used in two different pages and worked perfectly in both cases. Suddenly my pages stopped updating and I got the error $.ajax not a function.
function update_report(data) {
var request = $.ajax({
url: "report?poids="+data,
type: "GET",
dataType: "html"
});
request.done(function(msg) {
$("#yw2").html(msg);
});
request.fail(function(jqXHR, textStatus) {
alert( "Request failed: " + textStatus );
});
req ="a";
}
I then changed the $ to jQuery. Then it started sending AJAX requests but it didnt get the relative URL. Like I was generating the request from a page like /index.php/link1 and my code was sending request to /index.php/report rather then /index.php/link1/report
So, then I changed my url: to "link1/report=?"+data then it started sending request to the right page but couldnt update the response as it didnt find the div #id. Got error
TypeError: $(...) is null
What can cause all this issue and how to fix this? And why $.ajax suddenly stopped working, though I didnt make any changes?
JQuery can be not available by $.ajax(). Check if jQuery.ajax() is available or you included jquery twice.
You should not require jquery manually. The best way to include jquery is using Yii::app()->clientScript->registerCoreScript('jquery'). Path for library is set in config/main.php.
PJAX's documentation states that Github uses $.pjax.submit() in submitting a Gist form. A desired feature of an ajax form submission which Github nicely implements is that the URL redirects from the form's action to a newly created URL (in this case, one containing the newly server-side created gist ID).
For example, from this:
https://gist.github.com/gists // form action
to this:
https://gist.github.com/tim-peterson/5019589 //assume this ID is generated server side
I've gotten this to work similarly on my site (i.e., the page itself redirects to the equivalent of https://gist.github.com/tim-peterson/5019589) but I can't redirect the URL (it stays like https://gist.github.com/gists).
Is this entirely a server-side issue (setting headers?) or is there something in pjax that I'm missing? I'm using a version of pjax I downloaded today so it can't be that i'm using a buggier version of pjax.
Did you find any solution to this?
I had the similar issue.
Basically you need to set X-PJAX-URL property in response header.
It's value should be same as Request URL.
In Laravel, I did it like this...
App::after(function($request, $response)
{
$response->headers->set('X-PJAX-URL', $request->getRequestUri());
});
There may be a more-elegant / proper way to do this with $.pjax.submit(), but this is the solution I've been using without any problems. I serialize the form inputs prior to submission, then POST them to my server. Then check the reply from the server to make sure I don't need to prevent the user from going forward before calling my PJAX to continue.
$("#save").click(function(e) {
e.preventDefault();
dataString = $("#form").serialize();
$.ajax({
type: "POST",
url: $("#form").attr("action"),
data: dataString,
dataType: "json",
success: function(data)
{
// Handle the server response (display errors if necessary)
$.pjax({
timeout: 2000,
url: data.url,
container: '#main-content'
});
}
});
});
It happens if response HTML doesn't contain initial PJAX container
i create one simple form in which i have one combobox when i am selecting any thing i put one function onchange event so its call.
then i send this data in one helper file through jquery
<script type="text/javascript">
$.noConflict();
function Searchwine(obj,str) {
{queryString: ""+str+""}, function(data){
jQuery.post("http://www.site.com/search/helper/autosuggest.php", {queryString: ""+str+""}, function(data){
if(data.length >0) {
jQuery('#windatano').html(data);
}
</script>
i am using this code for post data in autosuggest from through javascript and print replay of jquery in windatano id
--> its working fine in crome and ff and other all browser but in IE its not working
Can any help?
Thanks,
You're using jQuery improperly.
The proper syntax is (for POST)
$.post([URL], {
var: value,
var2: value
}, function(data) {
//callback goes here
}
);
If you want to pass in the querystring as though it's a GET, just append it to the URL after a ?.
E.G.:
"http://www.site.com/search/helper/autosuggest.php?" + str
IE does not support cross domain ajax calls regardless if its getJSON or not. learned that the hard way... i ended up adding a local php file that used curl to get the results and return them to the script, its the only way to make ie work with cross domain requests.
You can't do cross domain ajax requests, if the request url is in another domain, this fail, if the domain is the same, use a relative path:
jQuery.post("/search/helper/autosuggest.php"....
If you need Cross domain ajax request, you have to use jsonp (http://api.jquery.com/jQuery.getJSON/#jsonp)
And if you are using post method, the queryString define a get vars, you need use data option
jQuery.ajax({
url: '/search/helper/autosuggest.php',
type: 'POST',
data: data,
sucess: function (data) {
if (data) jQuery('#windatano').html(data);
}
});
When data can be the object format:
var data = {
a_var = 'value',
other_var: 'other value'
};
Sorry my English