JavaScript - Is It Possible To Use A Variable Out Of A Different Function?
Example:
Function First() { Var = x1 <--- Use this variable } Function Second() { Var = x2 Var = x1 + x2 } I know this is not the way in the example...but just making sure you know what im talking about. Similar TutorialsI don't know how I should do ? Quote: <html> <head> <script type="text/javascript"> function add(a,b){ y=a+b return y } var aaa = add(one,two) //one needs to get somehow get the value of yil, in this case 10 var one = function reas(){i=10;if(i<10){yil = 15}; else{yil = 10; yil = one;}; var two = 20; document.write(y) </script> </head> </html> also why doesn't this work? Quote: <html> <head> <script type="text/javascript"> function adder(a,b){ var k=a+b; return k } var hes=adder(5,kol); kol=40; alert(hes); </script> </head> </html> you cannot have variables in callback functions? Thank you in advance if someone can help. I have been banging my head against the wall for hours now. Here is the code: Code: for (var i = 0; i < BS_crm['activityTypes'].length; i++) { var clickFunc = function(){ activityList.showForm( -1, {blockType:[""+BS_crm['activityTypes'][i]['id'], "0"]} ); }; var type = { value: BS_crm['activityTypes'][i]['id'], label: "Add New "+BS_crm['activityTypes'][i]['label'], css: BS_crm['activityTypes'][i]['css']+"_16", onClick: clickFunc }; previewLinks.items.push( type ); } Now, basically what I am doing here is running through one array to create an array of objects, that will be used to create links that will use whatever onClick function I pass it. The problem is that on the second line I need the BS_crm['activityTypes'][i]['id'] to be a value, not a reference. If that line was simply changed to: Code: var clickFunc = function(){ activityList.showForm( -1, {blockType:["3", "0"]} ); }; then everything would work as I need. How can I make this happen? I would really appreciate any help. Thank you again in advance. Hi I'm trying to get a variable named 'html' from one function and use it in another. My JavaScript knowledge is limited, so will be grateful for any help Please see code below Code: function createMarker(point, name, label, address, type) { var marker = new LabeledMarker(point, {icon: customIcons[type], labelText: label, labelOffset: new GSize(-6, -10)}); markerGroups[type].push(marker); GEvent.addListener(marker, 'click', function() {GEvent.trigger(map,"click",null,point,point); var html = '<div>LatLng:' + name + '</div><a href="javascript:void(0)" onclick="javascript:map.getInfoWindow().maximize()">more info.. </a>'; marker.openMaxContentTabsHtml(html); }); return marker; } // need to get html variable from the above function into this one below GEvent.addListener(map, 'click', function(ov, latlng, ovll) { if (latlng) { var regular = '<div id="sum">LatLng:' + latlng + '</div><a href="javascript:void(0)" onclick="javascript:map.getInfoWindow().maximize()">more info.. </a>'; var summary = '<div id="sum">Address of' + latlng + '</div><a href="javascript:void(0)" onclick="javascript:map.getInfoWindow().restore()">less info.. </a>'; var panoDiv = document.createElement('div'); panoDiv.width = "400px"; // can be anything, will be auto resized panoDiv.height = "200px"; var tabs = [new MaxContentTab('address', '<div id="address"></div>'), new MaxContentTab('streetview', panoDiv)]; map.openMaxContentTabsHtml(latlng, regular, summary, tabs, { maxTitle: "More Information", selectedTab: 'address',// or use index 1, style: { tabOff: { backgroundColor: '#CCCCFF' } },maximized: document.getElementById('maximized').checked }); } }); Hi there, Sorry that the title of this is not very descriptive but I really don't know how to describe what it is i am after. I have a variable that contains an image source. (well I hope it does) Code: var imagebackground = (this.parentNode.parentNode.parentNode.childNodes[1].childNodes[0]).src; Now I need that variable to spit out the image source into where it says background, but wrapped in a url( ) Code: $jQ(document).ready(function(){ $jQ(".btn-cart").click(function(){ $jQ('#floater').animate_from_to('.block-cart', { pixels_per_second: 200, initial_css: { background: (THIS IS WHERE I WANT IT) } }); $jQ(this).attr('id', ''); $jQ(this.parentNode.parentNode.parentNode.childNodes[1].childNodes[0]).attr('id', ''); }); }); So basically if the variable was to equal - http://www.google.co.uk/image.jpg - it would function like: Code: $jQ(document).ready(function(){ $jQ(".btn-cart").click(function(){ $jQ('#floater').animate_from_to('.block-cart', { pixels_per_second: 200, initial_css: { background: url(http://www.google.co.uk/image.jpg) } }); $jQ(this).attr('id', ''); $jQ(this.parentNode.parentNode.parentNode.childNodes[1].childNodes[0]).attr('id', ''); }); }); I hope I have provided enough information for someone to assist me with this, but if i havent then please tell me and i will try and explain some more. Cheers, Chris I have a function which is currently called twice on the same page. Part of the function is to apply an onkeyup event to a created element. The problem is that when the function is called twice the first created element calls the onkeyup function of the second element! table_JD.length-1 = 0 for first element table_JD.length-1 = 1 for second element updateSearch_TC_JD(1) is somehow called from first element! Code: newSearchBox.onkeyup = function() {updateSearch_TC_JD(table_JD.length-1)} Thanks for any help you can provide! How do I store how many Windows my house has as a variable as this script I made isn't working. Quote: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <script type="text/javascript"> var test function show_prompt(a_bac) { prompt(a_bac) } function show_alert(a_baf) { alert(a_baf) } </script> <body> <!-- How do I store how many Windows my house has as a variable? --> <input type="button" value="click" onclick="var theanswer = prompt('How many windows does your house have?')" /> <input type="button" value="answer" onclick="alert(theanswer)" /> </body> </html> Is there any way of running a function where the name is stored as a string in a variable? I mean, the same way that PHP handles this is by appending "()" to the end of the variable. Hi, I know there are several ways to do this- but which way is best practice? I can access a variable from one function by making it a global variable, but I read that this isn't the most ideal way, and is a last resort. So for example if I have this: Code: function num1(){ var firstNum = 35; return firstNum; } function num2(){ var secNum = 52; return secNum; } function addNums(x,y){ var f = num1(x); var s = num2(y); var total = f + s; alert(total); } Then I call this function with a button. Now, I know this works, but it doesn't seem like a very good way to do what I'm after. Or is it? Any help/ tips would be great. edit: The idea is that the functions won't just return a single value and that's it. They will return a users choice in a given scenario, so they might return the user's age from the first function, then their location in the next etc etc, then I want to use this information in a separate function. Hi, I am having trouble passing the correct id to change the innerHTML. I have a jsp that display people and their address information. There could be several people in the list, so it is in a loop. That part all works good. There is a drop down list with countries in them. Based on the country they select, I want to change some of the text. Here is what I have: Code: <tr> <td class="datashaded" valign="top"><font size="2"><b>Country:</b></font></td> <td class="datashaded" valign="top"> <select tabindex="<%=countryTab%>" name="<%=country%>" size=1" onChange="changeText(this.form.<%=country%>, this.form.<%=addressLabel%>, this.form.<%=zipLabel%>);"> <% for (int i =0; i < countryList.size(); i++ ) { String countryOption = (String)countryList.get(i); String countryVal = bene.getAddress().getCountry(); String selected = ""; if ( countryOption.equalsIgnoreCase( countryVal ) ) selected = "selected"; %> <option value="<%=countryOption %>" <%=selected%> ><%=countryOption%></option> <% } %> </select> </td> </tr> <tr> <td class="datashaded"><div id="addr1"><font size=2><b id="<%=addressLabel%>">Address:</b></font></div></td> <td class="datashaded"> <input size=20 maxlength="50" tabindex="<%=add1Tab%>" name="<%=address1%>" value="<%=address1Value%>" </td> </tr> Everytime through the loop, addressLabel has an index added to it so it is unique - so I can refer to each person separately. Here is the js function: Code: function changeText(sel, txtField1, txtField2) { var selectedValue = sel[sel.selectedIndex].value; if ( selectedValue == "<%=IParticipantConstants.BENEFICIARY_COUNTRY %>") { document.getElementById(txtField1).innerHTML = 'Address:'; document.getElementById(txtField2).innerHTML = 'Zip:'; } else { document.getElementById(txtField1).innerHTML = 'Street or P.O. Box'; document.getElementById((txtField2).innerHTML = 'Postal Code:'; } } When I hardcoded the id= value, not matter which group I changed the country on, only the first one was changing, so I knew I needed unique ids for each group. There is more to the table, but this is the good part. When the onChange fires now, Nothing at all happens. Can anyone see the problem?? Thanks for looking! Hi 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 Hey All, I've been fighting this one for a few months now, and it is causing me to have to create multiple functions that basically do the same thing. I am using the three functions below to replace text between two div tags on a page, based on a link that is clicked: Code: <td><a href=\"javascript:void(0)\" onclick=\"htmlData('ajax/loginContent.php', 'view=1','data=2','displayField=txtResult')\">Active Jobs</a></td>\n"; Then further down the page: Code: <div id="txtResult">replace this content</div> For some reason, I CANNOT send the div id name as a js variable. When I do it errors out. BUT if I replace displayField in the js functions below with "txtResult" it works fine. I am fairly new to js, so it is definitely possible that I am doing something incorrectly. Anyone have any ideas for me? Code: function GetXmlHttpObject(handler) { var objXMLHttp=null if (window.XMLHttpRequest) { objXMLHttp=new XMLHttpRequest() } else if (window.ActiveXObject) { objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP") } return objXMLHttp } function stateChanged(displayField){ if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") { document.getElementById(displayField).innerHTML= xmlHttp.responseText; } else { //alert(xmlHttp.status); } } // Will populate data based on input function htmlData(url, qStr, qStr2,displayField){ if (url.length==0) { document.getElementById(displayField).innerHTML=""; return; } xmlHttp=GetXmlHttpObject() if (xmlHttp==null) { alert ("Browser does not support HTTP Request"); return; } url=url+"?"+qStr; if(qStr2) url=url+"&"+qStr2; url=url+"&sid="+Math.random(); xmlHttp.onreadystatechange=stateChanged(displayField); xmlHttp.open("GET",url,true) ; xmlHttp.send(null); } I am trying to figure out how to assign a value to a global variable within a function and can't seem to figure it out. Here's my thought, Code: <script type="text/javascript"> var global1=""; var global2=""; function assign(vari,strng){ vari = strng; } </script>... <input name="box1" onblur="assign('global1',this.value)"/> <input name="box2" onblur="assign('global2',this.value)"/> ... The purpose behind this is creating a form that will work with an existing database that would normally have a text area with lots of information. I am trying to turn it into a checklist that I can run from a mobile device. The global variables woudl be used to fill in a hidden text area that would then be passed on to the database upon submission. I am trying to keep the code as compact as possible. Any ideas? Hello I'm using simpleCart() javascript shopping machine for my page. The script accepts values in a specific syntax: Code: onclick="simpleCart.add('name=Some name','price=23.4','quantity=1');" But because the price of the product is not always the same but comes up after previously made calculations, i want to parse the values in simpleCart() through another function. I have made the following one which gets the price from a textbox (resultAlmires) of a form (Almires), then converts it to american format (. instead of ,) makes it have one decimal only and finally parse it to simpleCart() with the use of a variable. However it doesn't seem to work: Code: function addAlmiri() { var timi = document.Almires.resultAlmires.value; timi = timi.replace(/\,/,"."); timi = timi.toFixed(1); simpleCart.add( 'name = Some name' , 'price = timi' , 'quantity = 1' ); } Any help? 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, I have a DOM click event that creates a <span>. When the user clicks a button, it turns that <span> into a textarea that the user can type a new name in, press enter, and then the span contains the text the user input. Sort of like when you rename a file in Windows Explorer. Anyway, the code is something like this, and I'm wondering if I can use 'area_el' in this way... right now it's giving me the error that area_el is undefined, even though I define it in the function that contains the Event declaration. The first part is the Dom stuff to make it all work. It's not stuff I need to mess with, but I'm putting it here in case it's useful. Code: var Dom = { get: function(el) { if (typeof el === 'string') return document.getElementById(el); else return el; }, add: function(el, dest) { var el = this.get(el); var dest = this.get(dest); dest.appendChild(el); }, remove: function(el) { var el = this.get(el); if(el.parentNode != null) el.parentNode.removeChild(el); } }; var Event = { add: function() { if (window.addEventListener) { return function(el, type, fn) { Dom.get(el).addEventListener(type, fn, false); }; } else if (window.attachEvent) { return function(el, type, fn) { var f = function() { fn.call(Dom.get(el), window.event); }; Dom.get(el).attachEvent('on' + type, f); }; } }() }; The following code defines what happens when the user clicks submit to create a polygon. I also have some variables: Code: var created_area_array = Array(); var createdarea_index = 0; var number_of_areas_saved=0; var currently_renaming=false; Event.add(window, 'load', function() { Event.add('SubmitArea', 'click', function() { if(polyPoints.length>0) add_created_area(); }); }); Finally, where the issue is. I define area_el in the function below, and further down I want to pass it to a function within the "rename" click event, but I get an error that area_el is undefined. Code: function add_created_area() { number_of_areas_saved++; var area_el = document.createElement('span'); var area_el_remove = document.createElement('span'); var area_el_rename = document.createElement('span'); var new_entry = polyPoints; var new_entry_array_index = "Area" + (createdarea_index); var new_entry_array_name = "Area #" + (createdarea_index+1); area_el.innerHTML = '<span class=\"address-text\">' + new_entry_array_name + '</span><br>'; area_el_remove.innerHTML = "<a onMouseOver=\"rollover('address_remove')\" onMouseOut=\"rollout('address_remove')\" style='cursor:pointer;'>" + "<img src=\"images/tabs-icons/normal-address_remove.png\" name='address_remove' title='remove' alt='remove'></a> "; area_el_rename.innerHTML = "<a onMouseOver=\"rollover('area_rename')\" onMouseOut=\"rollout('area_rename')\" style='cursor:pointer;'>" + "<img src=\"images/tabs-icons/normal-area_rename.png\" name='area_rename' title='rename' alt='rename'></a> "; created_area_array[new_entry_array_index] = new_entry; createdarea_index++; Dom.add(area_el_remove, 'CreatedAreas'); Dom.add(area_el_rename, 'CreatedAreas'); Dom.add(area_el, 'CreatedAreas'); Event.add(area_el, 'click', function(e) { if(!currently_renaming) { polyPoints = []; var thePolyPoints = (created_area_array[new_entry_array_index]).toString(); alert(thePolyPoints); //formatting created_area_array[new_entry_array_index] to store as polygon points in the polyPoints array thePolyPoints = thePolyPoints.replace(/[\[\]{}]/g, ""); thePolyPoints = thePolyPoints.replace(/Location/g, ""); //adding the co-ordinates to the polyPoints array thePolyPoints = thePolyPoints.split(","); for(var ctr=0; ctr+1<thePolyPoints.length; ctr+=2) { var location1 = new Microsoft.Maps.Location(thePolyPoints[ctr],thePolyPoints[ctr+1]); polyPoints.push(location1); } var out=""; for(var i=0; i<polyPoints.length; i++) { out += polyPoints[i] + " "; } alert(out); //creating the polygon and searching... if(create_area==true) { drawPolygon(); polygonSearch(); } else if(create_area==false) { document.getElementById('createarea').innerHTML = "<a id='createarea'><span class='create_area' style='color:blue'><strong>Create Area</strong></span></a>"; document.getElementById("mapDiv").oncontextmenu = function(){return false} MouseUpHandlerId = Microsoft.Maps.Events.addHandler(map, "mouseup",MouseUpHandler); MouseDownHandlerId = Microsoft.Maps.Events.addHandler(map, "mousedown",MouseDownHandler); MouseMoveHandlerId = Microsoft.Maps.Events.addHandler(map, "mousemove",MouseMoveHandler); MouseOverHandlerId = Microsoft.Maps.Events.addHandler(map, "mouseover",MouseOverHandler); drawPolygon(); polygonSearch(); create_area=true; } } }); Event.add(area_el_remove, 'click', function(e) { Dom.remove(this); Dom.remove(area_el_rename); Dom.remove(area_el); if(number_of_areas_saved>1) number_of_areas_saved--; }); Event.add(area_el_rename, 'click', function(e) { if(!currently_renaming) { area_el.innerHTML = '<textarea name=\"renaming_area\" id=\"renaming_area\" style=\"width:200px;height:10px;background-color:#DCDCDC; resize:none;font-size:8px;\" onKeyPress=\"return enter_rename(area_el, event)\" maxlength=\"30\"></textarea><br>'; currently_renaming=true; } }); Event.add("createdarea_clear", 'click', function(e) { Dom.remove(area_el_remove); Dom.remove(area_el_rename); Dom.remove(area_el); created_area_array = []; number_of_areas_saved=0; createdarea_index=0; }); } The enter_rename(area_el, event) function that isn't passing in my variable. Code: function enter_rename(area_el, event) { var keyPressed = (event.which) ? event.which : event.keyCode; var current_str = document.getElementById("renaming_area").value; if(keyPressed == 13) { if(current_str.length>0) { if(allSpaces(current_str)==true) { alert("Please enter a meaningful area name."); return false; } else { area_el.innerHTML = '<span class=\"address-text\">' + current_str + '</span><br>'; currently_renaming=false; return true; } } else return false; } else return true; } Making area_el global does not clear the span elements when I click my "createdarea_clear" button, however when it's local, the function works as expected. I am trying to create a page that uses javascript to call data from an xml file to present a large quantity of information through an for loop. I have gotten the id of the element to work appropriately, but using the funtion defines it as the last cycled variable definition. Is there a way to pass the value of the variable to the function definition, ie.. onclick="function(var)", so that it stays that value when the loop cycles back through? Code: <script type="text/javascript"> xmlhttp.open("GET","companyInfo.xml",false); xmlhttp.send(); var xmlDoc=xmlhttp.responseXML; var x=xmlDoc.getElementsByTagName("entry"); var idVar; for (var i=0;i<x.length;i++) { idVar=x[i].getElementsByTagName("id")[0].childNodes[0].nodeValue; document.write("<button class='headerBar' onclick='showInfo(idVar)'><strong>"); document.write(x[i].getElementsByTagName("heading")[0].childNodes[0].nodeValue); document.write("<strong></button>"); document.write("<span id='x' onclick='hideInfo(this.id)' style='display:inline;'>"); document.getElementById("x").id=idVar; document.write(x[i].getElementsByTagName("page1")[0].childNodes[0].nodeValue); document.write("</span>"); } </script> Thanks in advance to anyone that can help with this. 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! Is it possible to make a variable available to other functions outside a function So to make it global from within a function without using a callback Code: function() { var something = 'hello'; } function(something) { document.write(something); } something like that possible?? I know I have a thread about the sorting function I'm about to post, but this problem doesn't deal with the sorting itself, but rather the fact that a variable is not passing. The code below is the relevant part to an autosuggest feature. The variable that isn't being passed is "firstValidIndex". It is being set appropriately, but when it is used in "sortArray()", its value is 0. Code: // here we must check to see if where the string matched was at the beginning of a string inside this.aNames // firstValidIndex is the first index where the char is at the beginning of a string var firstValidIndex; loop1: for(var j in firstIndices) { loop2: for(var k in allOccurrences) { if(allOccurrences[k] == firstIndices[j]) { firstValidIndex = firstIndices[j]; aList.push(this.aNames[i]); ctr++; break loop1; break loop2; } } } function sortArray(a,b) { var lca = a.toLowerCase(); var lcb = b.toLowerCase(); var lco = str.toLowerCase(); var diff = lca.indexOf(lco,firstValidIndex) - lcb.indexOf(lco,firstValidIndex); // some debugging code here alert("Comparing "+lca+" with "+ lcb+"\nDiff:"+diff+"\nFirst Valid Index: "+firstValidIndex); if ( diff < 0 ) return -1; if ( diff > 0 ) return 1; return 0; } aList.sort(sortArray); |