We Keep Coding

Display openweathermap (API) data on website using AJAX and PHP

when i want enter a city here, nothing happens, no error in my console, i don't know why
this is my code :
ajax.js
$(document).ready(function(){
$('#submitLocation').click(function(){
//get value from input field
var city = $("#city").val();
$.post('PHP/controller.php', {variable: city});
//check not empty
if (city != ''){
$.ajax({
url: "PHP/router.php",
// url :"http://api.openweathermap.org/data/2.5/weather?q=" + city +"&lang=fr"+"&units=metric" + "&APPID=697edce53ba912538458a39d776ca24e",
type: "GET",
dataType: "jsonp",
success: function(data){
console.log(data);
console.log(data.weather[0].description);
console.log(data.main);
console.log(data.main.temp);
var information = show(data);
$("#show").html(information);
}
});
}else{
$('#error').html('Field cannot be empty');
}
});
})
function show(data){
return "<h3>Témpérature: "+ data.main.temp +"°C"+"</h3>" + "<h3>"+ data.weather[0].description +"</h3>";
}
this is my router.php, my js call the router
<?php
require('../PHP/controller.php');
if (isset($_GET['city'])) {
return getWeatherCity($_GET['city']);
}
else {
echo'Error';
}
?>
i know that i can do this only with js or only with php but i want use both of them.

Do you have any request happening in the "Requests" tab of your DevTool?
You should see a request towards PHP/router.php and the associated status code. Given that you might collect clues to debug what's going on.

AJAX is not working in macOS WebView

I have created a WebView for macOS app and it contains one AJAX call. The same WebView is working fine when the app calls my local URL, but when it calls the live URL, the AJAX call is not working.
$(document).ready(function () {
$('#pripolcheck').click(function () {
var pripolcheck = $('#pripolcheck').val();
var app = $('#app').val();
var user_id = $('#user_id').val();
var contact = $('#contact').val();
// Returns successful data submission message when the entered information is stored in database.
var dataString = 'pripolcheck1=' + pripolcheck + '&app1=' + app + '&user_id1=' + user_id;
if (pripolcheck == '') {
alert('Please Fill All Fields');
} else {
// AJAX Code To Submit Form.
$.ajax({
type: 'POST',
url: 'http://mywebsite.com/ajaxformsubmit.php',
data: dataString,
cache: false,
success: function (result) {
// alert(result);
// $(".pripol").hide();
$('.pripolcheck').prop('checked', true);
$('input.pripolcheck').attr('disabled', true);
}
});
}
return false;
});
});
My local PHP version is 7.1.8 and my live server PHP version is 5.4.

Change your function to onclick of checkbox directly,put this code in your checkbox onclick="MyFuncion",why I'm telling this is for web view we need to give exact command in exact position it's not a browser
And your AJAX call will be like below,
function myFunction()
{
var pripolcheck = $("#pripolcheck").val();
var app = $("#app").val();
var user_id = $("#user_id").val();
var contact = $("#contact").val();
// Returns successful data submission message when the entered information is stored in database.
var dataString = 'pripolcheck1='+ pripolcheck + '&app1='+ app + '&user_id1='+ user_id;
if(pripolcheck=='')
{
alert("Please Fill All Fields");
}
else
{
// AJAX Code To Submit Form.
$.ajax({
type: "POST",
url: "ajaxformsubmit.php",
data: dataString,
cache: false,
success: function(result){
// alert(result);
// $(".pripol").hide();
$('.pripolcheck').prop('checked', true);
$("input.pripolcheck").attr("disabled", true);
}
});
}
return false;
}

"My local PHP version is 7.1.8 and my live server PHP version is 5.4."
I think this explains everything.
However, try setting an absolute URL in your call:
url: 'ajaxformsubmit.php',
to
url: '/ajaxformsubmit.php',
Or whatever the actual path would be. Just a single slash will give you
http://wherever.com/ajaxformsubmit.php

if u use same site url plz use relative path not absolute path then its ok.
if use defrant site url plz comment me so give me new solution
PLZ try
$(document).ready(function () {
$('#pripolcheck').click(function () {
var pripolcheck = $('#pripolcheck').val();
var app = $('#app').val();
var user_id = $('#user_id').val();
var contact = $('#contact').val();
// Returns successful data submission message when the entered information is stored in database.
var dataString = 'pripolcheck1=' + pripolcheck + '&app1=' + app + '&user_id1=' + user_id;
if (pripolcheck == '') {
alert('Please Fill All Fields');
} else {
// AJAX Code To Submit Form.
$.ajax({
type: 'POST',
url: '/ajaxformsubmit.php',
data: dataString,
cache: false,
success: function (result) {
// alert(result);
// $(".pripol").hide();
$('.pripolcheck').prop('checked', true);
$('input.pripolcheck').attr('disabled', true);
}
});
}
return false;
});
});

Handle multiple ajax requests works only when alerted

