ASP.NET referencing a javascript function

Question

I have an ASP.NET page, written in VB.NET, that I'm trying to use javascript on. The script takes the value from one listbox and inserts it into another list box. I'm using a master page, which I'm pretty sure is the issue.

Here's the javascript:

    function OT_transferLeft() { moveSelectedOptions(this.right, this.left, this.autoSort, this.staticOptionRegex); this.update(); }
function OT_transferRight() { moveSelectedOptions(this.left, this.right, this.autoSort, this.staticOptionRegex); this.update(); }
function OT_transferAllLeft() { moveAllOptions(this.right, this.left, this.autoSort, this.staticOptionRegex); this.update(); }
function OT_transferAllRight() { moveAllOptions(this.left, this.right, this.autoSort, this.staticOptionRegex); this.update(); }
function OT_saveRemovedLeftOptions(f) { this.removedLeftField = f; }
function OT_saveRemovedRightOptions(f) { this.removedRightField = f; }
function OT_saveAddedLeftOptions(f) { this.addedLeftField = f; }
function OT_saveAddedRightOptions(f) { this.addedRightField = f; }
function OT_saveNewLeftOptions(f) { this.newLeftField = f; }
function OT_saveNewRightOptions(f) { this.newRightField = f; }
function OT_update() {
    var removedLeft = new Object();
    var removedRight = new Object();
    var addedLeft = new Object();
    var addedRight = new Object();
    var newLeft = new Object();
    var newRight = new Object();
    for (var i = 0; i < this.left.options.length; i++) {
        var o = this.left.options[i];
        newLeft[o.value] = 1;
        if (typeof (this.originalLeftValues[o.value]) == "undefined") {
            addedLeft[o.value] = 1;
            removedRight[o.value] = 1;
        }
    }
    for (var i = 0; i < this.right.options.length; i++) {
        var o = this.right.options[i];
        newRight[o.value] = 1;
        if (typeof (this.originalRightValues[o.value]) == "undefined") {
            addedRight[o.value] = 1;
            removedLeft[o.value] = 1;
        }
    }
    if (this.removedLeftField != null) { this.removedLeftField.value = OT_join(removedLeft, this.delimiter); }
    if (this.removedRightField != null) { this.removedRightField.value = OT_join(removedRight, this.delimiter); }
    if (this.addedLeftField != null) { this.addedLeftField.value = OT_join(addedLeft, this.delimiter); }
    if (this.addedRightField != null) { this.addedRightField.value = OT_join(addedRight, this.delimiter); }
    if (this.newLeftField != null) { this.newLeftField.value = OT_join(newLeft, this.delimiter); }
    if (this.newRightField != null) { this.newRightField.value = OT_join(newRight, this.delimiter); }
}
function OT_join(o, delimiter) {
    var val; var str = "";
    for (val in o) {
        if (str.length > 0) { str = str + delimiter; }
        str = str + val;
    }
    return str;
}
function OT_setDelimiter(val) { this.delimiter = val; }
function OT_setAutoSort(val) { this.autoSort = val; }
function OT_setStaticOptionRegex(val) { this.staticOptionRegex = val; }
function OT_init(theform) {
    this.form = theform;
    if (!theform[this.left]) { alert("OptionTransfer init(): Left select list does not exist in form!"); return false; }
    if (!theform[this.right]) { alert("OptionTransfer init(): Right select list does not exist in form!"); return false; }
    this.left = theform[this.left];
    this.right = theform[this.right];
    for (var i = 0; i < this.left.options.length; i++) {
        this.originalLeftValues[this.left.options[i].value] = 1;
    }
    for (var i = 0; i < this.right.options.length; i++) {
        this.originalRightValues[this.right.options[i].value] = 1;
    }
    if (this.removedLeftField != null) { this.removedLeftField = theform[this.removedLeftField]; }
    if (this.removedRightField != null) { this.removedRightField = theform[this.removedRightField]; }
    if (this.addedLeftField != null) { this.addedLeftField = theform[this.addedLeftField]; }
    if (this.addedRightField != null) { this.addedRightField = theform[this.addedRightField]; }
    if (this.newLeftField != null) { this.newLeftField = theform[this.newLeftField]; }
    if (this.newRightField != null) { this.newRightField = theform[this.newRightField]; }
    this.update();
}
// -------------------------------------------------------------------
// OptionTransfer()
//  This is the object interface.
// -------------------------------------------------------------------
function OptionTransfer(l, r) {
    this.form = null;
    this.left = l;
    this.right = r;
    this.autoSort = true;
    this.delimiter = ",";
    this.staticOptionRegex = "";
    this.originalLeftValues = new Object();
    this.originalRightValues = new Object();
    this.removedLeftField = null;
    this.removedRightField = null;
    this.addedLeftField = null;
    this.addedRightField = null;
    this.newLeftField = null;
    this.newRightField = null;
    this.transferLeft = OT_transferLeft;
    this.transferRight = OT_transferRight;
    this.transferAllLeft = OT_transferAllLeft;
    this.transferAllRight = OT_transferAllRight;
    this.saveRemovedLeftOptions = OT_saveRemovedLeftOptions;
    this.saveRemovedRightOptions = OT_saveRemovedRightOptions;
    this.saveAddedLeftOptions = OT_saveAddedLeftOptions;
    this.saveAddedRightOptions = OT_saveAddedRightOptions;
    this.saveNewLeftOptions = OT_saveNewLeftOptions;
    this.saveNewRightOptions = OT_saveNewRightOptions;
    this.setDelimiter = OT_setDelimiter;
    this.setAutoSort = OT_setAutoSort;
    this.setStaticOptionRegex = OT_setStaticOptionRegex;
    this.init = OT_init;
    this.update = OT_update;
}

