jQuery Freichat conflict - javascript

I'm trying to integrate the freichat module to my website, but i got this error
TypeError: $ is not a function
I tried to encapsulate it with an anonymous function passing jQuery as the parameter , like this:
(function($) {
$(document).ready(function() {
// my custom code
});
})(jQuery);
I also put jQuery instead of $ and got the below issue:
jQuery is undefined
Any idea regarding this?

Codes:
<script src="JS/jquery.js"></script>
<script language="javascript">
$(document).ready(function () {
$("#lawyerrr").select2();
$("#fromm").select2();
$("#too").select2();
});
</script>
<?php
$ses = null; // Return null if user is not logged in
if (!empty($_SESSION['user'])) {
$loggedUser = $_SESSION['user'];
}
if(isset($loggedUser['idd']))
{
if($loggedUser['idd'] != null) // Here null is guest
{
$ses=$loggedUser['idd']; //LOOK, now userid will be passed to FreiChat
}
}
//echo $ses;
if(!function_exists("freichatx_get_hash")){
function freichatx_get_hash($ses){
if(is_file("C:/wamp64/www/freichat/hardcode.php")){
require "C:/wamp64/www/freichat/hardcode.php";
$temp_id = $ses . $uid;
return md5($temp_id);
}
else
{
echo "<script>alert('module freichatx says: hardcode.php file not
found!');</script>";
}
return 0;
}
}
?>
<script type="text/javascript" language="javascipt" src="http://localhost/freichat/client/main.php?id=<?php echo $ses;?>&xhash=<?php echo freichatx_get_hash($ses); ?>"></script>
<link rel="stylesheet" href="http://localhost/freichat/client/jquery/freichat_themes/freichatcss.php" type="text/css">

Add JQuery library to your document:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Related

How should I access a variable from javascript in PHP to perform some actions?

I have a file named sample.php, in which I have some JS code, and some PHP code. This is some sort of sample snippet of the code I have :
<!DOCTYPE html>
<html lang="en">
<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
<head>
<script type="text/javascript">
var ThunkableWebviewerExtension = {
receiveMessage: function(fxn) {
var callbackFunction = function(event) {
if (typeof fxn === 'function') {
fxn(event.data)
}
};
document.addEventListener('message', callbackFunction, false);
window.addEventListener('message', callbackFunction, false);
}
}
</script>
</head>
<body>
<script type="text/javascript">
var value;
ThunkableWebviewerExtension.receiveMessage(function(message) {
value = message;
});
//sending the value with ajax
$.ajax({
url : "./sample.php", //same file
method : "GET",
data: {"name": value},
success : (res) => {
console.log(value);
},
error : (res) => {
console.log(res);
}
})
</script>
<?php
echo $_GET['name'];
?>
</body>
</html>
The problem is the PHP code doesn't print anything - Are there any error/bug I need to fix? Or is there a better method for accessing a JS variable in PHP?
Thanks! :)
Here's how you can access PHP code within in a <script> (without using AJAX):
<?php
echo"<script>";
include ('javascriptStuff.js');
echo'let x = '.json_encode($phpVariable).';';
echo"</script>";
?>

Javascript not loaded correcly order?

