Accessing javascript object named via php globally - javascript

I have a bunch of CSS properties stored in a MySQL database accessed via PHP. I need to make these properties available to JavaScript after the page has finished loading.
So what I did is foreach row, put the values in a Javascript object like so:
foreach ($cellcontent as $cellproperty) {
echo 'var '.$cellproperty->cell_id.' = {cellwidth:"'.$cellproperty->cell_width.'"};';
}
(For simplicity's sake I've only included one object property here but in reality there are many more.)
My problem is that at runtime, via JavaScript I get the cell_id reference which is somewhere in the html page like so:
var dacell = $(this).closest("div");
var cellid = dacell.attr("id");
So at this point, cellid is equal to the name of my var from the php output.
But when I try to get the property of my object (cellwidth) via JavaScript it doesn't work. Says its undefined when I try to see the value in an alert:
alert(cellid.cellwidth);
I think I'm just not referencing the actual object at this point and just trying to get a property of what has now become a string.
Is there a way to get back the reference to the object itself?

var cellid = dacell.attr("id");
The variable cellid is a string. Your hopes would be that the variable your are looking is in the global namespace which you can access via the following:
window[cellid].cellwidth

It's an awfull practice to pollute the global namespace with so much stuff.
Fetch all the values you need to inject into the JS, create an associative Array and inject it as a single JSON into the Page.

Nevermind everyone. The eval() javascript function fixed it all.
Instead of doing:
alert(cellid.cellwidth);
I did:
alert(eval(cellid).cellwidth);
and everything worked.
Thanks for all your time.
Cheers,
Erick P.

Related

What is stored in variable cols in : var $cols = $('.sortdivs').on('click',function(){...});

var $cols = $('.sortdivs').on('click',function(){…});
I know that the function will run when any element with sortdivs class is clicked.
I dont know what is being stored in variable cols and how it can be used.
I tried printing variable cols and i got 'object Object' as the output.Thanks in advance.
The return value from .on is simply the collection that it was called on, for chaining purposes.
$cols, therefore, is the jQuery object containing a list of elements matched by $('.sortdivs') at the time of exection (NB: not at the time of click).
[object Object] is the string representation of any object. Try to inspect the object in another manner, for instance by using console.log($cols) to be able to get more information of just the output of a simple toString().
You can see access all the property store in variable by writing $cols[0] like ATTRIBUTE_NODE,canHaveChildren, canHaveHTML etc. You can debug and see what is inside $col[0] and based on your requirement you can manipulate them. I hope this will be helpful for you.

how to get access set of values from html source to javascript for processing

I have set of values in html source coming from my template.
It looks like
var formValues = {value1 :'Y', value2:'Y', value3:'N'}
How do i access them in my js file for processing.
Within the same source I have another variable
var myVar = 'myValue'
And I am able to access this var by just calling it in my javascript by myVar.
I have tried like formValues.value1 but it's not working.
I'm not sure if that will solve the problem, but you have an extra s in formValues.values1 like #Hunan mentioned in comment, should be formValues.value1.
var formValues = {value1 :'Y', value2:'Y', value3:'N'}
console.log(formValues.value1); //return Y
Hope this helps.
Where is your formValues declared with respect to where you attempt to read it?
JavaScript has function scope. I suspect that if you cannot access it, it's likely either within another function or is declared after you are looking for it.

Check passed data with a view is not empty in laravel

I am using laravel 4 and I want to pass a data with a view.
I have used this code in a controller.
$view = View::make('settings.editEvent');
$view->bounderyData = $bounderyData;
And I want to check whether this data exists or not in the view settings/editEvent.blade.php
Tried using this..
<script>
if('{{$bounderyData.length()}}'!=null)
console.log('exists');
</script>
Error :
Array to string conversion error
How can I check the existence ?
Do not assign the data to the View variable, but instead, pass it along using with as Laravel requests you to use:
$view = View::make('settings.editEvent')
->with('bounderyData', $bouderyData);
Actually both of the snippets work the same way. You can either pass data using with() method or by assigning it to view as property. So it doesn't really matter. But it looks like you are using some weird syntax because you are trying to access method length() using dot syntax inside Blade echo statement. Try:
if({{count($bounderyData)}}!=null)
console.log('exists');
or something similar. Remember that everything inside {{}} is going to be echo'ed by PHP. So if you have some sort of array there you may either want to count number of elements or maybe cast it to JSON and then decode it inside Javascript. If you still have problem, let us know what is the issue.

