I am using mustache PHP to render my html files and everything works correctly except in one case. There is a situation where I load an html file through an ajax call following this structure:
PHP - renders -> HTML - javascript appends -> HTML 2nd file
What I would like to do is to get the mustache parameters into the HTML 2nd file, as some data is generated in the initial PHP file and I wouldn't like to make another call to retrieve this data again.
Do I need mustache js version for this ?
How can I get the data from the PHP in js by using mustache?
And how can I get the PHP rendered variables in the HTML 2nd file ?
What I can do is to insert hidden inputs to get the data from them in javascript but I would really like to avoid this practice. I don't like this practice as user can easily modify the inputs.
Any idea??
At the end I found a solution for this. Print the output of a php file on an ajax call.
Mustache_Autoloader::register();
$m = new Mustache_Engine(array(
'loader' => new Mustache_Loader_FilesystemLoader('./templates/')
));
echo $m->render('templatename', $o);
and then using .html(data); with jQuery
Related
Basically, at the click of a button I need to refresh a div that contains embedded PHP. I tried using .html() in jQuery to reload the contents of the div, but it didn't change anything so I'm assuming it's not recalling the PHP (because the PHP should be changed at this point). It's probably just rewriting the HTML that was outputted by the PHP when the page loaded. I also tried appending something to the new HTML load so I could see it was at least refreshing the HTML code, and it was. It looked something like (if "updateObject" is a variable that contains the location of the div):
updateObject.html(updateObject.html() + " random text");
I also fiddled around with the .load() jQuery method, but it seemed to be for external PHP files (and at this point I can't change my embedded PHP to external PHP).
Any thoughts? Thanks!
EDIT: The biggest problem I've had is that, with my limited knowledge of web dev, I need to have the PHP embedded. If I make it a separate file, I'd have a very difficult time finding it because I honestly don't understand how the files get put together through the framework we're using (Drupal). I did try using an external PHP file but I couldn't figure out how to find it. Even if I put it in the same directory as this HTML file, it doesn't seem to be easy to find.
You are to have 2 files:
PHP
This contains the data you want to show.
HTML
This is the one showing the php content.
In PHP you can put whatever you want. But the HTML once is loaded is loaded and the only way to have some more content into it is to make what is called an asynchronous call, which means a call after the page has been loaded.
To do this you are to use jQuery and call the $.post (or $.ajax), using this syntax:
$.post('filename.php', function(dataFromPhp){
//actions to do once the php has been read
})
So in your case you can make a function that reads the php every time the click is done on a div/button/other DOM object; like so:
function updateDivContent(whatDiv){
$.post('filename.php', function(dataFromPhp){
if(dataFromPhp){
$(whatDiv).html(dataFromPhp)
}
})
}
So if you want the div to be refreshed (and reload the php) you are to connect that function to an event and specify the div you want to show the data:
$('#myBtn').click(function(){
updateDivContent('#myDiv');
})
Refer to this documentation for further informations: https://api.jquery.com/jQuery.post/
I am trying to clean up my pages, and one of the major ways that I am doing so is to put JavaScript and JQuery functions into a file called 'scripts.js' that is automatically accessed upon page load.
I've run into a problem with functions that use php to call from the page itself. For example, the following function doesn't work, and in fact 'kills' the script for all pages (so now things that were supposed to be hidden are not, and things are not loading properly). I've narrowed it down to the fact that I use to call a variable. I would really like to be able to keep functions using PHP in this universal file as opposed to clogging up the HTML template pages, any thoughts on either how to make this work, or if not how else I may be able to call the values needed? They are always extracted to the page before rendering if that helps.
function positiveSelect()
{
var size = <?php echo $idea[0]["size"]; ?> * 1;
if (size > 5)
return true;
else
return false;
}
if you can't retrive your data form the DOM itself you can store values with the corresponding object:
<div data-size=20>
and then retrive it with:
$(element).data("size");
or if you have global data you want to store you can create a value "container" in the head of you html document like this:
<script type="text/x-json" class="global-data">{"value1":"1","value2":"2"}</script>
and then read the content of that element and parse it with JSON.parse
If this function is that specific to a certain page, you might want to add a second js script that just gets loaded on that page.
An alternative would be to echo out a js variable in that php page and have your code call that function with that variable as a parameter.
You can give the javascript a ".php" extension and call it in the script in the same exact way:
<script type="javascript" src="path/to/scripts.php"></script>
You could just name the generate scripts file scripts.php or scripts.js.php; then the PHP preprocessor will process the file and the PHP statements will be evaluated.
When mixing php or any server side language with javascript you need to be aware that the php gets executed only once when the javascript file is created on the client side.
This is probably why you are getting unexpected results. As you move from page to page the php snippet in your global scripts.js will not get updated.
i want to load my search_result.php file inside a div of my main php page using load() function. i have written a function that to parse a json code
json_parsing(document.getElementById('start_val').value, <?php echo $jsoncode;?>);
now i want when i load the search_result.php file using the following code
$("#search_result_cont").load("search_result.php");
the function inside it takes the value from current webpage element #start_value and php variable $jsoncode.
is it possible to do so?
$.get( 'search_result.php'.function(text){
eval(text); // text is without the script tags
},'text');
or
$.get( 'search_result.php'.function(json_text){
json_parsing(document.getElementById('start_val').value, json_text);
// json_text is just $jsoncode
},'text');
Also, why are you parsing the json yourself when you can use $.parseJSON(text) and $.getJSON(); Usually problems like this indicate that you are trying to do something in a way that is not good programming design.
I'm trying to replace a bit of javascript in my page via AJAX, but for some reason, AJAX wont replace it...
When I use:
alert(document.getElementById('treintracking').innerHTML);
I can clearly see the javascript from the script piece: (this is the opening line of the javascript piece)
<script type="text/javascript" id="treintracking">
For replacing the script I use this:
document.getElementById('treintracking').innerHTML = responseText;
So, why does AJAX not want to replace the javascript?
I've tested, and the php file used to generate the replacement javascript, works fine.
I also took into account that the to-be-replaced javascript already has tags around it, so I removed those in the php file.
But it still wont replace the content...
Also, if it put somefunction() in that javascript, will it then run, or do I have to do something special?
Note: the javascript script is generated in a php file.
SOLUTION:
I am now using this external solution, I don't have a clue how it works, but it works perfectly:
http://www.javascriptkit.com/javatutors/loadjavascriptcss2.shtml
[I took the loading script from the page source, as it wasnt in the article itself...]
Adding JavaScript via innerHTML does not get evaluated.
If you want to add new code, just set the source to a new external JavaScript file.
So instead of using an Ajax call, you just set the src
document.getElementById('treintracking').src = "new/path.php?a=b";
Another solution [that I would avoid at all costs] is eval().
You'll probably have to embed the new javascript inside a function, which may assign new contents to other functions, and then invoke the outer function. Won't be terribly pretty.
I'd like to pass some data from PHP to JavaScript without JSON.
The reason is because I don't want the data been readable by anyone if clicks on view page source.
So, I have a PHP like
print(<script type="text/javascript">a = "aaa";</script>);
In my HTML code this will be
<script type="text/javascript">a = "aaa";</script>
I can remove this in the client side, after loading the variable. By for example with jquery
$('script[type="text/javascript"]').remove();
And after the DOM will not have anymore the script tag, but the variable a.
Later if I type to the console window.a will be aaa.
But i do not want to show the <script type="text/javascript">a = "aaa";</script> in my HTML source code. Is this possible, to pass the PHP variable directly to the DOM?
Thanks for the help.
JavaScript is a client-side language. Whatever you pass to it (by whatever means) will be readable by the end user.
Removing the Script DOM won't help, as "view source" shows the HTML code as it was during download. If that is what you are concerned about, you can fetch the variable via an AJAX once the DOM has been loaded.
(But it still is readable by anyone who can read JavaScript (an re-run the AJAX call), use Firebug or Wireshark. It really only helps against a simple "view source".)