Filling a drop down with distinct values from a SharePoint 2010 list

In the code below, I'm first filling the select box with distinct items (Contract Numbers) from the title field. Once one is selected, I use that field to query and display data.

First, I call the function getContracts(); which executes this CAMLQuery
<Query> \
<OrderBy> \
<FieldRef Name=\'ContractNum\'/> \
</OrderBy> \
</Query>';

This selects everything with an order by which puts lists all the duplicates sequentially. Then as you loop through each item if it doesn't match the previous one
contractnum = $(this).attr("ows_Title");
if(contractnum != prevcontract)
{
$("#outputdrop").append("<option value='" + contractnum + "'>" + contractnum + "</option>");
prevcontract = contractnum;
}

you add it to the drop down and set the value of the prevcontract equal to the current one so that the IF condition will fail if the next one matches.

When an item is selected and you hit the submit button it calls  onclick="getPrime(document.getElementById('outputdrop').value); which takes the selected item and passes it into the next CAML Query to generate the page output report.



----- Code below ------
<script type="text/javascript" src="/Style Library/js/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="/Style Library/js/jquery.SPServices.min.js"></script>
<select id="outputdrop"></select><input type="button" value="Submit" onclick="getPrime(document.getElementById('outputdrop').value);">
<h3><p id="outputreport" >Primary Contract with Associated Contracts and Subs.  Select a Contract Number:</p></h3>
<h3><p id="prime" ></p></h3>
<h3><p id="sub" ></p></h3>
<script type="text/javascript">
var site;
var context;
var website;
var sStyles = new Array();
$(document).ready
(
function()
{
var inDesignMode = document.forms[MSOWebPartPageFormName].MSOLayout_InDesignMode.value; 
if (inDesignMode == "1") 
{
//alert("Edit mode!!!");
}
else
{
//   getInfo();
}

}
);
getContracts();
function getPrime(contractnum)
{
var method = "GetListItems";
var listName = "Contract";
var prime = "";
var pMessage = "";
var sMessage = "";
var itemLink = "/sites/Advisors/Lists/Contract/Item/displayifs.aspx?List=0be6016b5&ID=";
var camlQuery =' <Query> \
<OrderBy> \
<FieldRef Name=\'Prime\'/> \
</OrderBy> \
<Where> \
<Eq> \
<FieldRef Name=\'Title\'/> \
<Value Type=\'Text\'>'+contractnum+'</Value> \
</Eq> \
    </Where> \
    </Query>';

$().SPServices
(
{

operation: method,
//webURL: rootSite,
async: false,
listName: listName,
CAMLQuery: camlQuery,

//All the above will define what we want SPServices to do for us. This next line will execute
//our results, which is returned as XML in xData.responseXML
completefunc: function (xData, Status)
{
// alert(xData.responseText);
//Get your XML parsing on!!!
//This next line will iterate through each row in our XML and execute a function
$(xData.responseXML).find("z\\:row").each
(
function() 
{
prime = $(this).attr("ows_Prime");
name = $(this).attr("ows_Contractor");
name2 = name.split("#");
name = name2[1];
pid = $(this).attr("ows_ID")
license = $(this).attr("ows_License")
if(prime == true)
{
if(license == true)
{
pMessage = pMessage + name + ". <br/>The business license is available <a href='"+itemLink+pid+"'>here</a>.<br/>";
}
else
{
pMessage = pMessage +  name + ". <br/>The business license is not available.<br/>";

}

}
else
{
sMessage = sMessage + name  + " <br/>" ;
}


}
);
document.getElementById("prime").innerHTML = "The primary contractor for " +contractnum+ " is " + pMessage;
document.getElementById("sub").innerHTML = "Subcontractor(s) are: <br/>" +sMessage ;

}
}
);

}

function getContracts()
{
var method = "GetListItems";
var listName = "Contract";
var prime = "";
var countC = 0;
var countNC = 0;
var dropoptions = "";
var prevcontract = "";

var camlQuery =' <Query> \
<OrderBy> \
<FieldRef Name=\'ContractNum\'/> \
</OrderBy> \
</Query>';


$().SPServices
(
{

operation: method,
async: false,
listName: listName,
CAMLQuery: camlQuery,

//All the above will define what we want SPServices to do for us. This next line will execute
//our results, which is returned as XML in xData.responseXML
completefunc: function (xData, Status)
{
// alert(xData.responseText);
function
$(xData.responseXML).find("z\\:row").each
(
function() 
{
contractnum = $(this).attr("ows_Title");
if(contractnum != prevcontract)
{

$("#outputdrop").append("<option value='" + contractnum + "'>" + contractnum + "</option>");
prevcontract = contractnum;
}


}
);

}
}
);

}

</script>