<form class="astrolabe addNodeDialog form-horizontal confirm-before-leave">

    <div class="control-group">
       <label for="astrolabe-add-node-label" class="control-label">Label</label>
        <div class="controls">
            <input name="nodeLabel" type="text" id="astrolabe-add-node-label" class="required" minlength="1" value="<?= htmlspecialchars($label) ?>"/>
            <p id="astrolabe-add-node-label-error" class="astrolabeAddNodeDialogError"></p>
        </div>
    </div>

    <div class="control-group">
            <label for="astrolabe-add-node-class"  class="control-label">CFEngine class expression (.*+[])</label>

        <div class="controls">

            <input name="nodeClass" type="text" id="astrolabe-add-node-class" class="required" minlength="1" value="<?= htmlspecialchars($class) ?>"/>
            <div class="input-append white-bg item overlap-left"><i class="add-on icon-eye-open"></i></div>
            <p id="astrolabe-add-node-class-error" class="astrolabeAddNodeDialogError"></p>

        </div>
    </div>
</form>

<script type="text/javascript">

    $('.astrolabe.addNodeDialog .icon-eye-open').classfinder({
        defaultbehaviour: false,
        baseUrl: '<?php echo site_url() ?>',

        complete: function(event,data)
        {
            var $classInput = $('#astrolabe-add-node-class');
            var value = $.trim($classInput.val());
            if (value) {
                value = value + '|';
            }
            $classInput.val(value + data.selectedclass);
        }
    });

</script>