Charts in Dashboard should update after form submission - javascript

I am showing default charts on my dashboard and there is a form also and I want to update/filter the charts after the form submission.
Js code:
$(document).ready(function() {
$.ajax({
url: (contextPath + "/setting/dashboard"),
success: function(result){
drawLineChart()
}
}
});
$("#chartupdate").submit(function(e){
e.preventDefault();
var form = $(this);
var url = form.attr('action') ;
$.ajax({
url: url,
type: "POST",
data: form.serialize(),
success: function(data){
console.log("form" + data);
}
}) ;
}); });

A bracket inline 9 was preventing the execution of .submit function. Remove the bracket
$(document).ready(function() {
$.ajax({
url: (contextPath + "/setting/dashboard"),
success: function(result){
drawLineChart()
}
});
$("#chartupdate").submit(function(e){
e.preventDefault();
var form = $(this);
var url = form.attr('action') ;
$.ajax({
url: url,
type: "POST",
data: form.serialize(),
success: function(data){
console.log("form" + data);
}
}) ;
});
});

Related

How to do Ajax requests?

Am trying to make wikipedia viewer for my freecodecamp project. But the ajax request fails every time. It does not return anything.
var url, value;
$(document).ready(function() {
$("button").on("click", function() {
value = $("input").val();
var url = "https://en.wikipedia.org/w/api.php?action=opensearch&search=" +
value + "&format=json&callback=?";
$.ajax({
type: "GET",
url: url,
async: false,
dataType: "json",
//jsonp: "callback",
success: function(data) {
console.log(data);
}
});
});
});
set dataType: 'jsonp'
remove &callback=? from the url (that's the default that jQuery will use anyway
example
var value = "google";
var url = 'https://en.wikipedia.org/w/api.php?action=opensearch&search='+ value + '&format=json';
$.ajax({
type: 'GET',
url: url,
dataType: 'jsonp',
success: function (data)
{
console.log(data);
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Use this code:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="search" /><br /><br />
<button>Click here</button>
<script>
var url, value;
$(document).ready(function() {
$("button").on("click", function() {
value = $("input").val();
var url = "https://en.wikipedia.org/w/api.php?action=opensearch&search=" +
value + "&format=json";
$.ajax({
type: "GET",
url: url,
async: false,
dataType: "jsonp",
success: function(data) {
console.log(data);
}
});
});
});
</script>

Something wrong with ajax call, cannot figure out what

Trying to make a simple ajax call but I'm not able to console.log the response.
Navigating to the url in browser gives back data, but still.
I'm not seeing the error alert either, so it should not be failing?
Code:
var $searchBox = $('#search');
var $searchButton = $('#button');
$searchButton.on('click', function(){
var url = "https://en.wikipedia.org/w/api.php?action=opensearch&search="
+ $searchBox.val() + "&format=json&callback=?";
console.log(url);
$.ajax({
type: 'GET',
url: url,
async: false,
dataType: 'json',
success: function(data){
console.log(data);
},
error: function(errorMessage){
alert('Error');
}
});
});
To prevent click default redirection, you can use e.preventDefault() event.
var $searchBox = $('#search');
var $searchButton = $('#button');
$searchButton.on('click', function(e){
e.preventDefault();
var url = "https://en.wikipedia.org/w/api.php?action=opensearch&search="
+ $searchBox.val() + "&format=json&callback=?";
console.log(url);
$.ajax({
type: 'GET',
url: url,
async: false,
dataType: 'json',
success: function(data){
console.log(data);
},
error: function(errorMessage){
alert('Error');
}
});
});

JSP AJAX return NULL

i using JQuery Ajax to call REST api in jsp but it return null no matter how i call but it can work in html. is there any way to solve this problem. Cant seem to find a solution in the net.
$(document).ready(function () {
alert('ready');
var accessKey = 'xkg8VRu6Ol+gMH+SUamkRIEB7fKzhwMvfMo/2U8UJcFhdvR4yN1GutmUIA3A6r3LDhot215OVVkZvNRzjl28TNUZgYFSswOi';
var thisUrl = 'http://www.onemap.sg/API/services.svc/getToken?accessKEY=' + accessKey;
$.ajax({
type: "GET",
url: thisUrl,
dataType: 'application/json',
success: function (data) {
alert('data is:' + data.GetToken[0].NewToken);
}
});
alert(thisUrl);
});
dataType should be jsonp
$(document).ready(function () {
var thisUrl = 'http://www.onemap.sg/API/services.svc/getToken?accessKEY=' + accessKey;
$.ajax({
type: "GET",
url: thisUrl,
dataType: 'jsonp',
success: function (data) {
console.log(data)
alert('data is:' + data.GetToken[0].NewToken);
}
});
});
Refer to this article:
http://www.isgoodstuff.com/2012/07/22/cross-domain-xml-using-jquery/
You only need "jquery.xdomainajax.js" that is there in the sample source-code to make it work.
$.ajax({
url: 'https://asdf/asdf',
dataType: "xml",
type: 'GET',
success: function(res) {
var myXML = res.responseText;
alert(myXML);
}
});

how send variable in other form is this code is correct?

$("#delete").click(function() {
deleterecord();
});
function deleterecord(){
var id = $("#iduser").val();
alert("aw"+id);
var id = $('#iduser').attr();
e.preventDefault();
pressed = "delete"
$.ajax({
type: "post",
url: "IngSave.php",
data: "&idshit="+ id,
data: "&gagawin="+ pressed,
success: function(){
alert("ATTENTION");
$("#usertbl").html(data);
}
});
return false;
}
I'm not getting the variables $_POST['idshit']; and $_POST['gagawin']; in IngSave.php file.
Try this:
$.ajax({
type: "post",
url: "IngSave.php",
data: {idshit:id,gagawin:pressed},
success: function(){
alert("bitch");
$("#usertbl").html(data);
}
});
You have two data params incorrectly in your ajax call, change it to
$.ajax({
type: "post",
url: "IngSave.php",
data: "idshit="+id+"&gagawin="+pressed, // or - { idshit:id,gagawin:pressed }
success: function(){
alert("bitch");
$("#usertbl").html(data);
}
});

jQuery var doesn't change

I have an AJAX registration form:
var id = null;
$.ajax({
type: 'POST',
url: requestUrl,
data: $(".defaultRequest").serialize(),
dataType: 'json',
success: function(data) {
if(data.response){
$('div.errormsg').remove();
if(data.step){
openStep(data.step);
}else{
openStep('next');
}
}else{
$('div.errormsg').remove();
$('<div class="errormsg">'+data.message+"</div>").insertBefore(form);
}
}
});
When a user is successful registered, I want to show him his unique ID, but it stays NULL. How can I solve it?
<script type="text/javascript">
$('#linkkk').text('Your id is: '+id+'');
</script>
you need to set id first in success callback.
$.ajax({
type: 'POST',
url: requestUrl,
data: $(".defaultRequest").serialize(),
dataType: 'json',
success: function(data) {
if(data.response){
$('div.errormsg').remove();
if (data.step) {
openStep(data.step);
} else {
openStep('next');
}
$('#linkkk').text('Your id is: ' + data.id);
} else {
$('div.errormsg').remove();
$('<div class="errormsg">'+data.message+"</div>").insertBefore(form);
}
}
});

Categories

Resources