JavaScriptSource

Search 5,000+ Free JavaScript Snippets

Home / Generators / Array Creator 3

Array Creator 3

Array Creator 3

General

Coding large arrays can be a bit of a repetitive chore. This script will create a generator that will help speed up the process. Easy to use and implement!

Notes

  • Created by: Mr. J
  • Web Site: http://www.huntingground.net/
  • When using the numerical value option enter the array length and an index value.
  • A number is then appended to the index value starting at 000.
  • A second value can also be added after the number by entering in the second textbox, if this is not required leave the box blank.
  • If the numerical value option is not used each individual array index value is typed in the text field, you can then either click the “Manual Enter” button or press the “Return” key to confirm your index value.

Source Code

Paste this source code into the designated areas.

External file

Paste this code into an external JavaScript file named: arrayCreator.js

/* This script and many more are available free online at
The JavaScript Source!! http://javascriptsource.com
Created by: Mr. J | http://www.huntingground.net/ */

function init(){
  array_name=document.f1.t1.value //name of array
  val2=document.f1.t3a.value
  ext=document.f1.t4.value
  for(r=0;r<document.f1.r1.length check="" which="" r1="" radio="" is="" selected="selected" if="" option="document.f1.r1[r].value" value="" document.getelementbyid="" new="" array="" opening="" type="" else=""></document.f1.r1.length>” // opening array type 2 & 3
  }

  if(document.f1.r2[0].checked==true){ // if indexed values
    make_array1()
  }

  if(document.f1.r2[1].checked==true){ // if non index values
    make_array2()
  }
}

function make_array1(){
  array_length=document.f1.t2.value-1 // length of array
  index_values=document.f1.t3.value // index value

  if(array_length==””||array_length==0){ // make sure a viable number is used
    document.getElementById(“display”).innerHTML=”Please Enter a Number”
    document.f1.b2.disabled=true
    return
  } else {
    if(!ns){document.f1.cpy.disabled=false}
  }

  for(num=0;num<array_length j="num" if="">9&&num0){
      i=num+val2+ext}
      else{i=num+val2}

  if(option==0){ // insert inner indexes for type 1
    document.getElementById(“display”).innerHTML+=”””+index_values+i+””, ”
  } else {
    if(option==1){ // insert inner indexes for type 2
      document.getElementById(“display”).innerHTML+=array_name+”[“+j+”]=”
      document.getElementById(“display”).innerHTML+=”””+index_values+i+””<br />”
    } else { // insert inner indexes for type 3
      document.getElementById(“display”).innerHTML+=array_name+”[“+array_name+”.length]=””+index_values+i+””<br />”
    }
  }
}

if(num9&&num100){num=num}

if(document.f1.t4.value.length>0){
  i= num+val2+ext}
  else{i=num+val2}

  if(option==0){ // insert last indexes for type 1
    document.getElementById(“display”).innerHTML+=”””+index_values+i+””)”
  } else {
    if(option==1){ // insert last indexes for type 2
      document.getElementById(“display”).innerHTML+=array_name+”[“+(j+1)+”]=”
      document.getElementById(“display”).innerHTML+=”””+index_values+i+””<br />”
    } else { // insert last indexes for type 3
      document.getElementById(“display”).innerHTML+=array_name+”[“+array_name+”.length]=””+index_values+i+””<br />”
    }
  }
}

index_value=new Array()
count= 0
last=0

function make_array2(){
  if(!ns){document.f1.cpy.disabled=false}
  for(r=0;r<document.f1.r1.length check="" which="" r1="" radio="" is="" selected="selected" if="" chkrad="r" prevent="" additional="" index="" when="" only="" changing="" array="" style="" count--="">0){
    index_value[count]=document.f1.t3.value+ext}
  else {
    index_value[count]=document.f1.t3.value
  }

  for(i=0;i<count if="" document.getelementbyid="" else=""></count>”
      } else {
        document.getElementById(“display”).innerHTML+=array_name+”[“+i+”]=””+index_value[i]+””<br />”
      }
    }
  }

  if(option==0){
    document.getElementById(“display”).innerHTML+=”””+index_value[i]+””)”
  } else {
    if(option==2){
      document.getElementById(“display”).innerHTML+=array_name+”[“+array_name+”.length]=””+index_value[i]+””<br />”
    } else {
      document.getElementById(“display”).innerHTML+=array_name+”[“+i+”]=””+index_value[i]+””<br />”
    }
  }
  count++
  document.f1.t3.select()
  last=chkrad
}

