|
JavaScript - How To: Pass Local Variable From <head> Js Function To <body> Textarea
How to: pass local variable from <head> JS function to <body> textarea
I have a JS function in the head that calculates a variable. the function is triggered by the vevent of a button click. when calculation is done, how is it sent back to the page and placed in a textarea or textbox....?? /Beginner issues :/ Similar TutorialsHi all, I need to pass a variable to an inner function and I got it to work but: (1) I don't know why it works (2) I don't know if it's right or optimal So, please look and comment: Code: for (var h = 1.0; h <= 3.0; h += 0.5) {
ed.settings.formats['spacing' + String(h.toFixed(1))] = {
'block' : 'p',
'styles' : {
'marginBottom' : String((h - 1).toFixed(1)) + 'em'
}
}
h = (function (h) {
c.onRenderMenu.add(function (c, m) {
m.add({
'title': String(h.toFixed(1)),
'caption' : 'Set the line spacing to ' + String(h.toFixed(1)),
'onclick': function () {
ed.formatter.apply('spacing' + this.title);
return false;
}
}).setDisabled(false);
});
return h;
})(h);
};
You can ignore a lot of the code as it doesn't factor into the question... and I know that re-ordering the code can eliminate my problem (but I can't re-order it because defining the formats MUST come before "renderMenu" or else it doesn't work - and I don't want to use two loops - one to define the formats and another to define the menu). The part that's freaking me out is this: Code: h = (function (h) {
c.onRenderMenu.add(function (c, m) {
m.add({
'title': String(h.toFixed(1)),
'caption' : 'Set the line spacing to ' + String(h.toFixed(1)),
'onclick': function () {
ed.formatter.apply('spacing' + this.title);
return false;
}
}).setDisabled(false);
});
return h;
})(h);
See the strange things I have to do to get h inside of c.onRenderMenu.add()? Is this right? Can I do it any "better" or more correctly? Thanks! -- Roger Here's something that I tested without the PHP and it worked ok. Now that I've introduced the PHP to the document it doesn't work. The PHP variable is not passing to Javascript properly. By use of some cleverly placed alert boxes, I figured out that the only thing that is getting passed forward is something called : "object HTML ImageElement" Specifically, I assign the element ID the unique ID number of the record in the SQL database. The problem isn't with the ID numbers themselves: They are alphanumeric and unique. I think it boils down to one of two lines of code. Either this isn't working (about line 12) Code: function expander(RecordID){
or perhaps it is when I am calling the function (about line 66): Code: echo "<img id='".$row['IDNumber']."' src=".$row['ImagePath']." width='5%' onMouseOver='expander(".$row['IDNumber'].");' onMouseOut='shrinker(".$row['IDNumber'].");'>";}
The PHP works (I can get the images to appear, so the connection to SQL and such isn't a problem). I am sure most of the JavaScript is good, too, as I said I had it all working prior to dropping in the PHP. Since I am not going from JavaScript to PHP I don't think I need AJAX. I just need the PHP to pass to JavaScript. Any ideas? Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="class.css" />
<script type = "text/javascript" language="javascript">
//<![CDATA[
var maxheight = 150;
var countShrink = 1;
function expander(RecordID){
var countGrow = 1;
var pic = document.getElementById(RecordID);
if(pic){
var imageh = pic.height;
var imagew = pic.width;
if(imageh<100){
countGrow++;
imageh = imageh*1.2;
imagew = imagew*1.2;
pic.style.height = imageh + "px";
pic.style.width = imagew + "px";
var timer = window.setTimeout(function(){expander(RecordID);},2);}
}
else
{alert("error on");}
}
function shrinker(RecordID){
var pic = document.getElementById(RecordID);
if(pic){var counter = 1
var imageh = pic.height;
var imagew = pic.width;
if(imageh>20){
imageh = imageh/1.2;
imagew = imagew/1.2;
pic.style.height = imageh + "px";
pic.style.width = imagew + "px";
var timer = window.setTimeout(function(){shrinker(RecordID);},3);}
}
else
{alert("error off");}
}
//]]>
</script>
</head>
<body>
<?php
include('menuSub.html');
require_once('connect.php');
$idnum = 'phmdv06tbu';
//$q="SELECT * FROM art WHERE IDNumber = '".$idnum."'";
$q="SELECT * FROM art ORDER BY IDNumber LIMIT 4";
$r = @mysqli_query ($dbc, $q);
echo "<div class='bodyContent'><div class='imageContent'>";
if($r){
while ($row = mysqli_fetch_array($r,MYSQLI_ASSOC)){
echo "<img id='".$row['IDNumber']."' src=".$row['ImagePath']." width='5%' onMouseOver='expander(".$row['IDNumber'].");' onMouseOut='shrinker(".$row['IDNumber'].");'>";}
}
else{
echo '<div class="bodyContent"> Error<div>';
}
echo "</div></div>";
mysqli_close($dbc); ?>
</body>
</html>
hi guys! i have a problem in passing the variable to function ,the variable which is used in<td> as table data. Code: <td onmouseover="todayevent(somevarible);" onmouseout="hideevent(somevarible);" >' + somevarible+ '</td> i want to pass somevariable by function todayevent(). how can i do this. plz help me someone. Hello all I have a big problem I have my php like this Code: <?
$codid=$_GET["cid"];
echo "
<script>
setTimeout(function() {CSelect();}, 100) ;
</script>
<div id=\"ReloadThis\"></div>";
?>
And my js funtion Code: function CSelect()
{
var
$http,
$self = arguments.callee;
if (window.XMLHttpRequest) {
$http = new XMLHttpRequest();
} else if (window.ActiveXObject) {
try {
$http = new ActiveXObject('Msxml2.XMLHTTP');
} catch(e) {
$http = new ActiveXObject('Microsoft.XMLHTTP');
}
}
if ($http) {
$http.onreadystatechange = function()
{
if (/4|^complete$/.test($http.readyState)) {
document.getElementById('ReloadThis').innerHTML = $http.responseText;
setTimeout(function(){$self();}, 10);
}
};
$http.open('GET', 'linii_c/select.php'+'?cod='+' PHP VARIABLE ', true);
$http.send(null);
}
}
who i can put my php variable into the funtion? Thanx in advence and sorry for my bad english! I am very new to learning JavaScript and I already seem to have come across a problem. I can get Scripts to work fine in the <body> but not all scripts seem to work in the <head> For example, this works fine: Code: <html>
<body>
<p id="date"></p>
<script type="text/javascript">
<!--
document.getElementById('date').innerHTML = Date();
//-->
</script>
</body>
</html>
However, it won't work if I place the script in the head like this: Code: <html>
<head>
<script type="text/javascript">
<!--
document.getElementById('date').innerHTML = Date();
//-->
</script>
</head>
<body>
<p id="date"></p>
</body>
</html>
It could just be that I broke one of the fundamental laws of coding that I don't know or something but like I said, I've only just started JavaScript. Also, the tutorial I have isn't to clear on the differences between using the <head> or the <body>. Just kinda says you can do both. I'd like to use the <head> wherever possible because it would be so much neater to keep all the JavaScript in one place and all the HTML in another. Pretty much like you can do with CSS. Anyway, I'd be much grateful if somebody can explain this to me. I'm trying to add a body class of 'day' if it's 6am-5pm and 'night' if it's 5pm-6am based on the user's local time. I tried the following but it didn't work. Any ideas? In the <head> Code: <script>
function setTimesStyles() {
var currentTime = new Date().getHours();
if(currentTime > 5 && currentTime < 17) {
document.body.className = 'day';
}
else {
document.body.className = 'night';
}
}
</script>
Code: <body onload="setTimeStyles();"> Also, is there a more elegant way to achieve what I need? Hello and thanks for letting me on this forum! Im pretty new to JScript and I am still getting used to it all. I am trying to make a Website that allows values to be selected from one form, transferred to the next form as a summary and then completed. The values are sent to the page fine but my Validation is broken. Here is my LINK code In the Form Code: <form id="Tickets" onsubmit="return ValidateForm()" action="Details.html"> And in the Submit Button Code: <input type="submit" id="OrderTickets" value="Order Tickets" onclick="return ValidateForm()" > My validation is as follows Code: <script type = "text/javascript">
function ValidateForm() {
if( document.getElementById('DepartingStation').selectedIndex == " ")
{
alert( "Please provide a Departing Station!" );
document.getElementById('DepartingStation').focus() ;
return false;
}
if( document.getElementById('ArrivingStation').selectedIndex == " ")
{
alert( "Please provide an Arriving Station!" );
document.getElementById('ArrivingStation').focus() ;
return false;
}
var Depart = document.getElementById('DepartingStation').value;
var Arriv = document.getElementById('ArrivingStation').value;
if( Depart==Arriv){
alert( "Train cannot depart and arrive at the same station!" );
return false;
}
if ( document.getElementById('ReturnTravel').checked=true; {
var valueDate = document.getElementById('OutwardDate').value;
if ( valueDate== null || valueDate== '')
{
alert('Please provide an Outward Travel Date!');
return false;
}
}
var valueRetDate = document.getElementById('ReturnDate').value;
if ( document.getElementById('ReturnTravelType').checked==true && (valueRetDate== null || valueRetDate== '' ))
{
alert('Please provide a Return Travel Date!');
return false;
}
}
Id appreciate any help anyone can share on this! Thanks. Hello, I am reading a block of code online and I don't understand why the output i in "Checking the value of: i " is always 5. Code: var someArray = [1,2,3,4,5],
len = someArray.length,
i = 0;
var count = 0;
for ( ; i < len; i++ ) {
setTimeout(function() {
console.log( count++ === i, 'Checking the value of: ' + i );
}, i * 300);
}
This will produce output below in console.log: Code: false Checking the value of: 5 false Checking the value of: 5 false Checking the value of: 5 false Checking the value of: 5 false Checking the value of: 5 The tutorial says the code will only render the final value in the sequence: 5 but not 1, 2, 3, 4, 5 as I would expect in the for loop. Could someone explain this to me. Thanks very much. function test() { var DIV = document.createElement('DIV'); } If I never insert DIV to any node its parentNode is null and being a local variuable it's reference is lost. Is it destroyed? or do I have to add it to a node then use removeChild? Hi!! I am trying to find out solution for this since long. I tried js but as I am not good with it, I just want to do this through PHP. I am adding dynamic rows when user clicks the Add Row button.I want to show the calculated amount like: line_total=qty*unit_price; PHP Code: if (isset($_POST['qty']) && sizeof($_POST['qty']) > 0) { for($i = 0, $maxi = count($_POST['qty']); $i < $maxi; $i++) { $quantity = (isset($_POST['qty'][$i]) && !empty($_POST['qty'][$i])) ? mysql_real_escape_string($_POST['qty'][$i]) : 0; $description = (isset($_POST['description'][$i]) && !empty($_POST['description'][$i])) ? mysql_real_escape_string($_POST['description'][$i]) : 0; $unit_price = (isset($_POST['unit_price'][$i]) && !empty($_POST['unit_price'][$i])) ? mysql_real_escape_string($_POST['unit_price'][$i]) : 0; $line_total = (isset($_POST['line_total'][$i]) && !empty($_POST['line_total'][$i])) ? mysql_real_escape_string($_POST['line_total'][$i]) : 0; ?> <?php $myvar=$quantity*$unit_price; ?> <script type="text/javascript"> jsvar = <?php echo $myvar; ?>; document.write(jsvar); // Test to see if its prints array: </script> } } This code works very well and displays the values.But if I use it in the function like; PHP Code: function line(elem) { jsvar = <?php echo $myvar; ?>; document.getElementById("line_total").value = jsvar; } And call it: PHP Code: <input type="text" name="line_total[]" id="line_total" onBlur="return line(this)"> It is not showing the result. Kindly guide me where I am going wrong? This is my function to add rows: PHP Code: <script type="text/javascript"> function addRow(tableID) { var table = document.getElementById(tableID); var rowCount = table.rows.length; if(rowCount<3) { var row = table.insertRow(rowCount); var colCount = table.rows[0].cells.length; for(var i=0; i<colCount; i++) { var newcell = row.insertCell(i); newcell.innerHTML = table.rows[0].cells[i].innerHTML; //alert(newcell.childNodes); switch(newcell.childNodes[0].type) { case "text": newcell.childNodes[0].value = ""; break; case "checkbox": newcell.childNodes[0].checked = false; break; case "select-one": newcell.childNodes[0].selectedIndex = 0; break; } } } else { alert("Maximum Limit Of 3 Rows Reached"); } } </script> Please help me I'm trying to echo a php variable to my javascript function but nothing is happening Basically this php page displays bunch of records with a radio button next to each record. So when the radio button is clicked it would open that record in a new window that is clicked. Code: <input type='radio' name='option' value='$ctr' id='$ctr' onClick="edit_record('<?php echo $ctr ?>')">
<script type="text/javascript">
function edit_record(){
var value = arguements[0];
alert("record id: " + value);
window.open("Edit.php", "Edit Record", "status=1, height=400, width=900, resizable=0");
}
Hey I have a JS value but it won't put the value in the brackets when i try to get the element by ID instead it is looking for the id named the same as the variable name. Here is what i got to explain better: Code: function fill_div(v)
{
document.getElementById(v).innerHTML="<img src='untitle.png' style='width:100%;height:100%;'/>";
}
var x = 0;
var y = 3;
var area = 1;
window.onload = fill_div(area+':'+x+':'+y);
It ends up looking for id v instead of id 1:0:3. Any idea how i correct this ? I've avoided cookies for 12 years. I made my first cookie today: Code: <p><a href="projects.html" onclick="document.cookie='whichPic=8'">Set Cookie</a></p> I have an external javascript sheet with an array of images w/text and the following code: Code: var current = 0;
function update() {
var pic = slides[current];
document.getElementById('proj_title').innerHTML = pic.title;
document.getElementById('proj_image').src = "images/slides/" + pic.image;
document.getElementById('proj_location').innerHTML = "<span>Location:</span> " + pic.location;
document.getElementById('proj_operation').innerHTML = "<span>Commercial Operation:</span> " + pic.commercial_operation;
document.getElementById('counter').innerHTML = (current + 1) + " of " + slides.length;
if(pic.link) {
document.getElementById('proj_link').style.display = "block";
document.getElementById('proj_href').href = pic.link;
} else {
document.getElementById('proj_link').style.display = "none";
}
}
When the user clicks the link, it should open the page to the slideshow and it should start on slide[8]. I think what I need to do is pass the value of the cookie to the variable "current", but I don't know how to do that. Also, I only need the cookie to last long enough for the new page to load (about 20 seconds), but all of the cookie scripts I've found set expiration in days. Any guidance would be appreciated. i am trying to pass the a variable "oneone" from a select box to a php page via java script. this is my html Code: <div id="wrapper"> <div id="content"> <form> Select a Customer: <select id="oneone" name="oneone" value=""> <option value="s_last">last</option> <option value="s_first ">first</option> <option value="c_city">cirty</option> </select> </form> <div> <form method="get" action="" class="asholder"> <small style="float:right">Hidden ID Field: <input type="text" id="testid" value="" style="font-size: 10px; width: 20px;" disabled="disabled" /></small> <label for="testinput">Person</label> <input style="width: 200px" type="text" id="testinput" value="" /> <input type="submit" value="submit" /> </form> </div> </div> this is my javascript Code: <script type="text/javascript">
var options = {
script:"test.php?json=true&limit=6&",
varname:"input",
json:true,
shownoresults:false,
maxresults:6,
callback: function (obj) { document.getElementById('testid').value = obj.id; }
};
var as_json = new bsn.AutoSuggest('testinput', options);
var optionsa = {
script:"test.php?",
varname:"one",
json:false
};
var as_jsona = new bsn.AutoSuggest('oneone', optionsa);
</script>
and the little part of my php Code: $input =$_GET['input']; $q =$_GET["one"]; can someone PLEASE tell my why i cant get this to work!!! I'm trying to overcome one feat, and I've just ran the course of my little knowledge of javascript. Here is the code that concerns us. Code: function loadXMLDoc()
{
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
populateParentWindow(xmlhttp.responseText);
}
}
xmlhttp.open("GET","https://www.syncupsolutions.net/currentdirectory-<?php echo $_COOKIE['User'] ?>.txt",true);
xmlhttp.send();
}
function populateParentWindow(Directory) {
$("#FTPContents").load('functions/testftp.php?HASH=' + Get_Cookie("ftphash") + "&reload=" + Directory) ;
};
$(function(){
$('#swfupload-control').swfupload({
upload_url: 'functions/upload-file.php?UID=' + Get_Cookie("User"),
file_post_name: 'uploadfile',
file_size_limit : "10000",
file_types : "*.*",
file_types_description : "All Files",
file_upload_limit : 5,
flash_url : "functions/js/swfupload/swfupload.swf",
button_image_url : 'functions/js/swfupload/wdp_buttons_upload_114x29.png',
button_width : 114,
button_height : 29,
button_placeholder : $('#button')[0],
debug: false
})
.bind('fileQueued', function(event, file){
var listitem='<li id="'+file.id+'" >'+
'File: <em>'+file.name+'</em> ('+Math.round(file.size/1024)+' KB) <span class="progressvalue" ></span>'+
'<div class="progressbar" ><div class="progress" ></div></div>'+
'<p class="status" >Pending</p>'+
'<span class="cancel" > </span>'+
'</li>';
$('#log').append(listitem);
$('li#'+file.id+' .cancel').bind('click', function(){
var swfu = $.swfupload.getInstance('#swfupload-control');
swfu.cancelUpload(file.id);
$('li#'+file.id).slideUp('fast');
});
// start the upload since it's queued
$(this).swfupload('startUpload');
})
.bind('fileQueueError', function(event, file, errorCode, message){
alert('Size of the file '+file.name+' is greater than limit');
})
.bind('fileDialogComplete', function(event, numFilesSelected, numFilesQueued){
$('#queuestatus').text('Files Selected: '+numFilesSelected+' / Queued Files: '+numFilesQueued);
})
.bind('uploadStart', function(event, file){
$('#log li#'+file.id).find('p.status').text('Uploading...');
$('#log li#'+file.id).find('span.progressvalue').text('0%');
$('#log li#'+file.id).find('span.cancel').show();
})
.bind('uploadProgress', function(event, file, bytesLoaded){
//Show Progress
var percentage=Math.round((bytesLoaded/file.size)*100);
$('#log li#'+file.id).find('div.progress').css('width', percentage+'%');
$('#log li#'+file.id).find('span.progressvalue').text(percentage+'%');
})
.bind('uploadSuccess', function(event, file, serverData){
var item=$('#log li#'+file.id);
item.find('div.progress').css('width', '100%');
item.find('span.progressvalue').text('100%');
var pathtofile='<a href="uploads/'+file.name+'" rel="nofollow" target="_blank" >view »</a>';
item.addClass('success').find('p.status').html('Done!!! | '+pathtofile);
})
.bind('uploadComplete', function(event, file){
// upload has completed, try the next one in the queue
$(this).swfupload('startUpload');
loadXMLDoc();
})
You'll notice at the beginning, the functino loadXMLDoc. This function GETS the contents of a text file, which is the path to the directory the user is browsing. The next function is populateParentWindow. This is the function that dynamically updates the div that displays the files and folders of the current directory so they can see their file has been uploaded. Scroll down a little further and you'll see my problem. Code: $(function(){
$('#swfupload-control').swfupload({
upload_url: 'functions/upload-file.php?UID=' + Get_Cookie("User"),
At the bottom of the above line, the : upload_url, I need it to contain the contents of the text file also, but in a POST value, like the UID, something like, directory=thedirectory. But, when I try Code: $(function(){
$('#swfupload-control').swfupload({
upload_url: 'functions/upload-file.php?UID=' + Get_Cookie("User") + "&directory=" + xmlhttp.responseText,
It gives me an undefined, right off the bat before any uploading, or anything at all takes place. I'm guessing this is because this value is set on page load, and not before the actual upload actually happens. Does anyone have any ideas how I can set this value when the upload begins with the variable from the text file ? Keep in mind it has to be inside the function it's in now or it wont work. Note that the loadXMLDocument function isn't called until the upload is complete, the .bind at the bottom of the page. I've tried pulling it from the text file several ways, setting the document.title to the current directory and calling it in the function, it just always seems a step behind me or undefined. Any ideas ? Hello. I am very new at using javascript and jquery. Right now Im working on a website, and it has a hierarchical menu in the right and im also doing some content loading in a div, all that with javascript. My problem is that when they click on a link, I need to pass a variable "id" through the link. I dont want to pass it in the url, but I want to pass it in another way, for every link the id is going to be different. How can I pass a variable to another page and how can I retrieve it in that page so I can use it for the content loading? Thanks! Hello again! Is there any way to pass a function(with its parameters) to another function using a parameter? Examples: Here is how I do it now: PHP Code: function output(text){ alert(text); } function bla(text, func){ output(text); } bla("Text is here", output) //Outputs "Text is here" I only want to pass the function to bla() as a parameter. I need something like this: PHP Code: function output(text){ alert(text); } function bla(func){ output(); } bla(output("Text is here")) //Outputs "Text is here" Is this possible in some way? Thanks in advance. I have garlic.js automatically local storing my radio button value but the onclick function does not run when the page reloads. Is there a way to work around this ??
Reply With Quote 01-15-2015, 11:17 PM #2 Old Pedant View Profile View Forum Posts Supreme Master coder! Join Date Feb 2009 Posts 28,311 Thanks 82 Thanked 4,754 Times in 4,716 Posts And we are supposed to guess what "garlic.js" is doing? Or what it is? And do you really mean that the onclick event handler does not work? Or do you mean that the radio buttons are set to a different state but the click() for the chosen button is not executed? That is, it is not the onclick that is missing, it is the click ?? Hi Guys, I have a new problem My site is run on wordpress, but I'd like to customise the menu so that if the user is logged in the menu displays "Logged In" and if they are not it displays "Log In". Normally I would just use an if statement in PHP to output the required html, but as I can't use PHP code in the menu item I need to use Javascript. So, the way I figured this would work is: 1) PHP code in the header checks to see whether the user is logged in 2) This code then outputs JS to define a variable (varCheckLogin) 3) JS within the menu checks varCheckLogin and outputs the html i want This sounds good hopefully. Unfortunately this isn't working at the moment. The code I have is: HEADER: (I know this works as the variable is being output correctly in the source code) Code: <?php if (is_user_logged_in()) {
echo '<script type="text/javascript"> varLoginCheck = "Yes"; </script>';
} else {
echo '<script type="text/javascript"> varLoginCheck = "No"; </script>';
}
?>
MENU ITEM: Code: <script>
if (varLoginCheck = "No")
{
document.write('<span class="mmLogin">Log In</span>');
}
else
{
document.write('<span class="mmLogin">Logged In</span>');
}
</script>
I put an alert in the menu item and it always sees varLoginCheck as "Yes". Any ideas why this could be? All help is much appreciated. Thanks Sam Hello, I am trying to access a dynamic asp variable with onclick either in a javascript function where I can use it globally or set another div id with this dynamic variable. Any help is very much appreciated. Thank you! <script> function doSomething(article_id) } return article_id; } </script> <a href="#test" onClick="doSomething("<%=rsHeadline("article_id")%>")">try here...</a> <div id="test"> <%articleid = request.querystring("article_id") %> <% Response.Write articleid %> The article id is articleid</div> |
|||||||