var lb1 = document.getElementById("<%=lbSiteType.ClientID%>");
var lb2 = document.getElementById("<%=lbSelectedSiteType.ClientID%>");

var opt = new OptionTransfer(lb1, lb2);

alert(opt);
opt.setAutoSort(true);
opt.setDelimiter(",");
opt.setStaticOptionRegex("^(Bill|Bob|Matt)$");
opt.saveRemovedLeftOptions("removedLeft");
opt.saveRemovedRightOptions("removedRight");
opt.saveAddedLeftOptions("addedLeft");
opt.saveAddedRightOptions("addedRight");
opt.saveNewLeftOptions("newLeft");
opt.saveNewRightOptions("newRight");

and here's the code from the control:

<asp:Button ID="btnMoveAll" Text=" >> " CssClass="button7" CausesValidation="false" 
             ONCLICK="opt.transferRight()"
            runat="server" /><br />

In short, it doesn't work. I keep getting an 'opt' is not a member of the page. Can someone explain how I can properly call this code?

Med.Amine.Touil · Accepted Answer · 2015-03-05 21:29:19Z

1

To invoke client Methods(javascript) use OnClientClick

<asp:Button ID="btnMoveAll" Text="" CssClass="button7" CausesValidation="false" 
             OnClientClick="opt.transferRight()"
            runat="server" />

answered Mar 5, 2015 at 21:29

Med.Amine.Touil

1,2352 gold badges12 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

TrevorGoodchild Over a year ago

Tried that but no luck. If I do an alert further up the code to check for lbSiteType alert("<%=lbSiteType.ClientID%>"); it shows up as ct100_ContentPlaceholder1_lbSiteType, which is what I would expect. But further down in the code, when I'm checking the value of 'opt', it just alerts as 'object, object'. So I think the problem is in the: var lb1 = document.getElementById("<%=lbSiteType.ClientID%>"); var lb2 = document.getElementById("<%=lbSelectedSiteType.ClientID%>"); var opt = new OptionTransfer(lb1, lb2);

Med.Amine.Touil Over a year ago

@user2584472 if you wanna get the content of this label use innerHtml() or innerText(). document.getElementById("<%=lbSelectedSiteType.ClientID%>").innerHtml();

Collectives™ on Stack Overflow

ASP.NET referencing a javascript function

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related