document.querySelector('#select').addEventListener("change", function() {
var confirm = confirm("Do you want to update data?");
if (confirm == true) {
if (this.value == "1") {
$.ajax({
url: "update.php",
type: "POST",
data: {
id: <?php echo $row['serial']?>,
type: "pending"
},
cache: false,
success: function(dataResult){
var dataResult = JSON.parse(dataResult);
if(dataResult.statusCode==200){
alert("Successfully updated");
location.replace("../deposit/");
}
else if(dataResult.statusCode==201){
alert("Something went wrong");
}else{
alert("Everything went wrong");
}
}
});
}else if(this.value == "2"){
$.ajax({
url: "update.php",
type: "POST",
data: {
id: <?php echo $row['serial']?>,
type: "succeed"
},
cache: false,
success: function(dataResult){
var dataResult = JSON.parse(dataResult);
if(dataResult.statusCode==200){
alert("Successfully updated");
location.replace("../deposit/");
}
else if(dataResult.statusCode==201){
alert("Something went wrong");
}else{
alert("Everything went wrong");
}
}
});
}else if(this.value=="3"){
$.ajax({
url: "update.php",
type: "POST",
data: {
id: <?php echo $row['serial']?>,
type: "canceled"
},
cache: false,
success: function(dataResult){
var dataResult = JSON.parse(dataResult);
if(dataResult.statusCode==200){
alert("Successfully updated");
location.replace("../deposit/");
}
else if(dataResult.statusCode==201){
alert("Something went wrong");
}else{
alert("Everything went wrong");
}
}
});
}else{
console.log("Update canceled");
}
}
});
I added a confirmation dialog while user changes option. When I run the code, and changed option I am not getting any confirmation dialog but, when I was working without confirmation dialog everything was working fine. Why it's happening? I got error in console Uncaught TypeError: confirm is not a function at HTMLSelectElement.<anonymous> I was looking at w3schools courses but, i am unable to understand anything
You can use window.confirm as it is a global function exposed to Window.
https://developer.mozilla.org/en-US/docs/Web/API/Window/confirm
You can also change your code to just this (you don't need the var confirm. This is also the issue, since you use confirm twice, but for different purposes.
if (confirm("Do you want to update data?")) {
If you do want the variable, use the standard naming convention for booleans, which is to add "is", "has","can" or "should" before the variable name:
var hasConfirmed = confirm("Do you want to update data?");
if (hasConfirmed == true) {
You should avoid using the name of HTML and Window objects and properties:
https://www.w3schools.com/js/js_reserved.asp
don't use confirm use ConfirmDialog or something!
Related
My problem is that when I press yes on delete confirmation the db record goes away, but if I refresh the page it comes back.
Maybe I have to put the language and the id inside the Ajax URL?
If yes how can I do this?
Please forgive me I am still learning.
This is for java eclipse and SQL database
var assetId;
var batchId;
function cancelOpname(){
$.ajax({
type: "POST",
cache: false,
url: urlPage + "opname/cancel",
dataType: "JSON",
data: data,
beforeSend: function() {
$('.loader').fadeIn();
},
complete: function() {
$('.loader').fadeOut();
},
success: function() {
if (data.errorResult == false) {
console.log("Success: else ");
javascript:window.history.back();
} else {
$('.loader').fadeOut();
}
},
error : function(e) {
console.log("ERROR: ", e);
}
});
}
no error but ajax and jQuery not working
I'm in a bit of braiunfreeze here, puzzling for hours.
In a Paypal REST success section, i am trying to call a function. Before I moved it to the REST section I tested with a regular button onclick event. Worked fine.
Here the code:
...
onAuthorize: function(data, actions) {
return actions.payment.execute()
.then(function() {
// window.alert('Payment Complete!');
$.ajax({
type: "POST",
url: 'functions.php',
//dataType: "json",
data: {cuf_credits: '<?php echo $cuf_credits; ?>'},
success: function(data){
console.log(data);
$("#output").text("Thanks for buying " + data.cuf_credits + " credits");
}
});
// Show a thank-you note
document.querySelector('#paypal-button-container').style.display = 'none';
document.querySelector('#thanks').style.display = 'block';
document.querySelector('#orderdetails').style.display = 'none';
});
}
...
The query selectors are filled in fine, so is some basic text in the jQuery success section They return "undefined" though, but that is fine, I'm just trying to SEND, not GET back data.
The functions inside the functions.php are not executed, but when I use it in this code, it is:
var testme = document.getElementById('test');
testme.onclick = function () {
console.log('Test Started');
$.ajax({
type: "POST",
url: 'functions.php',
data: {cuf_credits: '<?php echo $cuf_credits; ?>'},
success: function(data){
console.log(data);
}
});
function error(err) {
console.log('Not Closed!');
}
};
If anybody could point me back in the right direction, that'd be awesome!
Let's try some debugging...
Modify your AJAX block like so:
...
onAuthorize: function(data, actions) {
return actions.payment.execute()
.then(function() {
// window.alert('Payment Complete!');
//check to make sure your code is getting this far
////////start debug
console.log("Calling AJAX...");
////////end debug
$.ajax({
type: "POST",
url: 'functions.php',
//dataType: "json",
data: {cuf_credits: '<?php echo $cuf_credits; ?>'},
success: function(data){
console.log(data);
$("#output").text("Thanks for buying " + data.cuf_credits + " credits");
}
//add a 'complete' function to get the status of the call
////////start debug
complete: function(obj, textStatus){
console.log("AJAX Status: " + textStatus);
}
////////end debug
});
// Show a thank-you note
document.querySelector('#paypal-button-container').style.display = 'none';
document.querySelector('#thanks').style.display = 'block';
document.querySelector('#orderdetails').style.display = 'none';
});
}
...
Let me know what your console log looks like after trying this...
I tried hardcoding the variables and noticed they work fine then. Sorry for the mishap, seems to work okay after a couple hours of not looking at it and taking another approach. Again, I apologize.
// Alert is not working on error message , I want to insert only few 4 issue after that it should not work.
success: function(msg, String, jqXHR) {
window.location = 'home.html';
$("#result").html(msg, String, jqXHR)
alert("Data Uploaded: ");
if (msg.success == 'Error') {
alert("Please close the previous issue");
window.location = 'home.html';
}
// here (msg.success=='Error') is not working i want to display this message - "Please close the previous issue" on this .
Hope this works for you.
$(document).ready(function(){
$('#your_form').submit(function(event) {
event.preventDefault();
dataString = $("#your_form").serialize();
$.ajax({
type: "post",
url: "post.php",
dataType:"json",
data: dataString,
success: function (response) {
if(response.status === "success") {
// do something with response.message or whatever other data on success
alert("Data Uploaded: ");
window.location='home.html';
} else if(response.status === "error") {
alert("Please close the previous issue");
window.location='home.html';
}
}
})
return false;
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
My Code:
<script>
$('#form').submit(function() {
$.ajax({
type: 'POST',
url: $(this).attr('action'),
dataType: 'json',
success: function(json) {
window.location.href = "http://www.example.com";
}
});
return false;
});
</script>
The FORM:
<form id="form" class="center" action="http://localhost/products/index.php?route=checkout/cart/add" method="post">
<input type="text" name="cname">
<input type="hidden" name="product_id" value="51">
<input type="submit">
</form>
When the form presses submit it goes to the action page which is just a JSON success message, what I want to do is redirect to a different page other than the action page, but my code does not seem to be working?
What exactly is wrong with my code, can someone help me fix it?
I would be so grateful if you could help me out, many thanks!
You aren't posting any data which makes a POST fairly useless .
Also you have no error handler either
Try:
$(function(){
$('#form').submit(function() {
var $form = $(this);
$.ajax({
type: 'POST',
url: $form.attr('action'),
// data to send
data: $form.serialize(),
dataType: 'json',
success: function(json) {
window.location.href = "http://www.example.com";
},
error: function(){
// do something when request fails - See $.ajax docs
}
})
return false;
});
});
You can used this code for error handling! You also check this question on stackOverflow for redirecting to another page using jQuery/JavaScript:
click here
$('#form').submit(function() {
var $form = $(this);
$.ajax({
type: 'POST',
url: $form.attr('action'),
// data to send
data: $form.serialize(),
dataType: 'json',
success: function(json) {
window.location.href = "http://www.example.com";
},
error: function (jqXHR, exception) {
var msg = '';
if (jqXHR.status === 0) {
msg = 'Not connect.\n Verify Network.';
} else if (jqXHR.status == 404) {
msg = 'Requested page not found. [404]';
} else if (jqXHR.status == 500) {
msg = 'Internal Server Error [500].';
} else if (exception === 'parsererror') {
msg = 'Requested JSON parse failed.';
} else if (exception === 'timeout') {
msg = 'Time out error.';
} else if (exception === 'abort') {
msg = 'Ajax request aborted.';
} else {
msg = 'Uncaught Error.\n' + jqXHR.responseText;
}
alert(msg);
},
});
});
You need to have separate error and success handlerS like below.
In success method you can redirect to other pages/sites (window.location.href = "http://www.EXAMPLE.com";)
var ajaxUpdateRequest = {
url: '/dotnethelpers/UpdateUsers',
dataType: 'json',
success: updateSuccessfully, //Separate method for handling success
error: showError //Separate method for handling error
};
I had a working jQuery ajax call but i wanted to check the result of the request so i added
success: function(data) {
if(data.status == 'success'){
alert("Thank you for subscribing!");
}else if(data.status == 'error'){
alert("Error on query!");
}
}
but this is not working and made my whole function stop working even.so here is the whole function,can some one tell me what am doing wrong`
function addGoal() {
var description = $('.description').val();
var measure = $('.measure').val();
if( description.trim() && measure.trim() ){
if(window.confirm("Are you sure? You can't edit or remove goal(s) you have added here.")==true) {
$.ajax({
url: '${g.createLink( controller:'review', action:'saveGoal', params:[id: params.id] )}',
data: {
"description": description,
"measure": measure
},
success: function(data) {
if(data.status == 'success'){
alert("Thank you for subscribing!");
}else if(data.status == 'error'){
alert("Error on query!");
}
}
type: 'POST'
});
}
}else {
showErrorMessage("Description and Measure fields cant be empty");
}
}`
when i remove the success it works as i expected it to.And if it matters am using grails
There is a syntax error which is a missing comma
function addGoal() {
var description = $('.description').val();
var measure = $('.measure').val();
if( description.trim() && measure.trim() ){
if(window.confirm("Are you sure? You can't edit or remove goal(s) you have added here.")==true) {
$.ajax({
url: '${g.createLink( controller:'review', dataType: "json", action:'saveGoal', params:[id: params.id] )}',
data: {
"description": description,
"measure": measure
},
success: function(data) {
if(data.status == 'success'){
alert("Thank you for subscribing!");
}else if(data.status == 'error'){
alert("Error on query!");
}
},
type: 'POST'
});
}
}else {
showErrorMessage("Description and Measure fields cant be empty");
}
}`
This will fix the issue