JavaScript: how to pass object value from one function to another

I am using code lines like the following in order to fetch data from an intranet website:
util.setProp(obj, "firstNameOld", $(msg).find('#fname_a').text());
Now I have another function in the same file where I want to use the above again, resp. the value of that object - currently I am hard-coding this ('Test') for test purposes:
util.setProp(obj, "firstNameNew", 'Test');
How can I pass the value from the firstNameOld object in one function to the firstNameNew object in another function ? If a solution with global variables is better here than this would work as well.
Many thanks for any help with this, Tim.
I've never used the framework that includes util But I imagine that if there is a setProp() then there has to be a getProp() or something similar.
If so, you could do something like
util.setProp(obj, "firstNameNew", util.getProp(obj, "firstNameOld"));
This also relies on the assumption that you want to copy from two properties in the same object.
If not, then pass the desired source object in the getProp() call.
My guess is that functions (or properties) are called "firstNameOld" and "firstNameNew", so the first time you get it from selector, second time you want to do the same.
Try to use the local variable like that:
var text = $(msg).find('#fname_a').text();
//
util.setProp(obj, "firstNameOld", text);
//
util.setProp(obj, "firstNameNew", text);

Programatically output variable and object names as literal text strings

I'd really like to track variables without switching between Firebug console windows or clicking around so much, so I want to draw a runtime viewer of variable names and their corresponding values that will display on the page of the app I am building.
I'd like to two functions, show(variableName) and freeze(variableName). They will output both the variable's value and the name of the variable or object as a literal string which will serve as the text label in the viewer. freeze(variableName) is the same as show(variableName) except with a setTimeOut timer for tracking loops.
I'm sure I'm missing something basic, but I haven't found out a way to get the string that comprises the name of a value programmatically so I can use it as a label. I guess I could create the table with hardcoded labels prior to runtime and just populate it with values at runtime, but I really want to generate the table dynamically so it only has those variables I specifically want to show or freeze. Simple functions:
foo1 = "Rock";
show(foo1);
foo2 = "Paper";
show(foo2);
foo3 = "Scissors";
show(foo3);
should output this via getElementById('viewer-table'):
<table>\<tr><td>foo1</td><td>Rock</td></tr><tr><td>foo2</td><td>Paper</td></tr><tr><td>foo3</td><td>Scissors</td></tr></table>
I've tried this solution:
How to convert variable name to string in JavaScript?
and eval() but it's not working for me...I dunno, shouldn't this be easy? Getting frustrated...
Thanks,
motorhobo
I am not sure you can actually get the "name" of the variable that is being passed into a function for two reasons:
1) The variable is just an identifier. In fact, you could have multiple identifiers reference the exact same object. You are (generally) passing that reference, not any actual object.
2) The show/freeze function is going to stomp on the identifier name, either through named arguments in the function declaration or by referencing them through the arguments array.
I was trying to think if there was some clever way to use the arguments.callee or the stack property on an exception in Firefox... but I can't see anything that would expose the arguments as you desire.
What I would recommend is to simply add the name of the variable and its value to a simple object, and call one of the various jsDump methods (I prefer the one in QUnit):
function show(o) {
document.getElementById("viewer-table").innerHTML = QUnit.jsDump(o);
}
// actually use the method
show({"foo1":foo1});
There's no easy way to solve this as the called function simply doesn't know the original name of the variable. You couldn't solve this with reflection even (esp. in javascript) so you'll have to pass the name of the variable to the function too. To follow the link you posted:
function show(varObject)
{
for(name in varObject)
{
alert(name + ": " + varObject[name]);
// save both name and reference to the variable to a local "to observe array"
}
}
And call it with
var test = "xxx";
show({'test' : test});
Within the for loop you could add easy variable to a monitor array and update your gui in fixed time intervalls (you can't be notifed when a signle variable changes it's value. You need some kind of global monitor/observer which exactly you're trying to create).

Categories