JQuery url construction trouble - javascript

I am trying to load a website into a div (div.content).
The website requires a login via a POST.
The javascript tries to load the site, detects the redirect to the login form, POSTs the username and password and finally reloads the url since authentication was succesful.
Now the problem is that the url is not constructed correctly. The url should be like this :
https://mysite.com/WebUntis/index.do?school=schoolname#Timetable?
onlyTimetable=true&ajaxCommand=renderTimetable&date=20130418&type=1&id=17
&formatId=2&departmentId=-1&buildingId=-1
but the jquery builds it like this:
https://mysite.com/WebUntis/index.do?
onlyTimetable=true&ajaxCommand=renderTimetable&date=20130418&type=1&id=17
&formatId=2&departmentId=-1&buildingId=-1.
Can somebody help me out here? I checked the syntax by looking at a lot of examples, but I am unable to find the fix.
function openUrl()
{
jQuery.ajax({
url: 'https://mysite.com/WebUntis/index.do?school=schoolname#Timetable?',
type:'GET',
dataType: 'html',
data: {
//school: 'schoolname',
ajaxCommand: 'renderTimetable',
onlyTimetable: 'true',
date: '20130418',
type: '1',
id: '17',
formatId: '2',
departmentId: '-1',
buildingId: '-1'
},
success: function(result) {
var html = jQuery('<div>').html(result);
if(html.find("form").attr("id") == "login")//login form found
{
alert("Trying to login...");
login(); //This just POSTs a username and password
};
$('div.content').html(result);
},
});
}

Try encoding the parameter school
function openUrl()
{
jQuery.ajax({
url: 'https://mysite.com/WebUntis/index.do',
type:'GET',
dataType: 'html',
data: {
school: encodeURIComponent('schoolname#Timetable?'),
ajaxCommand: 'renderTimetable',
onlyTimetable: 'true',
date: '20130418',
type: '1',
id: '17',
formatId: '2',
departmentId: '-1',
buildingId: '-1'
},
success: function(result) {
var html = jQuery('<div>').html(result);
if(html.find("form").attr("id") == "login")//login form found
{
alert("Trying to login...");
login(); //This just POSTs a username and password
};
$('div.content').html(result);
},
});
}

Related

Ajax not posting data to server

I am trying to make a post request to my api which saves the data that I send through my request. I have tried all the solutions that I found here on SO but none worked.
This is how I am sending the request through ajax:
var data={
apiname: 'register', first_name: fname, last_name: lname, email_address: email,
acc_pass: pass, coach_phone: phone, coach_dob: dob, profile_picture: myFile,
coach_address: address, coach_state: state, coach_city: city, zip_code: zip, coach_bio: about,
teaching_locations: teaching, playing_exp: playing_exp, teaching_exp: teaching_exp,
private_lesson_rate: private_rate, group_lesson_rate: group_rate, certification: certifications,
any_crime: 'No', us_citizen: 'Yes', allowed_contract_work: 'Yes', agree_terms: 'Yes',
virtual_session: sessions
};
$.ajax({
type: "POST",
url: "my-url/signup_api.php",
processData: false,
contentType: "application/x-www-form-urlencoded",
dataType: 'json',
data: data,
success: function (data2) {
if (data2.status == '200') {
alert(data2.message);
}
else {
showError(data2.message, 3000);
}
},
error: function (jqXHR, exception) {
alert(exception);
}
});
I don't want to send the data in a json way like json.stringify. The variables (fname, lname etc) are the input fields of my form and I am getting the values like this:
var fname = $("#first_name").val();
and same for all the other variables. And on my php side, I am trying to access the data like this:
if($_POST['apiname']=="register"){
//do stuff
}
But my code never gets inside this if statement. Been stuck on this since last 2 days now.

JQuery.Ajax() not working not sure if script is loading properly