I'm trying to send data to server from many lists in a page, each firing ajax data for PHP to process further. My code selects each lists using (class=dd) and send ajax data one by one. This works perfectly when I use alert(response) after ajax success, removing this alert message only sends less number of lists to server(only 2 lists are sent out of 4). Any thoughts?
$('#submit_sorting').on('click', function() {
var testEmail = /^[A-Z0-9._%+-]+#([A-Z0-9-]+\.)+[A-Z]{2,4}$/i;
if (testEmail.test($('#user_email').val()) || $('#user_email').val()==""){
$('[class=dd]').each(function(){
var data = $(this).nestable('serialize');
var dataJson = JSON.stringify(data);
console.log('sent '+JSON.stringify(data));
var response = ajaxx(data);
alert(response);
});
}
else
{
alert('enter valid email address');
}
});
and here is the ajax code
function ajaxx(data){
return $.ajax({
type: "POST",
url: 'cardsorting/update',
data: {
'new_order': data,
'user_comments':$('#user_comments').val(),
'user_email':$('#user_email').val(),
'_token':$('meta[name="_token"]').attr('content')
},
success: function(data){
if(data=='dataissaved'){
console.log('came here '+$(location).attr('href'));
}
else
{
console.log('received '+JSON.stringify(data));
}
},
error: function (data) {
alert('Could not connect to controller');
}
});
}

Here how it worked in the end, instead of sending multiple ajax requests for each selection, I collect them in an array and then ajax it to the backend php.
$('#submit_sorting').on('click', function() {
var sorting_array = new Array();
var testEmail = /^[A-Z0-9._%+-]+#([A-Z0-9-]+\.)+[A-Z]{2,4}$/i;
var flag = false;
if (testEmail.test($('#user_email').val()) || $('#user_email').val()==""){
$('[class=dd]').each(function(){
var data = $(this).nestable('serialize');
sorting_array.push(data);
console.log('sent '+JSON.stringify(data));
});
flag = true;
}
else
{
alert('enter valid email address');
}
if(flag){
ajaxx(sorting_array);
console.log(JSON.stringify(sorting_array));
}
});

Ajax event only working once

when i enter the wrong details and run it. it pops up with the error message, but if i then enter the correct details and click run it again. the sign in button changes to "Connecting..." as it should but then nothing else happens
$(document).ready(function() {
var width = ( $(".main").width() - 5);
if (width < 300) {
$(".logo-img").css({"width":width});
};
$("#error").hide();
$(function() {
$('#login').on('click', function(e){
e.preventDefault();
var token = $('#token').val();
var username = $('#username').val();
var password = $('#password').val();
var remember = $('#remember:checked').val();
$.ajax({
url: 'core/functions/ajaxLogin.php',
method: 'POST',
data: { 'username' : username,
'password' : password,
'remember' : remember,
'token' : token },
dataType: 'html',
cache: false,
beforeSend: function() { $('#login').val('Connecting...') },
success: function( data ) {
if (data == 'success') {
setTimeout( "window.location.href='backorderbook';", 500 );
} else if( data == 'userorpass' ) {
$('#error').fadeIn();
$('#error_message')
.html('username or password were entered incorrectly');
$('#error').delay(3500).fadeOut();
$('#login').val('Sign In');
};
}
});
});
});
});

Reason behind working once.
when your ajax fired, first thing to do is show connecting.. then when you get response which is data your statement says
if data == success //redirects
elseif data == userpass //show you have invalid username/password and clear html
So what if your data is not succes / userpass
it will just run your ajax beforeSend() and not will remove connecting that seems to you running once.
I recommend that your data should be an object and check if there's an error with the message on it , in short have it on your backend and just jquery show that message

There is a token generated when the login page is loaded and sent with the Ajax. But my PHP token system doesn't like the same token being sent over and over and blocks the request.

run your function with Fiddler .. and/or add the error parameter to your ajax... odds are your web request isn't a success.

How make a call to a function in views.py file in Django from ajax-html in template folder?

I am working with Django. I want to make a call to a function in views.py of an apps from html file which is template/app_name/login.html.
This function is called for login validation.
my code snippet:
index.html :
<script >
function subLogin()
{
var emailid = document.getElementById("emailid").value;
var password = document.getElementById("password").value;
if(emailid != "" && password != "")
{
if(emailid.length >= 4)
{
if(password.length >= 8)
{
$.ajax({
url: '/test/',
data: {'emailid': emailid, 'password': password},
type: 'POST',
dataType: 'json',
success: function(json) {
//alert(json['success']);
if(json['success'] == false)
{
if(json['email'] == false)
alert('The Email ID Provided is not correct!');
else
alert('The Email ID & Password Provided Do Not Match!');
}
def test(request):
logger.info("inside check password function....")
if (request.is_ajax()):
emailid = request.POST['emailid']
password = request.POST['password']
else:
emailid = ''
context = {'emailid':emailid}
return render(request, 'index.html', context)
This is my test function sitting in myapp/views.py file.
But unable to make this call from ajax.
I think I need to rectify the call from ajax code.
Suppose my views.py has "def test(request):" function.
So,I want to call this function from html file to this test() with email and password as post parameters.
Any help is highly appreciated.

Ajax requests are just like any other request. That is, you need a URL pointing to a view that returns an HttpResponse.