function OnImageClick(CtrlID, DeviceID)
{
    //alert(CtrlID + ' - ' + DeviceID);
//    var ctrl = document.getElementById(CtrlID);
//    if (ctrl.style.border.length > 0)
//    {
//        ctrl.style.border = "";
//    }
//    else
//    {
//        ctrl.style.border = "3px solid red";
//    }
    
    //get selection
    var selection = document.getElementById(txtSelection_ID).value;
    //alert(selection);
    if (selection == '')
    {
        //the selection is blank, it is first click
        var ctrl = document.getElementById(CtrlID);
        ctrl.style.border = "3px solid red";
        selection = DeviceID;
        document.getElementById(txtSelection_ID).value = selection;
    }
    else
    {
        //the selection is not blank, it is not first click
        var selections = selection.split(",");
        var newselection = '';
        var secondclick = false;
        var i;
        for (i = 0; i < selections.length; i++)
        {
            if (selections[i] == DeviceID)
            {
                //the device is second click
                secondclick = true;
                break;
            }
        }
        
        if (secondclick)
        {
            //it is second click, remove the border
            var ctrl = document.getElementById(CtrlID);
            ctrl.style.border = "";
            for (i = 0; i < selections.length; i++)
            {
                if (selections[i] != DeviceID)
                {
                    if (newselection != '')
                        newselection += ",";
                    newselection += selections[i];
                }
            }
            document.getElementById(txtSelection_ID).value = newselection;
        }
        else
        {
            var ctrl = document.getElementById(CtrlID);
            ctrl.style.border = "3px solid red";
            newselection += selection + "," + DeviceID;
            document.getElementById(txtSelection_ID).value = newselection;
        }
    }
}

function ClearSelection()
{
    var selection = document.getElementById(txtSelection_ID).value;
    if (selection == '')
        return;
    var selections = selection.split(",");
    for (i = 0; i < selections.length; i++)
    {
        var ctrl = document.getElementById("Device" + selections[i]);
        ctrl.style.border = "";
    }
    document.getElementById(txtSelection_ID).value = '';
}


function CheckSelection()
{
    var selection = document.getElementById(txtSelection_ID).value;
    if (selection == '')
    {
        alert('Please select device!');
        return;
    }
    
    document.getElementById(btnSubmit_ID).click();
}