Possible to sort and omit duplicates in a list using javascript

L

Laphan

Hi All

I need to provide a function on my site whereby a user can enter a number of
ip addresses (one per line) so that I can submit this en masse to string
holding space in my db.

My problem is that I want to keep this list sorted as they enter the ip
addresses and I want to check for duplicates so that they don't enter the
same ip addresses twice.

I was going to do this as a simple form submit and add each entry as a
database row so that I could ORDER BY to get the sort and check for
duplicates on the submit, but this client/server submit really slows the
whole process. It would be great if I could order by and duplicate check on
the client side so that once done all I'm doing is one client/server 'post'
to the db.

Is this feasible?

Thanks
 
A

Anthony Jones

Laphan said:
Hi All

I need to provide a function on my site whereby a user can enter a number of
ip addresses (one per line) so that I can submit this en masse to string
holding space in my db.

My problem is that I want to keep this list sorted as they enter the ip
addresses and I want to check for duplicates so that they don't enter the
same ip addresses twice.

I was going to do this as a simple form submit and add each entry as a
database row so that I could ORDER BY to get the sort and check for
duplicates on the submit, but this client/server submit really slows the
whole process. It would be great if I could order by and duplicate check on
the client side so that once done all I'm doing is one client/server 'post'
to the db.


Take a gander at this:-

<html>
<head>
<title>Enter IPs</title>
<script type="text/javascript">

var masIPs = {}

function cmdAdd_onclick()
{
var rgxIP =
/^(((\d{1,2})|(1\d{2})|(2[0-4]\d)|(25[0-5]))\.){3}((\d{1,2})|(1\d{2})|(2[0-4
]\d)|(25[0-5]))$/
var sIP = document.getElementById("txtIP").value
if (rgxIP.test(sIP))
{

masIPs[sIP] = true

var arr = []
for (var sIP in masIPs) arr.push(sIP)
arr.sort()
document.getElementById("txtIPs").value = arr.join("\r\n")
document.getElementById("txtIP").value = ""
}
}
</script>
</head>
<body>
<form action="test.asp" method="post">
<label>IP Address: </label>
<input id="txtIP" type="text" value="" />
<input type="button" value="Add" onclick="cmdAdd_onclick.call(this)"
/><br />
<textarea id="txtIPs" name="txtIPs">
</textarea><br />
<input type="submit" value="Submit" />
</form>
</body>
</html>

It uses a Javascript object as an associative array which ensures that the
IPs are unique.

However you might need to consider the sorting. Is alphanumeric sorting of
IP addresses expected. e.g would you expect 20.67.39.4 to appear in the
list after 192.168.34.2 ?

If not then you need to enhance the sorting. Add this function to the
Javascript:-

function compareIPs(vsIP1, vsIP2)
{
var asIP1 = vsIP1.split(".")
var asIP2 = vsIP2.split(".")

var i = 0
var retVal = 0
while (!retVal && i<4)
retVal = fnCompareOctet(asIP1, asIP2[i++])

return retVal

function fnCompareOctet(vs1, vs2)
{
var l1 = parseInt(vs1)
var l2 = parseInt(vs2)
return l1 < l2 ? -1 : l1 > l2 ? 1 : 0
}

}

now change the array sort line to:-

arr.sort(compareIPs)

This makes use of javascript arrays sort method accepting a comparator
function.

How about being able to delete an IP address from the list and should the
textarea be editable? I'll leave that as an exercise ;)
 
L

Laphan

Hi Guys

Can't thank you enough for this.

It is very much appreciated.

Rgds


Laphan said:
Hi All

I need to provide a function on my site whereby a user can enter a number of
ip addresses (one per line) so that I can submit this en masse to string
holding space in my db.

My problem is that I want to keep this list sorted as they enter the ip
addresses and I want to check for duplicates so that they don't enter the
same ip addresses twice.

I was going to do this as a simple form submit and add each entry as a
database row so that I could ORDER BY to get the sort and check for
duplicates on the submit, but this client/server submit really slows the
whole process. It would be great if I could order by and duplicate check on
the client side so that once done all I'm doing is one client/server 'post'
to the db.


Take a gander at this:-

<html>
<head>
<title>Enter IPs</title>
<script type="text/javascript">

var masIPs = {}

function cmdAdd_onclick()
{
var rgxIP =
/^(((\d{1,2})|(1\d{2})|(2[0-4]\d)|(25[0-5]))\.){3}((\d{1,2})|(1\d{2})|(2[0-4
]\d)|(25[0-5]))$/
var sIP = document.getElementById("txtIP").value
if (rgxIP.test(sIP))
{

masIPs[sIP] = true

var arr = []
for (var sIP in masIPs) arr.push(sIP)
arr.sort()
document.getElementById("txtIPs").value = arr.join("\r\n")
document.getElementById("txtIP").value = ""
}
}
</script>
</head>
<body>
<form action="test.asp" method="post">
<label>IP Address: </label>
<input id="txtIP" type="text" value="" />
<input type="button" value="Add" onclick="cmdAdd_onclick.call(this)"
/><br />
<textarea id="txtIPs" name="txtIPs">
</textarea><br />
<input type="submit" value="Submit" />
</form>
</body>
</html>

It uses a Javascript object as an associative array which ensures that the
IPs are unique.

However you might need to consider the sorting. Is alphanumeric sorting of
IP addresses expected. e.g would you expect 20.67.39.4 to appear in the
list after 192.168.34.2 ?

If not then you need to enhance the sorting. Add this function to the
Javascript:-

function compareIPs(vsIP1, vsIP2)
{
var asIP1 = vsIP1.split(".")
var asIP2 = vsIP2.split(".")

var i = 0
var retVal = 0
while (!retVal && i<4)
retVal = fnCompareOctet(asIP1, asIP2[i++])

return retVal

function fnCompareOctet(vs1, vs2)
{
var l1 = parseInt(vs1)
var l2 = parseInt(vs2)
return l1 < l2 ? -1 : l1 > l2 ? 1 : 0
}

}

now change the array sort line to:-

arr.sort(compareIPs)

This makes use of javascript arrays sort method accepting a comparator
function.

How about being able to delete an IP address from the list and should the
textarea be editable? I'll leave that as an exercise ;)
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,755
Messages
2,569,536
Members
45,009
Latest member
GidgetGamb

Latest Threads

Top