I have a webpage where I load some javascript files in header. Some subpage will load aditional javascript files. On the main page everything is working just fine but on the subpage I get alot of exceptions like this :
Uncaught TypeError: Property '$' of object [object Object] is not a
function
I can see that this exception occurs in details.js, voteHandler.js and 4 times in the HTML page itself. The exception is always thrown on this line :
$("document").ready(function () {
This is how the main page that works looks like :
<head>
<script type="text/javascript" src=/Scripts/jquery-1.7.1.min.js></script>
<script type="text/javascript">
//URL for voting
var _postVoteUrl = 'http://localhost:5215/Post/Vote'
//URL for tags
var _tagsUrl = 'http://localhost:5215/Post/Tags'
//Keep track of if a cascading is loading, if so, cancel submits
var cascadingControlLoading = false;
window.latestClick = '';
function IsNotDblClick(objectID) {
if (window.latestClick != objectID &&
!cascadingControlLoading) {
window.latestClick = objectID;
return true;
} else {
return false;
}
}
$(document).ready(function () {
if($('#rightCon').text().trim().length < 1)
{$('#rightCon').hide();}
});
</script>
<script type="text/javascript" src=/Scripts/jquery-ui-1.8.20.min.js>"></script>
<script type="text/javascript" src=/Scripts/jquery.elastic.source.js></script>
<script type="text/javascript" src=/Scripts/jquery.validate.min.js></script>
<script type="text/javascript" src=/Scripts/jquery.validate.unobtrusive.min.js></script>
<script type="text/javascript" src=/Scripts/jquery.qtip.min.js></script>
<script type="text/javascript" src=/Scripts/formhandler.js></script>
<script type="text/javascript" src=/Scripts/taghandler.js></script>
<script src="/Scripts/voteHandler.js"></script>
<script type="text/javascript" src=/Scripts/select2.min.js %>"></script>
<script>
function TogglePostCon() {
$('#postListEditorCon').toggle();
}
SetupTagTextBox("txtTagBox", false);
SetupTagTextBoxPersonalTag("txtPersonalTagBox", true);
SetupTagTextBoxPersonalTag("txtPersonalIgnoreTagBox", true);
</script>
<script src="/Scripts/modernizr-2.5.3.js"></script>
</head>
And this is the subpage that throws the exceptions :
<head>
<script type="text/javascript" src=/Scripts/jquery-1.7.1.min.js></script>
<script type="text/javascript">
//URL for voting
var _postVoteUrl = 'http://localhost:5215/Post/Vote'
//URL for tags
var _tagsUrl = 'http://localhost:5215/Post/Tags'
//Keep track of if a cascading is loading, if so, cancel submits
var cascadingControlLoading = false;
window.latestClick = '';
function IsNotDblClick(objectID) {
if (window.latestClick != objectID &&
!cascadingControlLoading) {
window.latestClick = objectID;
return true;
} else {
return false;
}
}
$(document).ready(function () {
if($('#rightCon').text().trim().length < 1)
{$('#rightCon').hide();}
});
</script>
<script type="text/javascript" src=/Scripts/jquery-ui-1.8.20.min.js>"></script>
<script type="text/javascript" src=/Scripts/jquery.elastic.source.js></script>
<script type="text/javascript" src=/Scripts/jquery.validate.min.js></script>
<script type="text/javascript" src=/Scripts/jquery.validate.unobtrusive.min.js></script>
<script type="text/javascript" src=/Scripts/jquery.qtip.min.js></script>
<script type="text/javascript" src=/Scripts/formhandler.js></script>
<script type="text/javascript" src=/Scripts/taghandler.js></script>
<script src="/Scripts/details.js"></script>
<script src="/Scripts/voteHandler.js"></script>
<script>
$(function () {
//Google +1
$.getScript("http://apis.google.com/js/plusone.js", null, true);
//Twitter
$.getScript("http://platform.twitter.com/widgets.js", null, true);
//Facebook
$.getScript("http://connect.facebook.net/en_US/all.js#xfbml=1", function () {
$('body').append('<div id="fb-root"></div>');
FB.init({ status: true, cookie: true, xfbml: true });
}, true);
});
</script>
<script src="/Scripts/modernizr-2.5.3.js"></script>
</head>
I hade some of the scripts loaded at the bottom of the body before and this did not generate the exception but from what I read this is not a recomended way to go.
So why is my subpage generating these exceptions?
In "no-confict" mode, the $ shortcut is not available and the longer jQuery is used, i.e.
jQuery(document).ready(function ($) {
By including the $ in parenthesis after the function call you can then use this shortcut within the code block.
Replace your code
$(document).ready(function () {
if($('#rightCon').text().trim().length < 1)
{$('#rightCon').hide();}
});
with this
jQuery(document).ready(function ($) {
if($('#rightCon').text().trim().length < 1)
{$('#rightCon').hide();}
});

Load modules with Lab.js

Why ReferenceError: $ is not defined ?
<script src="LAB.js"></script>
<script>
$LAB.script("jquery/jquery.js")
</script>
</body>
<p><?php echo mt_rand(89,161464) ?></p>
<script>
//Uncaught ReferenceError: $ is not defined
$(document).ready(function(){
console.log('reddy');
$("p").css('color','red');
})
</script>
But work:
window.onload=function(){
$("p").css('color','red');
}
2.item1.js
var interface={name:'interface'};
item2.js
interface.hu={name:'int'};
$LAB.script("item2.js").wait();
$LAB.script("item1.js");
//Uncaught ReferenceError: interface is not defined
Help
try :
$LAB.script("jquery/jquery.js").wait(function () {
if( window.jQuery ) { //is jquery loaded
$("p").css('color','red');
}
});
OR
$LAB.script("jquery/jquery.js").wait(function () {
$(document).ready(function() {
$("p").css('color','red');
}
});
See more:: LABjs Doc

Logout from LinkedIn API

I have worked with LinkedIn API and need guidance about logging out from Linkedin API once I click Logout in my application. I have tried the following code:
function closeSession(){
IN.User.logout();
}
Logout In LinkedIn
I have also tried:
$('logout-link').click(function() {
IN.Event.on(IN,'logout', function() {
window.location.href = [site-logout-url];
});
IN.User.logout();
});
I tried to destroy the session in a browser by calling session_destroy()
Finally, I tried the answer I got from Stack Overflow for this question. I didn't get any right solution. Can anyone tell me the solution?
Make sure that you have include
<script type="text/javascript" src="http://platform.linkedin.com/in.js"></script>
on your home page, i.e. where you are logging out.
Seems your onclick is not being called, try doing:
function closeSession(){
IN.User.logout();
return true;
}
Logout In LinkedIn
OR
<a href="#" class="myButton" onclick="closeSession()" id="logout-link">
Logout In LinkedIn
</a>
And js
function closeSession() {
if ( typeof IN === 'object' && typeof IN.User === 'object' && IN.User.isAuthorized() ) {
//user logged in linkedin
//call linkedin logout with websites logout function as callback
alert("I m inside linkedin object check.."); //do you see this
IN.User.logout(logout);
}
else {
logout();
}
}
function logout() {
window.location.href = "URL_TO_YOUR_LOGOUT.PHP";
}
I think you are redirected before your javascript gets executed, so try this way ?
JavaScript Code :
function closeSession(){
IN.User.logout();
location.href="logout.php";
}
HTML Code :
<span style="cursor:pointer" onclick="closeSession()">Logout In LinkedIn</span>
To make it work
<script type="text/javascript" src="http://platform.linkedin.com/in.js">
api_key: <?php echo sfConfig::get('app_linkedin_api_key'); ?>
authorize: true
</script>
<script>
IN.Event.on(IN, "logout", function() {onLinkedInLogout();});
function onLinkedInLogout(){
// User is logged out
window.location.href='<?php echo url_for("#homepage");?>'
}
</script>
<?php echo __("Logout");?>
<div class="signin"><script type="in/Login" data-onAuth="onLinkedInAuth"></script>
<script type="text/javascript">
function onLinkedInAuth() {
IN.API.Profile("me")
.fields("id")
.result( function(me) {
var id = me.values[0].id;
//Do stuff like redirect...
})
}
</script>
There seems to be 2 different issues here. You can't logout of linked in from your server side script unless you call their function. When you land on logout.php you should have your session_destroy(); on top of the page. Make sure there isn't any session_start() on logout.php
You need to load the LinkedIn JavaScript platform before trying to call IN.User.logout(), you should run the code only after the javascript library has loaded completely.
<script type="text/javascript" src="http://platform.linkedin.com/in.js">
api_key: mykey
authorize: true
onLoad: onLoad
</script>
<script type="text/javascript">
function onLoad() {
try {
IN.User.logout();
} catch (err) {
console.log(err);
}
location.href="index.php";
}
</script>
<script type="text/javascript" src="http://platform.linkedin.com/in.js">
api_key: mykey
authorize: true
onLoad: onLoad
</script>
<script type="text/javascript">
function onLoad() {
try {
IN.User.logout();
} catch (err) {
console.log(err);
}
location.href="index.php";
}
</script>
use session_destroy() in the code.

JavaScript isn't working on my server

This code is working on other test environment but not on mine.
Do you know why?
I am using Amazon EC2 and Cotendo CDN.
The result I am getting is a blank page.
Thanks in advance!
<html>
<head>
<title>Geo Test</title>
<script type='text/javascript' src='http://www.101greatgoals.com/wp-includes/js/jquery/jquery.js?ver=1.7.1'></script>
<script>
$(document).ready( function() {
$.getJSON( "http://smart-ip.net/geoip-json?callback=?",
function(data){
console.log(data);
var c = data.countryCode;
if(c=="US" || c=="US" ){
document.getElementById('ddd').innerHTML = 'US'; } else {
document.getElementById('ddd').innerHTML = 'Not US';}
/*
this service needs ip
var ip = data.host;
alert(ip);
$.getJSON( "http://freegeoip.net/json/"+ip,
function(data){
console.log(data);
}
);*/
}
);
});?
</script>
</head>
<body>
<div id="ddd"></div>
</body>
</html>
Change this line:
$(document).ready( function() {
to that:
jQuery(document).ready( function($) {
It's necessary, because inside http://www.101greatgoals.com/wp-includes/js/jquery/jquery.js?ver=1.7.1 you've already got a call of jQuery.noConflict(); , so jQuery is not accessible by using the $
...and also remove the ? (see Pointy's comment above)

Categories

Resources