Is it possible to position ValidatorCalloutExtender dynamically?

Question

I have two ajax validator callout extenders that are programmed via VB.net.I am validating one textbox but I want the popup to appear next to a different textbox. How can I tell the ajax popup where to appear?

    Dim custval As New CustomValidator
    custval.ID = "ValidPage"
    custval.ErrorMessage = "<font color=red>Please Enter a 'To' Date"
    custval.SetFocusOnError = True
    custval.ForeColor = Drawing.Color.Red
    custval.EnableClientScript = True
    custval.ControlToValidate = cell.Controls(18).ID
    custval.ClientValidationFunction = "ClientValidate"
    custval.Display = ValidatorDisplay.None
    Dim custvalex As New AjaxControlToolkit.ValidatorCalloutExtender
    custvalex.ID = "VCEcustval"
    custvalex.TargetControlID = "ValidPage"
    custvalex.HighlightCssClass = "validatorCalloutHighlight"
    '---------------------------------------------------------------
    Dim custval2 As New CustomValidator
    custval2.ID = "ValidPage2"
    custval2.ErrorMessage = "<font color=red>Please Enter a 'From' Date"
    custval2.SetFocusOnError = True
    custval2.ForeColor = Drawing.Color.Red
    custval2.EnableClientScript = True
    custval2.ControlToValidate = cell.Controls(23).ID
    custval2.ClientValidationFunction = "ClientValidate2"
    custval2.Display = ValidatorDisplay.None

    Dim custvalex2 As New AjaxControlToolkit.ValidatorCalloutExtender
    custvalex2.ID = "VCEcustval2"
    custvalex2.TargetControlID = "ValidPage2"
    custvalex2.HighlightCssClass = "validatorCalloutHighlight"
    cell.Controls.Add(custval) '27
    cell.Controls.Add(custvalex2) '28
    cell.Controls.Add(custval2) '29
    cell.Controls.Add(custvalex) '30


function ClientValidate(sender, args) {
    // Get Both form fields
    var hid = $get('<%=HiddenField1.ClientID%>');
    var hid2 = $get('<%=HiddenField2.ClientID %>');
    var hidval = hid.value;
    var hid2val = hid2.value;
    var txtdate1 = $get(hidval);
    var txtdate2 = $get(hid2val);
    // do you client side check to make sure they have something
    if (txtdate1.value != '' && txtdate2.value == '') {
        args.IsValid = false;
    }
    else {
        args.IsValid = true;
    }
}
function ClientValidate2(sender, args) {
    // Get Both form fields
    var hid = $get('<%=HiddenField1.ClientID%>');
    var hid2 = $get('<%=HiddenField2.ClientID %>');
    var hidval = hid.value;
    var hid2val = hid2.value;
    var txtdate1 = $get(hidval);
    var txtdate2 = $get(hid2val);
    // do you client side check to make sure they have something
    if (txtdate2.value != '' && txtdate1.value == '') {
        args.IsValid = false;
    }
    else {
        args.IsValid = true;
    }
}

I know that those two javascript functions can be separated. But how can I move the popup around?

Answer 1

You'll probably have to control the positioning of it via CSS or javascript. I don't know of a way to do it through the properties of the server control.

Here is a forum thread showing how to reposition the validator popup using the set_x and set_y javascript methods of the callout.