JavaScript - Alternate To Eval For Use In Leaflet.js
Hi there,
I'm working with leaflet.js to create a web map which is working well so far however I've run into a rookie js problem. I have a js fiddle which shows my code here. The problem I have is that I need convert a string like "polygon" to polygon without the quotation marks. According to the Leaflet API, removeLayer takes an iLayer parameter eg removeLayer( <ILayer> layer ). Currently I'm passing it a string which I feed through eval, I gather is less than ideal. There is a post here on stack overflow but I can't make any sense of the answer unfortunately. If anyone can provide any advice it would be greatly appreciated. Thanks, Rowan Reply With Quote 01-07-2015, 12:50 PM #2 rnd me View Profile View Forum Posts Visit Homepage Senior Coder Join Date Jun 2007 Location Urbana Posts 4,497 Thanks 11 Thanked 603 Times in 583 Posts if you add Code: window.circle=circle; window.marker=marker; window.polygon=polygon; then you can use syntax like layerClicked = window[event.target.value]; instead of eval. you can use a different object than window, as long as it's global and consistent. Similar TutorialsCode: var i = 1; var obj = document.createElement("pStretch" + i); obj.id = "pStretch" + i; obj.className='circle_point drag'; eval("pStretch" + i + ".obj = ") = obj; document.body.appendChild(obj); Red does not work. What I want is to store all regarding DOM object into a property of another object named the same as id of that DOM object. What to do to make that work ? Hi for purpose of learning only. Stretching myself by looking at OOP in JSBible. In the book he used a frameset which I hate so I changed to innerHTML. I have two issues A) the code uses eval (highlighted)--- i'd like to not use that but I can't work out how to change it. B) how to show selected ie Earth when the page loads. I've tried loads of ways but just not getting it. here is full code working Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>OOP test PLANETS</title> <style type="text/css"> .highlight{ color:orange; font-weight:bold; } </style> <script type="text/javascript"> //* <![CDATA[ //define method function showPlanet(){ var result = ''; result += "Planet: <span class='highlight'>"+this.name+"</span><br />"; result += "Diameter: <span class='highlight'>"+this.diameter+"</span><br />"; result += "Distance from Sun: <span class='highlight'>"+this.distance+"</span><br />"; result += "One Orbit Around Sun: <span class='highlight'>"+this.year+"</span><br />"; result += "One Revolution (Earth Time): <span class='highlight'>"+this.day+"</span>"; var insert = document.getElementById("myinsert"); insert.innerHTML = result; } function planet(name,diameter,distance,year,day){ this.name = name; this.diameter = diameter; this.distance = distance; this.year = year; this.day = day; this.showPlanet = showPlanet; //showPlanet func now a method of planet } //create new planet objects in series of variables var Mercury = new planet("Mercury","3100 miles","36 million miles","88 days","59 days"); var Venus = new planet("Venus","7700 miles","67 million miles","225 days","244 days"); var Earth = new planet("Earth","7920 miles","93 million miles","365.25 days","24 hours"); var Mars = new planet("Mars","4200 miles","141 millon miles","687 days","24 minutes"); var Jupiter = new planet("Jupiter","88.640 miles","483 million miles","11.9 years","9 hours 50 minutes"); var Saturn = new planet("Saturn","74,500 miles","886 million miles","29.5 yeras","10 hours 39 minutes"); var Uranus = new planet("Uranus","32,000 miles","1.782 billion miles","84 years","23 hours"); var Neptune = new planet("Neptune","2.793 billion miles","165 years","15 hours","48 minutes"); var Pluto = new planet("Pluto","1500 miles","3.67 billion miles","248 years","6 days, 7 hours"); function planetInfo(which){ i = which.selectedIndex; //how to get same result without using eval eval(which.options[i].text + ".showPlanet()"); } //*/// ]]> </script> </head> <body> <h1>Daily Planet</h1> <form> <select name="planetList" id="planetList" onchange="planetInfo(this)"> <option>Mercury</option> <option>Venus</option> <option selected="selected">Earth</option> <option>Mars</option> <option>Jupiter</option> <option>Saturn</option> <option>Uranus</option> <option>Neptune</option> <option>Pluto</option> </select> </form> <div id="myinsert"> </div> </body> </html> ok tell me if I wrote this properly Code: eval('windowBody' + windowCount + '.style.backgroundColor = "black";'); I'm attempting to be able to create multiple windows on my page http://opentech.durhamcollege.ca/~in...rittains/labs/ In context, the following would be applied to an admin-only menu page under the WordPress Dashboard.(e.g. not for public access) Reading MUCH of the evils of eval() however, my use of it below appears nonetheless susceptible to injection attack, and I was hoping for suggestions as to better approach, as I myself am at something of a loss. PHP Code: <!-- as many as 15 of these per page --> <select class='glry_update' id='<?php echo $prd_tbl_id; ?>'> <option value=""> **** </option> <option value="syndicate">Syndicate</option> <option value="rescind">Rescind </option> <option value="feature">Feature </option> <option value="defeature">DeFeature</option> <option value="flag">Flag</option> <option value="deflag">DeFlag</option> <option value='edit'>Edit</option> <option value="drop">Delete</option> </select> PHP Code: //jQuery update of gallery item where $('.glry_update') is a select/dropdown input $('.glry_update').change(function() { var editId = $(this).attr('id');//corrisponds to record_id# in db Ex:"110" var call = $(this).val();//selected value Ex:"flag" $('#itemId').val(editId); //sole input(hidden) in form[editItem] $('#'+editId+' option[value=""]').attr('selected', true); //reuturn 'Select' to default state if(call == 'edit') $('#editItem').submit();// return record detail page for editing if(call == 'drop') { var cnfm = 'Do your really want to delete this item'; if (confirm(cnfm)) drop(editId,'glry'); else return false; } else { var functCall= call+'('+editId+')'; // Ex: flag(110) alert(functCall);return false; // DANGER? --- DANGER! --- DANGER? --- DANGER! --- eval(functCall); // DANGER? --- DANGER! --- // DANGER? --- DANGER! --- DANGER? --- DANGER! --- } }); Hello All, I found lightbox to be very useful for certain things, however I was hoping someone could help me out with the code or point me to a tutorial that could do what I am looking for. Similar to lightbox (http://lokeshdhakar.com/projects/lightbox2/) how you can click on an image to open a separate window to display a slideshow, however with lightbox you need to display all images that are included in the slideshow, i.e. thumbnails. I was hoping to find a way to do something similar but without having to display all the images as thumbnails. I want to display only one picture which the user can click on that will open a new window and display a slideshow with multiple images. If this possible? Can someone help me out with this? Any tips or tricks or tutorials that can be shared with me I would greatly greatly appreciate it. Many thanks, bg Code: <HTML> <HEAD> <TITLE>John's JavaScript!</TITLE> <SCRIPT TYPE="text/javascript"> function solve(math) { form.answer.value = eval(math); } </SCRIPT> </HEAD> <BODY> <FORM METHOD="POST"> Enter a JavaScript mathematical expression: <INPUT TYPE="text" NAME="entry" VALUE="" /> <BR /> The result of this expression is: <INPUT TYPE="text" NAME="answer" VALUE="" onFocus="blur()"/> <INPUT TYPE="button" NAME="submit" onClick="solve(form.entry.value)"/> </BODY> </HTML> The only problem I am facing is changing form.answer.value It won't change, why not? Dear all, I'm new with JavaScript, so can please help me with this macro? I need to reload URL (in this case refresh same page) until I don't have word beginning with capitalized A, B or C. I can't find the way to create loop inside EVAL. Can somebody help me please? Thank you! Code: VERSION BUILD=7401110 RECORDER=FX TAB T=1 URL GOTO=http://watchout4snakes.com/CreativityTools/RandomWord/RandomWord.aspx SET !EXTRACT_TEST_POPUP NO TAG POS=1 TYPE=SPAN ATTR=ID:tmpl_main_lblWord EXTRACT=TXT SET !VAR1 EVAL("var re = /^[A || B || C]/gi; var str = \"{{!EXTRACT}}\"; while(str.search(re) == -1) {URL GOTO=http://watchout4snakes.com/CreativityTools/RandomWord/RandomWord.aspx}") PROMPT {{!EXTRACT}} Hi - I wrote some code that uses the eval function. I am in the process of rewriting the code to improve on it where possible (a learning exercise). I have read that eval is evil because of security concerns and that the eval'd code is not compiled prior to runtime. I don't think my use of eval presents a security concern. However, I wonder if there is some way to replace the eval function with a more natural technique. I have done this using eval(); also using a new Function method. I have tried using a window[] method but I can't get that to work. OK, on the the actual code: The purpose of the javascript is to count keystrokes. I have a bunch of global counter variables declared in this fashion: Code: MyLib.CountQ=0; MyLib.CountW=0; MyLib.CountE=0; MyLib.CountR=0; MyLib.CountT=0; MyLib.CountY=0; MyLib.CountU=0; MyLib.CountI=0; MyLib.CountO=0; MyLib.CountP=0; When the Count function is called I want to update the appropriate counter. Thus: MyLib.Count'+varkeyname+'+=1; Where varkeyname is 'q' or 'w' or 'e' etc. Code: //MyLib is a global variable namespace. function Count() {//updates counters var varkeyname= specialchars(MyLib.KeyName);//identity of the key pressed. var stra="Count"+varkeyname;// string used to change an html value. //var strb=eval("MyLib.Count"+varkeyname+"+=1");//original eval function that worked just fine. var strb='return MyLib.Count'+varkeyname+'+=1';//string to update a counter. var myfunc= new Function(strb);//Function intended to replace the eval function - this also works just fine. document.getElementById(stra).value = myfunc(); ... You can see that I have replaced the eval function with another function - but since this is also not compiled prior to runtime I don't think this is an improvement. I have read about using the window[string] method but I can't get it to work. This is not a critical issue but I'd appreciate any comments. Thanks, Jim Hi All, This is my function function outputSelected() { alert(window.opener.document.forms[0].txt11_19.value); alert(window.opener.document.forms[0].rdo11.length); var questionID = document.forms[0].cntQuestion.value; var choiceID = document.forms[0].cntChoice.value; var txtValue = document.forms[0].strEmpNo.value + " " + document.forms[0].strName.value; alert(txtValue); var leftValue = 'window.opener.document.forms[0].txt' + questionID + '_' + choiceID + '.value =' + txtValue; eval(leftValue); } all the alerts work as expected. bu the eval function does not. error: expected ';' any ideas what is happening. or is there any other way of doing this. in IE9 Browser list of country names sorting on keys. we are using Ajax javascript: Code: var data= remoteRequest(url); the data like Code: data={" 11":"Australia"," 14":"Bermuda"," CAN":"Canada"," 12":"France"," 15":"Germany"," IND":"India"," 16":"Russia"," 13":"South Africa"," 10":"UK"," USA":"United States"} name_set= eval('('+data+')'); it fine in all browser the array like Code: name_set[11]=Australia name_set[14]=Bermuda name_set[CAN]=Canada name_set[12]=France name_set[15]=Germany name_set[IND]=India name_set[16]=Russia name_set[13]=South Africa name_set[10]=UK name_set[USA]=United States but in the IE9 browser array keys sorting as like. Code: name_set[10]=UK name_set[11]=Australia name_set[12]=France name_set[13]=South Africa name_set[14]=Bermuda name_set[15]=Germany name_set[16]=Russia name_set[CAN]=Canada name_set[IND]=India name_set[USA]=United States so please help me, how to stop the array sorting in IE9. thanks in Advance, Venu Hi there! I set up a variable that should replace HTML code when run but it doesn't seem to be doing that... Here it is: Code: var finale = "document.getElementById(" + theid + ").innerHTML='test';"; eval("finale"); Any idea why? (My console isn't showing any issues) Thanks! Matt I have written JS , in which I used activex control which does not work on mozila , anyone has idea to to same thing without activex , here is code which just upload the textfile contains on html page . <html> <head> <script type="text/javascript" language="javascript"> function Read() { var Scr = new ActiveXObject("Scripting.FileSystemObject"); var CTF = Scr .OpenTextFile("J:\\Users\\Karimkhan\\Desktop\\2011-03-01.txt", 1, true); data = CTF .ReadAll(); document.write("<pre>" + data + "<pre>"); //alert(data); CTF .Close(); } </script> </head> <body onLoad="Read()"> </body> </html> Hi All, I have a problem in which I try to execute a funcition via a document.write() and it throws an "object expected" error. Overall I am making an interface for MS ACCESS .mdb table via ADODB using JavaScript and I want to be able to click on a link and the id is used to delete that entry. Code: My function is: Code: function deleteRecord(del) { var adoConn = new ActiveXObject("ADODB.Connection"); var adoRS = new ActiveXObject("ADODB.Recordset"); adoConn.Open("Provider=Microsoft.Jet.OLEDB.4.0;Data Source = {path to }knowBA.mdb'"); adoRS.Open("Select * From know where ID="+ del, adoConn, 1, 3); adoRS.Delete; adoRS.Close(); adoConn.Close(); } The code using the funcition is - oh and the numric KEY is rs(0) : Code: if(!rs.bof) { document.write("<table width='700' border='1' align='center' cellpadding='2' cellspacing='0' bgcolor='#FFFFFF'>"); rs.MoveFirst() while(!rs.eof) { document.write("<tr><td><div align='center'><strong>"+rs(1)+"</strong></div>"); document.write("<strong>Keyword(s):</strong> "+rs(3)); document.write("<br><strong>Entry:</strong> " +rs(2)+" "); document.write("<A HREF='javascript:onClick=("+"eval(deleteRecord(" +rs(0)+"))"+")'>delete</A> "); document.write("</td></tr>"); cnt=cnt+1; rs.MoveNext() } document.write("</table></form>"); } if (cnt==0){ alert ("Sorry, there are no results on that search.");} rs.close() cn.Close(); } </script> Thanks for any hints on how to accomplish this! An application under development has a set of core functions that carry out common tasks and a 'machine' that animates panels of lists of names and menus and provides another panel for action calls. (see attached pic). Selection of a name identifies object(s) to be worked on and menu couplets like "Name+Edit" call devices (each in a separate js file). Each js file replaces any files in the deviceScript holder in the hta file. I used to use eval(couplet+"Start")() to initiate the device, but having read about the evils of eval it dawned on me that it was unnecessary and just gave each device a start() function ... and also an optional refresh(), and compulsory finish() to pick up results and clean up. This seems to work well on my machine. The hta is intended to run locally picking up json type data and devices locally and via the net and I am concerned that importing js files is just as evil, but isn't it just like opening a web page? Any guidance really appreciated. Chris Hi all, I have a website that allows users to enter complex mathematical formulas into a text field and evaluates them. I am currently using eval() because it not only can handle all the standard mathematical functions, but also gives them access to the Math object. That way the users can use functions such as Math.max() and everything else. I realize, though, that using eval is evil, I assume because a malicious user might throw in some more damaging javascript that would be run without checking it. (That's why eval is evil, right?) Is there a way that I can allow my users to construct complex mathematical formulas and use the Math object (or an equivalent) without potentially opening my site up to harm? Hi, i want a page with rotation of images, with fading. I'm trying with two images, but i see only the first image. Firebug console give me this error: Quote: $ is not defined: eval ('div =$("#focus_'+categoria+'")'); This is the entire code: Code: <script type="text/javascript"> array_img_2 = Array(); array_img_2[0] = 'PhpLib/../upload/2-Galleria/ima_galleria_03.gif'; array_img_2[1] = 'PhpLib/../upload/2-Galleria/ima_galleria_02.gif'; </script> <noscript>...</noscript> <div id="focus_2"> <a href="index.php?cp=4" title="vai alla gallery"> <img width="924" alt="immagini dei prodotti" src="PhpLib/../upload/2-Galleria/ima_galleria_03.gif" /></a> </div> <script src="PhpLib/jquery-1.2.6.min.js" type="text/javascript"> </script> <script type="text/javascript"> categories = Array(); categories[0]='2'; var numvisible_2 = 0; function changeImage(categoria){ var d = document; var aux = parseInt(eval('numvisible_'+categoria)); var array_img = eval('d.MM_'+categoria); if (array_img.length>1){ var img_index =(aux+1)%array_img.length; var div,img; eval ('div =$("#focus_'+categoria+'")'); eval ('img =$("#focus_'+categoria+' img")'); var control = "url('"+ array_img[img_index].src+"')"; $(div).css('background-image', control); $(img).animate({opacity:0.01},3000,function(){ this.src = array_img[img_index].src; $(img).animate({opacity:1},1000); }); eval ("numvisible_"+categoria+"=img_index"); } } function Init_Focus(){ var j; for (j=0; j<categories.length; j++) { var categoria = categories[j]; var array_img = eval('array_img_'+categoria); MM_preloadImages(array_img, categoria); setInterval("changeImage("+categoria+")",5000); } } function MM_preloadImages(img, categoria) { //v3.0 var d=document; eval("d.MM_"+categoria+"= new Array()"); var i,j=0; var a = img; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ eval("d.MM_"+categoria+"[j]=new Image"); eval("d.MM_"+categoria+"[j++].src=a[i]"); } } Init_Focus(); </script> Hi folks, Any suggestions on how you might achieve the following without using eval()? I've come up a bit short Code: function addOrSubtract(operator) { var a = 10; var b = 5; var answer = eval(a + operator + b); alert(answer); } addOrSubtract('+') // alerts 15 addOrSubtract('-') // alerts 5 Would help me tidy up some code a lot thanks. I'm trying to make these two messages change every two seconds. I'm not sure if the setInterval needs to be outside of the function. Also, not sure about HTML action"". It's not working and I'm not sure where my mistakes are. Very frustrating. I know it's easy for some of you, please help! <script type="text/javascript"> var curMessage="message1"; var changeMessage="message2"; function adMessage() { if (curMessage) {document.getElementbyId("message").value = "Place your Thanksgiving orders today!"; changeMessage; setInterval ('adMessage()',2000); } else (changeMessage); {document.getElementbyId("message").value = "All orders must be received by November 20th!"; curMessage; setInterval ('adMessage()',2000); } } </script> </head> <body onload="adMessage();"> <h1>Forestville Foods</h1> <h2>Party Platters</h2> <form name="advertising" action="adMessage"> <input type="text" name="message" size="60" value="Place your Thanksgiving orders today!" /> </form> Hi, Is there away to alternate DIV rows in a specific section. When I try to alternate the DIVs it alternates everything that is a DIV on the page. I want to just alternate a DIV table. Is this possible? Thanks alot Joe Hey all- I've gotten accustomed to using coda slider 2.0 to do some cool interactive sliding elements on my pages. However, i need something similar that will fade instead of slide. I've searched all over their home forums and it seems like no one there has an answer for how to implement the change in the current codaslider infrastructure. (http://www.ndoherty.biz/demos/coda-slider/2.0/) I need something that has all the functionality of coda slider (easy transitions, div's containing lots of content- both images and text, forward/back buttons, autoplay) but with a fade transitions any ideas? |