JQuery AJAX script not saving

Question

Newbie here, I am working with these two jquery scripts for the whole day now. When I fire the first script the second script won't work.

The first script checks whether a certain product name is already existing in the database, while the second script is the function to save the data entries on the database.

When I fire the first script it works perfectly fine. When the product name is existing it disables the save product button, When the product name is available it enables the save button.

If there are no conflicts on the data entries, you can save the details on the database, but when I fire the script to save it to database(which is the second script below) it doesn't work.

Below is my code.

First Script:

$('#prod_name').on('focusout',function(){
var prodname = $('#prod_name').val();
var compid = $('#compid').val();
$.ajax({
 url : 'php/ajax.php',
 type : 'POST',
 async : false,
 data : {
 check : 1,
 compid : compid,
 pname : prodname
 },
 success: function(result){
 if (result==1) {
 alert('Product Name Already Exists! Please rename the product or give the product name a prefix');
 $('#save_prod').prop('disabled',true);
 }else{
 $('#save_prod').prop('disabled',false);
 } 
 }
 });
});

second script

$('#save_prod').on('click', function(event){
event.preventDefault();
var prodname = $('#prod_name').val();
var prodcat = $('#prod_category').val();
var prodpo = $('#prod_po').val();
var prodbrand = $('#prod_brand').val();
var produnit = $('#prod_unit').val();
var compid = $('#compid').val();
var prodcmf = $('#prod_color').val();
var prodtech = $('#prod_spec').val();
var prodship = $('#prod_ship').val();
if(prodname == ""){
 alert('Enter Product Name');
}else if(prodcat == ""){
 alert('Select Product Category');
}else if(produnit == ""){
 alert('Please select Unit');
}else if(prodpo == ""){
 alert('Enter PO Number (if not applicable please input N/A)');
}else if(prodbrand == ""){
 alert('Enter Product Brand (if not applicable please input N/A)');
}else if(prodcmf == ""){
 alert('Define Color/Material/Finish (if not applicable please input N/A)');
}else if(prodtech == ""){
 alert('Define Technical Specifications/Rating (if not applicable please input N/A)');
}else if(prodship == ""){
 alert('Define Shipping Mark (if not applicable please input N/A)');
}else{
 $.ajax({
 url : 'php/ajax.php',
 type : 'POST',
 async : false,
 data : {
 prodsave : 1,
 compid : compid,
 pname : prodname,
 pcat : prodcat,
 punit : produnit,
 ppo : prodpo,
 pbrand : prodbrand,
 pcmf : prodcmf,
 ptech : prodtech,
 pship : prodship
 },
 success: function(result){
 if (result == 0) {
 var new_prod = $('#prod_name').val();
 $('#name_of_product').append('<option value="'+new_prod+ '">'+new_prod+'</option>');
 $('#name_of_product').trigger("chosen:updated");
 alert('New Product details has been saved!');
 $('#prod_name').val("");
 $('#prod_category').val("");
 $('#prod_po').val("");
 $('#prod_brand').val("");
 $('#prod_unit').val("")
 $('#compid').val("");
 $('#prod_color').val("");
 $('#prod_spec').val("");
 $('#prod_ship').val("");
 $('#bgw').hide(500);
 $('#bgb').hide(500);
 }else if(result == 1){
 alert('There was a problem saving the product details. Pelase try again later.');
 }else if (result == 2) {
 alert("Please fill in all fields");
 }else if(result == 3){
 alert("Product Name already exists! Please press cancel and select from the list or if you are adding a new product, give the product a different name.");
 } 
 }
 });
}
});

Any help would be gladly appreciated.

Thanks guys!!

• Rory McCrossan: The question is a little vague. Note that if you disable an element (as your first script does) then no event can be raised on it.
• Manik Arora: Try setting cache: false in both the ajax requests
• Manik Arora: That's wonderful, should I add it as answer? :)

Answer 1

I saw that you have same url i.e. php/ajax.php in both of your ajax scripts, sometimes browsers caches the response of the ajax and blocks the preceding ajax requests to the same url considering the requests as repetitive.

So for such cases always use - cache: false, so that the browser considers the each request a new request and does not caches or blocks it.