Javascript src with variable - javascript

I need to embed a player by the following code:
<script type="text/javascript" src=***the url***></script>
A part in the url is the ID which is retrieved from mySQL database. I know that the string concatenation can't be directly handled in the src, so I add the function in the beginning:
<head>
<script>
function call(url)
{
var script = document.createElement('script');
script.type="text/javascript";
script.src = url;
document.body.appendChild(script);
}
</script>
</head>
In the body,
<body>
<?php ***...to retrieve ID***?>
<script type="text/javascript">
var videoid = "<?php echo $id; ?>"; //Transfer ID to javascript
var url="http://......"+videoid; //Url string finished
call(url); //Function call
</script>
Now the script is appended, but I can't see the player. Why?

Related

Writing javascript in PHP

I am new to PHP, I just need to write a javascript code inside php file like we doing in jsp.
Below is the sample code where am trying to do that, Please help me out to embed my javascript code in php
getencryp.php
<html>
<body>
<script type="text/javascript" src="js/require.js"></script>
<script type="text/javascript" src="js/jsencrypt.js"></script>
<script type="text/javascript">
var b=getAccountbyEncrptInfo('xxx','yyyy')
function getAccountbyEncrptInfo(user,pass)
{
var omegaKey = 'abc';
var crypt = new JSEncrypt();
crypt.setPublicKey(omegaKey);
var creds = {
username: user,
password: pass
};
creds.username = crypt.encrypt(creds.username);
creds.password = crypt.encrypt(creds.password);
return JSON.stringify(creds);
}
</script>
<?php
echo Your encrypted username and password is $b;
?>
</body>
</html>
In the above code am just passing two values in java script getAccountbyEncrptInfo('xxx','yyyy') and just trying to print inside php body.
b is a variable in javascript and it's not a variable in PHP. So that you can't echo it in the PHP tag.
I think you should implement the function getAccountbyEncrptInfo in PHP code or binding the variable from javascript into the html tag instead of using echo in PHP. It should be something like:
<html>
<body>
<script type="text/javascript" src="js/require.js"></script>
<script type="text/javascript" src="js/jsencrypt.js"></script>
<script type="text/javascript">
var b=getAccountbyEncrptInfo('xxx','yyyy');
document.getElementById('encrypted').html(b);
function getAccountbyEncrptInfo(user,pass)
{
var omegaKey = 'abc';
var crypt = new JSEncrypt();
crypt.setPublicKey(omegaKey);
var creds = {
username: user,
password: pass
};
creds.username = crypt.encrypt(creds.username);
creds.password = crypt.encrypt(creds.password);
return JSON.stringify(creds);
}
</script>
<div id="encrypted"></div>
</body>
</html>
Why do you need to use PHP?
<script>
var b = getAccountbyEncrptInfo('xxx','yyyy');
document.getElementById('ex').append(" Your encrypted username and password is " + b)
</script>
However if you wanted to append it inside the <?php ?> tags to further process your data, you might want to consider using an AJAX request.
just add this line after var b declaration
$('#answer').html(b);
and replace
echo Your encrypted username and password is $b;
this line with this line
Your encrypted username and password is div id="answer"></div
just make a blank div and set it`s id answer so js is set the value on it

Javascript scope and sequentiality issue

I want to get an id from the query and display it in html.
I want to keep things in separate javascript files, because in the future, it will retrieve a json from php and will filter it based on some checkboxes, radio buttons, etc. and then display the result.
In this moment, I get a blank page, and the id value is not shown, so I'm doing something wrong.
http://localhost:10600/js1/index.php?id=5
index.php
<html>
<head>
<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js'></script>
</head>
<body>
<div class="results"></div>
</body>
</html>
<script type="text/javascript" src="config.js"></script>
<script type="text/javascript" src="display.js"></script>
<script type="text/javascript" src="sequence.js"></script>
config.js
function getId() {
id = "<?php echo $_GET['id']; ?>";
}
display.js
function updateHtml() {
window.onload = function() {
document.querySelector('.results').innerHTML = id;
}
}
sequence.js
function seq()
{
getId();
updateHtml();
}
seq();
Please try the following:
index.php
<html>
<head>
<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js'></script>
</head>
<body>
<div class="results"></div>
</body>
</html>
<script type="text/javascript">
var id;
function getId() {
id = "<?php echo $_GET['id']; ?>";
}
</script>
<script type="text/javascript" src="display.js"></script>
<script type="text/javascript" src="sequence.js"></script>
function getParameters() {
var url_params = window.location.search.substring(1); // Removing characters : ?
var params = url_params.split("&");
var res = {};
for (var i = 0, c = params.length; i < c; i++) {
var split = params[i].split("=");
res[split[0]] = split[1];
}
return res;
}
Returns an object {param: value}
In index.php within body you can do like this one
<input type="hidden" name="hidden_id" id="hidden_id" value="<?=$_GET['id']?>">
In JS :
If you are using jQuery,then you should do like this one.
$(document).ready(){
var strHiddenId = $("#hidden_id").val();
$(".results").html(strHiddenId);
}

Next and previous button using jquery

I am using a PHP Simple HTML DOM Parser to save a website as a htm file. I then use jQuery to extract a div from the file and put it into a div. I want to create a
Previous and Next button but the problem I have is that to do this I have to change the URL so the parser can get the page. I would really appreciate if you can help. Below is the code I am using.
<?php
include( 'site/simple_html_dom.php');
$html=file_get_html( 'http://roosterteeth.com/home.php?page=1');
$html->save('site/rtnews.htm')
?>
<script type="text/javascript" src="site/jquery.js"></script>
<script type="text/javascript">
$('document').ready(function() {
$('#wrap').click(function (event){
event.preventDefault();
});
$("#wrap").load('site/rtnews.htm #postsArea');
});
</script>
</head>
<body>
<div id="wrap">
</div>
</body>
You will have to create a new php file for this and make an AJAX request to that file. I assume you have already realised that you cannot make a cross-domain request due to CORS.
Here is your new php file, let's call it proxy.php. It will proxy the request, responding with the page that is passed to it via GET :
<?php
include( 'site/simple_html_dom.php');
$html=file_get_html( 'http://roosterteeth.com/home.php?page=' . $_GET["page"]);
echo $html;
?>
Your new JavaScript;
$('document').ready(function() {
var $wrap = $('#wrap'),
page = 1;
$('#next').on('click', function () {
getPage(++page);
});
$('#prev').on('click', function () {
getPage(--page);
});
var getPage = function (page) {
$wrap.load('proxy.php?page=' + page + ' #postsArea');
};
getPage(page);
});

Write JavaScript code inside JavaScript and all in PHP?

I have an ad that will appear when certain conditions, and when that ad appears, the ad will detect the width of the screen and use the ad size that I specify.
I did this using JavaScript, and inside JavaScript and all are in PHP. Problems arise when writing in document.write.
Could you please help me solve this problem.
This is my code:
<?php
if(!empty($variable1)) {
echo '
<script type="text/javascript">
var swidth = screen.width;
if (swidth >= 1218) {
document.write('
<script type="text/javascript">
document.write("
<script type='text/javascript'>
var adcode = {abcdefg};
</script>
<script type='text/javascript' src='http://domainname.com/ads.js'></script>
");
</script>
');
}
</script>
';
} else {
if(!empty($variable2)) {
echo $ads2;
} else {}
}
?>
from line 13 to 22 replace:
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'http://domainname.com/ads.js';
$("body").append(script);
var script2 = document.createElement('script');
script2.type = 'text/javascript';
script2.src = 'sc.js';// or url to the script file;
$("body").append(script2);
and sc.js:
var adcode = {abcdefg};
BUT
The best way to add JS in PHP:
<?php
// ...
?>
<script src="url_to_script"></script>
<?php
// ...
?>
Manipulations with DOM elements must be defined in JS and not affect PHP.

Injecting javascript dynamically and using it

I also create a javascript file dynamically that uses those variables:
function callbackF(data){
console.log(data.script);
document.getElementsByTagName('head')[0].innerHTML=data.script;
var script = document.createElement("script");
script.setAttribute("src", "http://widget.example.com/sprk.1.0.2.js");
script.setAttribute("type", "text/javascript");
script.setAttribute("id", "grazit_script");
document.getElementsByTagName('head')[0].appendChild(script);
}
This is what i get in my head:
This is what is printed to the console log:
<script type='text/javascript'>var dbnwid=16476; var dbnpid=23369; var dbnwebid=19720; var dbnlayout=21; var dbncolor='#000000'; var dbntitlefontsize='14'; var dbnbgcolortype=1; var dbnheader='You might enjoy reading:'; var dbnremindercolor=2; var dbn_protocol = (('https:' == document.location.protocol) ? 'https://' : 'http://'); </script>
and then the script:
<script src="http://widget.example.com/sprk.1.0.2.js" type="text/javascript" id="grazit_script"></script>
The second script should get the variables that are in the second script..but it doesnt..then it complains about why it doesnt get those variables
UPDATE:
Both of those ways below didnt work for me:
eval(data.script);
var ss= new Function(data.script)();
Because scripts run when they are loaded. Adding a script tag using innerHTML doesn't run the code inside the tag.

Categories

Resources