Ajax Failed to load resource: the server responded with a status of 404 (Not Found)

I'm trying to submit a form through AJAX to a .php file that will return either a true or false statement (eventually I will make this more complex but I am taking it one step at a time). Below is the code I am using:

jQuery("#claimform").submit(function(event) { event.preventDefault(); var $form = jQuery(this); var serializedData = $form.serialize(); var $inputs = $form.find("input, select, button, textarea"); $inputs.prop("disabled", true); //alert("The serializedData is: " + serializedData); //http://www.wetcheck.com.au/wp-content/plugins/mobivate-sms/claim_check.php"+serializedData jQuery.get("http://www.wetcheck.com.au/wp-content/plugins/mobivate-sms/claim_check.php?"+serializedData, function(data){ alert("Data: " + data); });

However when I try to run this code I get the following error:

Failed to load resource: the server responded with a status of 404 (Not Found) followed by the URL:

http://www.wetcheck.com.au/wp-content/plugins/mobivate-sms/claim_check.php?verification_c=423423&claim_id=7325&userid=90

The only problem is that the URL works! Yet no matter which ajax function I try (post/get/ajax) I always seem to come up with the same issue - that the server is responding with a status of 404 not found.

I have even tried to change

jQuery.get("http://www.wetcheck.com.au/wp-content/plugins/mobivate-sms/claim_check.php?"+serializedData, function(data){

to

jQuery.get("/wp-content/plugins/mobivate-sms/claim_check.php?"+serializedData, function(data){

and still it does not work.

Any input that anyone has for why this may be happening would be much appreciated.

Here is a screenshot of the error: https://prntscr.com/iim1zm

By the way I'm using Wordpress if that makes any difference.

I'm using jquery datatable with Json bind and server side processing enabled. I'm using it with an ASP.NET MVC project.

When I publish my app to IIS, I'm getting this error: Failed to load resource: the server responded with a status of 404 (Not Found), there is no error when i run my app on local in Visual Studio.

When I check the console log on the browser I see that error and I can see my parameter values in error sentences like start, length, draw. I think it means data returns with my mvc action code, but doesn't bind to datatable.

Please help, I need every idea of what is probably cause of that urgently, thanks a lot.

category: ajax failed Posted on2021-08-05

I am trying to extend a standard fiori app. After creating the extension project when i goto the extensibility pane, I am able to see only a blue empty screen. When i checked the F12 console i am able to see these many errors.

jquery-dbg.js:9203 Failed to load resource: the server responded with a status of 404 (Not Found)

ui5loader-dbg.js:1052 Failed to load resource: the server responded with a status of 404 (Not Found)

Uncaught Error: failed to load 'i2d/pp/mrpcockpit/reuse/library.js' from resources/i2d/pp/mrpcockpit/reuse/library.js: 404 - Not Found at makeNestedError

Please refer the attached screenshot.

Ajax Failed to load resource: the server responded with a status of 404 (Not Found)

Attachments

I'm new to Wordpress and Ajax and dont really know how to solve this problem, so any help would be appreciated.

I am working on a Wordpress Theme, where all students from a database are displayed in a table:

<?php get_header(); if(have_posts()): while(have_posts()) : the_post(); ?> <article class="post page"> <a href="<?php the_permalink(); ?>"><?php the_content(); ?> <!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" /> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> <style> } img { vertical-align: middle; } table { border-collapse: collapse; width: 100%; border-spacing: 50px 0; text-align: center; } .hover:hover{ background-color: antiquewhite; } td{ padding: 10px; } .aligncenter{ text-align: center; } div.scroll { position: static; width: 700px; height: 400px; overflow: scroll; overflow-x: hidden; } a { text-decoration: none; } </style> </head> <body> <div class="scroll"><a href="<?php the_permalink(); ?>"><?php the_content(); ?> </a> <?php $mysqli = NEW MySQLi('localhost','root','','wp_db'); if(isset($_GET['order'])){ $order = $_GET['order']; }else{ $order = 'name'; } if(isset($_GET['sort'])){ $sort = $_GET['sort']; }else{ $sort ='ASC'; } $result = $mysqli->query("SELECT * FROM wp_absolventen ORDER BY $order $sort"); $image = $row['bild']; if($result->num_rows > 0){ $sort == 'DESC' ? $sort = 'ASC' : $sort ='DESC'; // short IF statements ?> <div class="table-responsive" style=overflow-x:auto;> <table class="table table-bordered"> <?php echo " <th></th> <th class='aligncenter'> <a href='?order=name&&sort=$sort'>Name</a></th> <th class='aligncenter'><a href='?order=geburtsdatum&&sort=$sort'>Geburtsdatum</a></a></th> <th class='aligncenter'><a href='?order=stadt&&sort=$sort'>Wohnort</a></th> "; ?> <?php while($rows = $result->fetch_assoc()) { $name = $rows['name']; $geburtsdatum= $rows['geburtsdatum']; $stadt = $rows['stadt']; $p='<img src="data:image/jpg;base64,' . base64_encode( $rows['bild'] ) . '"/>'; $id = $rows['id']; ?> <tr class='hover'> <td> <?php echo $p; ?></td> <td><input type="button" name="view" value="<?php echo $name; ?>" id="<?php echo $row["id"]; ?>" class="btn btn-info btn-xs view_data" /></td> <td><?php echo $geburtsdatum; ?></td> <td><?php echo $stadt; ?></td> </tr> <?php } }else{ echo "No records returned."; } ?> </table> </div> </body> </html> </article> <div id="dataModal" class="modal fade"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">&times;</button> <h4 class="modal-title">Employee Details</h4> </div> <div class="modal-body" id="employee_detail"> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> </div> </div> </div> </div> <script> $(document).ready(function(){ $('.view_data').click(function(){ var employee_id = $(this).attr("id"); $.ajax({ url:"select.php", method:"post", data:{employee_id:employee_id}, succes:function(data){ $('#employee_detail').html(data); $('#dataModal').modal("show"); } }); }); }); </script> <?php endwhile; else : echo '<p>No contect found</p>'; endif; get_footer(); ?>

So far so good, but when you click on a students name, it should open a bootstrap modal, where the information about the student are displayed (fetched from Database).

<script> $(document).ready(function(){ $('.view_data').click(function(){ var employee_id = $(this).attr("id"); $.ajax({ url:"select.php", method:"post", data:{employee_id:employee_id}, succes:function(data){ $('#employee_detail').html(data); $('#dataModal').modal("show"); } }); }); }); </script>

This is the function that calls another php file (select.php),opens the modal and gets the information from the database. The select.php file:

<?php if(isset($_POST["employee_id"])) { $output = ''; $connect = mysqli_connect("localhost", "root", "", "wp_db"); $query = "SELECT * FROM wp_absolventen WHERE id = '".$_POST["employee_id"]."'"; $result = mysqli_query($connect, $query); $output .= ' <div class="table-responsive"> <table class="table table-bordered">'; while($row = mysqli_fetch_array($result)) { $output .= ' <tr> <td width="30%"><label>Name</label></td> <td width="70%">'.$row["name"].'</td> </tr> '; } $output .= "</table></div>"; echo $output; } ?>

But when I try to click on the students name, the modal doesnt open, instead I get this 404 error: Failed to load resource: the server responded with a status http://localhost/wordpress/sample-page/select.php of 404 (Not Found). Both files are in the same folder.

The code works when its not in a wordpress folder.

M.M.

Solutions

Try sending the file path using data attribute so below line

<td><input type="button" name="view" value="<?php echo $name; ?>" id="<?php echo $row["id"]; ?>" class="btn btn-info btn-xs view_data" /></td>

can be

<td><input type="button" name="view" value="<?php echo $name; ?>" id="<?php echo $row["id"]; ?>" class="btn btn-info btn-xs view_data" data-file="<?php echo get_template_directory() . '/select.php'; ?>" /></td>


And below line,

url:"select.php",

can be

url: $(this).data('file'),

I haven't tested from my side. But this is just an idea for your way of code.

EDITED:

<td><input type="button" name="view" value="<?php echo $name; ?>" id="<?php echo $row["id"]; ?>" class="btn btn-info btn-xs view_data" /></td>

can be

<td><input type="button" name="view" value="<?php echo $name; ?>" id="<?php echo $row["id"]; ?>" class="btn btn-info btn-xs view_data" data-file="<?php echo get_template_directory_uri() . '/select.php'; ?>" /></td>


And below line,

url:"select.php",

can be

url: $(this).data('file'),

Saving the php file as page-select.php and creating a blank page named "select" in the Wordpress pages did the trick! Although instead of url: "/select" I used only "select" and it worked! Thanks again for your time Anthony and Thirumani guhan!:)

I answered similar question from a different thread... Basically, establish/write a simple php file and if you can access it directly via browser, then you call it via ajax.... The set up is prefixing the file name with page-"title-of-page".php, then create a blank page with "title-of-page" similar to the aforementioned convention, and then set up your permalinks url. Here's the other thread.

Similar questions

Failed to load resource: the server responded with a status of 409

After an automatic WordPress update the plugin forms (Contact Form 7) now display a slash just below them and are no longer firing the wpcf7mailsent listener event, so it is no longer being redirected to the thanks page after submitting the form. This error: “the server responded with a status of 409 or also known as net :: ERR_ABORTED 409” from wh...

AJAX jQuery post frontend returning failed to load resource status 400

I've created a custom post template for a front-end question bank/quiz in which I have two elements: Code in functions.php The code I have in my custom post template is as following: I have a separate js file stored in my-child-theme/js/question-refresh.js I think I have isolated where the issue is coming from. I have obviously done something wrong...

Failed to load resource:404 image

website is http://pleevi.com. when i look on the problems with the website, i get this. http://i.imgur.com/aHQky.png here is the entire list of what i get as i cannot post more than 2 hyper links :( none of the images on my website will load. strange thing is that on my computer the images show up and everything is normal, but when i go to another ...

WordPress Site Error failed to open stream: HTTP request failed! HTTP/1.1 404 Not Found

I am trying to open a WordPress site on an external server for which I do not have a domain yet using its ip address and an adjusted HOST file on my Mac to check it on the server. When I access the site I get errors like: I did find some articles on the same issues like this one. The issues is not that the path is wrong or the file is not there. It...

Also ask

How do I fix failed to load the resource The server responded with a status 404?

The only way to fix this is to make sure that the CSS and JS files are properly linked within the HTML. Check whether the folder, file and directory name of these files are spelt correctly. Another way to fix this is by using an absolute URL instead of a relative URL.

What is the meaning of 404 status code in Ajax?

There is an easy way to check: Open your HTML in the browser, remove the last bit of the path, and replace it with "busca-notas. jpg", and see what you're getting. A 404 also means, your JSP code never gets executed.

Why is Ajax success not working?

ajax post method. The reason was my response was not in the JSON format so there was no need for the dataType: 'json' line in the submit method. In my case, the returned response was in text format that's why it was not going to success event. Solution: Remove dataType: 'json' line.