I'm trying to use an API to send emails through MailChimp. I can avoid using any sort of back end by doing this. I don't know if I am setting up my Jquery script file wrong.
$(document.ready(function () {
$('#survey').click(function() {
$.ajax({
type: “POST”,
url: “https://mandrillapp.com/api/1.0/messages/send.json”,
data: {
‘key’: ‘api Key’,
‘message’: {
‘from_email’: ‘email’,
‘to’: [
{
‘email’: ‘email’,
‘name’: ‘RECIPIENT NAME (OPTIONAL)’,
‘type’: ‘to’
}
],
‘autotext’: ‘true’,
‘subject’: ‘Class Survey’,
‘html’: ‘Here is your survey link: <a>link</a>’
}
}
}).done(function(response) {
console.log(response);
});
});
});
Here are all the errors I am receiving in VS Code
I am not sure why VS Code is highlighting all of the code. I also wanted to mention the console is giving this error even though it doesnt give much info.
Uncaught SyntaxError: Invalid or unexpected token
Thanks for the help!
it's because of the wrong double quotes you are using
use this " instead of this “
use this ' instead of ‘
$(document).ready(function() {
$('#survey').click(function() {
$.ajax({
type: "POST",
url: "https://mandrillapp.com/api/1.0/messages/send.json",
data: {
'key': 'api Key',
'message': {
'from_email': 'email',
'to': [
{
'email': 'email',
'name': 'RECIPIENT NAME (OPTIONAL)',
'type': 'to'
}
],
'autotext': 'true',
'subject': 'Class Survey',
'html': 'Here is your survey link: <a>link</a>'
}
}
}).done(function(response) {
console.log(response);
});
});
});

using ajax with javascript to put in database

I'm trying to put the infos into my database, for that, this code is in the connexion.jsp which is a page that ask to log with facebook.
the code is supposed to be called into the Controller which is a file in java, and go into the databse.
So my problem is the fact that the code $.ajax doesn't seems to work. It doesn't give a success or error window.alert with or without function(){}.
I might have missed some information about ajax, but i can't find more info about my error.
function fbLogin() {
FB.login(function (response) {
if (response.authResponse) {
// Get and display the user profile data
getFbUserData();
$.ajax({
method: 'post',
url: '/hello/facebookconnection',
first_name: response.first_name,
last_name: response.last_name,
email: response.email,
success:
//success: function(){
window.alert('Sent User data!')//;}
,
error:
window.alert('Error in sending ajax data')
});
else {
document.getElementById('status').innerHTML = 'User cancelled';
}
}, {scope: 'email'});
}
function fbLogin() {
FB.login(function (response) {
if (response.authResponse) {
// Get and display the user profile data
getFbUserData();
$.ajax({
method: 'post',
url: '/hello/facebookconnection',
first_name: response.first_name,
last_name: response.last_name,
email: response.email,
success:
//success: function(){
window.alert('Sent User data!')//;}
,
error:
window.alert('Error in sending ajax data')
});
} else {
document.getElementById('status').innerHTML = 'User cancelled';
}
}, {scope: 'email'});
}
You have a syntax error in front of your else.

Configuring Java sendMail to work with button that already has a function

We have a scheduling system on our site.
We're trying to set it up so when someone clicks the button, along with the command the button already has, it will send an email through Mandrill.
Currently the button is under the class, .bookingjs-form-button.
Our question is, how can we specify the following java/jQuery to work with just the .bookingjs-form-button. The system is embedded, we have access to everything but the HTML, which is why we can't simply do the following.
Thanks in advance!
HTML
<form name="mail">
<input type="button" value="Click!" onClick="sendMail()">
</form>
JavaScript
function sendMail() {
$.ajax({
type: "POST",
url: "https://mandrillapp.com/api/1.0/messages/send.json",
data: {
'key': 'YOUR_KEY',
'message': {
'from_email': 'YOUR_SENDER#example.com',
'to': [{
'email': 'YOUR_RECEIVER#example.com',
'name': 'YOUR_RECEIVER_NAME',
'type': 'to'
}],
'subject': 'title',
'html': 'html can be used'
}
}
});
}
Your code is working, but you can use it like so:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<div id='send'>Send</div>
<script>
$('#send').click(function() {
$.ajax({
type: "POST",
url: "https://mandrillapp.com/api/1.0/messages/send.json",
data: {
'key': 'YOUR_KEY',
'message': {
'from_email': 'YOUR_SENDER#example.com',
'to': [{
'email': 'YOUR_RECEIVER#example.com',
'name': 'YOUR_RECEIVER_NAME',
'type': 'to'
}],
'subject': 'title',
'html': 'html can be used'
}
}
});
});
</script>

Send form input by email without server

For a locally hosted HTML page, I need to email a bit of user input (name, email, comments).
This is done on a touchscreen display, where visitors can leave their information and comments.
So I was thinking of using a virtual keyboard such as here.
<form action="post" id="emails" onsubmit="return false;">
<input type="text" id="keyboard" placeholder="Enter name..."></input>
<input type="text" id="keyboard2" placeholder="Enter email..."></input>
<input type='submit' id='send' value='Submit' />
</form>
I used this to be able to send the email link.
And with the correct details, the following code works and I get emails in my inbox.
$('#send').click(function() {
$.ajax({
type: 'POST',
url: 'https://mandrillapp.com/api/1.0/messages/send.json',
data: {
'key': "xxxxxxxx",
'message': {
'from_email': "xxxxxx#xxxxxx.com",
'to': [
{
'email': "xxxxxxxx#xxxxxxxxxx.com",
'name': 'xxxxxx',
'type': 'to'
}
],
'autotext': 'true',
'subject': 'TEST! TEST!',
'html': 'test'
}
}
}).done(function(response) {
console.log(response);
alert("You send an email!"); // if you're into that sorta thing
});
});
So this works, as in it sends the email with the text put in here: 'html': 'test'
And instead of 'test', I would obviously like to get 'name + email'.
(Also it is probably for less then 50 emails per month, so just an email will suit my needs for now, nothing with databases and saving all this data. I would just like to get the email.)
So, is it possible and how should I do this?
Is the route I took now doable or would you suggest a completely different way?
// do everything inside after page load.
$(function() {
$('#send').click(function() {
// get values of inputs...
var name = $('#keyboard').val(),
email = $('#keyboard2').val();
$.ajax({
type: 'POST',
url: 'https://mandrillapp.com/api/1.0/messages/send.json',
data: {
'key': "xxxxxxxx",
'message': {
'from_email': "xxxxxx#xxxxxx.com",
'to': [
{
'email': "xxxxxxxx#xxxxxxxxxx.com",
'name': 'xxxxxx',
'type': 'to'
}
],
'autotext': 'true',
'subject': 'TEST! TEST!',
'html': 'Name: ' + name + '\nEmail: ' + email // and use it!
}
}
}).done(function(response) {
console.log(response);
alert("You send an email!"); // if you're into that sorta thing
});
});
});
I've got it working now with the following code:
$(function() {
$('#send').click(function() {
var name = $('#keyboard').val();
var email = $('#keyboard2').val();
$.ajax({
type: 'POST',
url: 'https://mandrillapp.com/api/1.0/messages/send.json',
data: {
'key': "xxxxxxxx",
'message': {
'from_email': "xxxxxx#xxxxxx.com",
'to': [
{
'email': "xxxxxxxx#xxxxxxxxxx.com",
'name': 'xxxxxx',
'type': 'to'
}
],
'autotext': 'true',
'subject': 'TEST! TEST!',
'html': 'Name: ' + name + '\nEmail: ' + email // and use it!
}
}
}).done(function(response) {
console.log(response);
alert("You send an email!"); // if you're into that sorta thing
});
});
});
On other simular problems were value were not shown I read something about the .val() was taking the values on page load (makes sense now), so I moved them down into the click function and it gives me the result I was after.

Categories

Resources