function oreset(){
  count=0
  document.f1.t3.value=””
  document.getElementById(“display”).innerHTML=””
  document.f1.t3.select()
}

function chk(){
  if(document.f1.r2[0].checked==true){
    document.f1.t2.disabled=false
    document.getElementById(“sp”).disabled=false
    document.f1.t2.style.backgroundColor=”#FFFFFF”
    document.f1.b1.disabled=false
    document.f1.b2.disabled=true
    document.f1.b3.disabled=true
    document.f1.t3a.disabled=false
    document.f1.t3a.style.backgroundColor=”#FFFFFF”
  } else {
    document.f1.t2.disabled=true
    document.getElementById(“sp”).disabled=true
    document.f1.t2.style.backgroundColor=”#c0c0c0″
    document.f1.b1.disabled=true
    document.f1.b2.disabled=false
    document.f1.b3.disabled=false
    document.f1.t3.select()
    document.f1.t3a.disabled=true
    document.f1.t3a.style.backgroundColor=”#c0c0c0″
  }
}

function Copy(id){
  if(ns){
    alert(“Sorry, Netscape does not recongise this function”)
    document.f1.cpy.disabled=true
    return
  }
  copyit=id
  textRange = document.body.createTextRange();
  textRange.moveToElementText(copyit);
  textRange.execCommand(“Copy”);
  alert(“Copying Complete.nnPlease Paste into your SCRIPT”)
}

ns=document.getElementById&&!document.all

function getKey(e) {
  pressed_key=(!ns)?event.keyCode:e.which
  if( pressed_key==13){
    init()
  }
}
document.onkeypress = getKey;

</document.f1.r1.length></array_length>

CSS

Paste this code into your external CSS file or in the <style> section within the HEAD section of your HTML document.

#display {
  position: relative;
  left: 10px;
  width: 450px;
  border: 1px solid black;
  padding: 10px;
}

Head

Paste this code into the HEAD section of your HTML document.

<script type=”text/javascript” src=”arrayCreator.js”></script>

Body

Paste this code into the BODY section of your HTML document.

<form name="f1" id="f1">

<table border="0"><tr><td>Array Name:</td>
    <td colspan="6">
      <input type="text" name="t1" value="myArray" /></td>
  </tr><tr><td>
      <span id="sp">Indexed Array Length:</span>
    </td>
    <td colspan="6">
      <input type="text" name="t2" value="5" size="3" maxlength="3" /></td>
  </tr><tr><td>Index Value:</td>
    <td colspan="6">
      <input type="text" name="t3" value="image" size="10" /><input type="text" name="t3a" value="_tn" size="10" /> Ext
      <input type="text" name="t4" value=".jpg" size="4" maxlength="4" /></td>
  </tr><tr><td>Index Style:</td>
    <td align="right">1
      <input type="radio" name="r1" value="0" checked="checked" onclick="init()" /></td>
    <td> </td>
    <td align="right">2
      <input type="radio" name="r1" value="1" onclick="init()" /></td>
    <td> </td>
    <td align="right">3
      <input type="radio" name="r1" value="2" onclick="init()" /></td>
    <td width="80"> </td>
  </tr><tr><td>Add Numerical Values:</td>
    <td align="right">Yes
      <input type="radio" name="r2" value="0" checked="checked" onclick="chk()" /></td>
    <td align="center"> </td>
    <td align="right">No
      <input type="radio" name="r2" value="1" onclick="chk()" /></td>
    <td> </td>
    <td colspan="2"> </td>
  </tr><tr align="center"><td>
      <input type="button" name="b1" value="Numerical Enter" onclick="init()" /></td>
    <td colspan="6">
      <input type="button" name="cpy" value="Copy Array" onclick="Copy(display)" disabled="disabled" /><input type="button" name="b2" value="Manual Enter" onclick="init()" disabled="disabled" /><input type="button" name="b3" value="Restart" onclick="oreset()" disabled="disabled" /></td>
  </tr></table></form>

<div id="display"></div>

Related Snippets: