I am creating a guided ad-hoc application and using javascript and jquery to add additional code to the PRINT columns (CNT., CNT.DST., MIN., etc...). So I want the double list box to copy the items not move them. Because a user may want to get the count and distinct count for items. Anyone no how to tell the double list box to copy not move the items?

WF8x

This message has been edited. Last edited by: <Kathryn Henning>,

Hi All,

TexasStingray has opened a New Feature Request for this functionality as it's not currently available.

Regards,

Kathryn

TexasStingray,

I developed a guided ad-hoc application in App Studio that does what you have requested. I used jQuery to make the copy happen.

My application has a double list box in which a user needs to select fields multiple times, then apply WebFOCUS field functions to them. In my case, the FOCUS fex is a SUM, not a PRINT, but the principle is the same.

The user selects numeric fields from the left side of the double list box, and uses the right triangle button to copy the field over to the right side. On the far right of the listbox I have 10 buttons stacked vertically. They are:

Sum
Ave
Count
Max
Median
Min
Mode
Pct
Pct Cnt
Tot

Each button has a click event attached to it. After a user copies fields into the right side selection box, the selected items can be highlighted and one of the 10 buttons above can be clicked to implement a WebFOCUS field function. Both the "text" that the user sees and the "value" that will be sent to the fex are changed.

For example, if a user selects a field, then clicks the "average" button, this will display:

Ave-->|FIELDNAME

But what will be sent to the fex file is this:

AVE.FIELDNAME

The user can also move items back to the left side by using the left triangle button. The jQuery code ensures that the fields on the left side are sorted and only one copy of a field name is shown, no matter how many times it is put back.

Here is the code for the ten math function buttons:

//Begin function sum_button_onclick
function sum_button_onclick(event) {
    $("#customselect1_selectto option:checked").each(function() { this.text = "" + this.text.replace(/^(.*)\|/, ''); });
    $("#customselect1_selectto option:checked").each(function() { this.value = "" + this.value.replace(/^(.*)\./, ''); });
}

//Begin function avg_button_onclick
function ave_button_onclick(event) {
    $("#customselect1_selectto option:checked").each(function() { this.text = "Ave-->|" + this.text.replace(/^(.*)\|/, ''); });
    $("#customselect1_selectto option:checked").each(function() { this.value = "AVE." + this.value.replace(/^(.*)\./, ''); });
}

//Begin function cnt_button_onclick
function cnt_button_onclick(event) {
    $("#customselect1_selectto option:checked").each(function() { this.text = "Cnt-->|" + this.text.replace(/^(.*)\|/, ''); });
    $("#customselect1_selectto option:checked").each(function() { this.value = "CNT." + this.value.replace(/^(.*)\./, ''); });
}

//Begin function max_button_onclick
function max_button_onclick(event) {
    $("#customselect1_selectto option:checked").each(function() { this.text = "Max-->|" + this.text.replace(/^(.*)\|/, ''); });
    $("#customselect1_selectto option:checked").each(function() { this.value = "MAX." + this.value.replace(/^(.*)\./, ''); });
}

//Begin function mdn_button_onclick
function mdn_button_onclick(event) {
    $("#customselect1_selectto option:checked").each(function() { this.text = "Mdn-->|" + this.text.replace(/^(.*)\|/, ''); });
    $("#customselect1_selectto option:checked").each(function() { this.value = "MDN." + this.value.replace(/^(.*)\./, ''); });
}

//Begin function min_button_onclick
function min_button_onclick(event) {
    $("#customselect1_selectto option:checked").each(function() { this.text = "Min-->|" + this.text.replace(/^(.*)\|/, ''); });
    $("#customselect1_selectto option:checked").each(function() { this.value = "MIN." + this.value.replace(/^(.*)\./, ''); });
}

//Begin function mde_button_onclick
function mde_button_onclick(event) {
    $("#customselect1_selectto option:checked").each(function() { this.text = "Mde-->|" + this.text.replace(/^(.*)\|/, ''); });
    $("#customselect1_selectto option:checked").each(function() { this.value = "MDE." + this.value.replace(/^(.*)\./, ''); });
}

//Begin function pct_button_onclick
function pct_button_onclick(event) {
    $("#customselect1_selectto option:checked").each(function() { this.text = "Pct-->|" + this.text.replace(/^(.*)\|/, ''); });
    $("#customselect1_selectto option:checked").each(function() { this.value = "PCT." + this.value.replace(/^(.*)\./, ''); });
}

//Begin function pct_cnt_button_onclick
function pct_cnt_button_onclick(event) {
    $("#customselect1_selectto option:checked").each(function() { this.text = "Pct Cnt-->|" + this.text.replace(/^(.*)\|/, ''); });
    $("#customselect1_selectto option:checked").each(function() { this.value = "PCT.CNT." + this.value.replace(/^(.*)\./, ''); });
}

//Begin function total_button_onclick
function total_button_onclick(event) {
    $("#customselect1_selectto option:checked").each(function() { this.text = "Tot-->|" + this.text.replace(/^(.*)\|/, ''); });
    $("#customselect1_selectto option:checked").each(function() { this.value = "TOT." + this.value.replace(/^(.*)\./, ''); });
}

This is the code for the right triangle button, which the user clicks on to select copies of a field (Note that double-clicking on a field moves it to the right side, so the user is required to use the right triangle button to make copies):

//Begin function customselect1_addbutton_onclick
function customselect1_addbutton_onclick(event) {
    event.stopImmediatePropagation();
    $("#customselect1_selectfrom option:checked").each(
        function() {
            $("#customselect1_selectto").append('<option value="' + this.value + '">' + this.text + '<' + '/' + 'option>')
        });
}

(The "event.stopImmediatePropagation()" function cancels the default move behavior.)

This is the code for the left triangle button, for when the user wants to move selected fields back to the left side of the double list box:

//Begin function customselect1_removebutton_onclick
function customselect1_removebutton_onclick(event) {
    $("#customselect1_selectto option:checked").each(function() { this.text = "" + this.text.replace(/^(.*)\|/, ''); });
    $("#customselect1_selectto option:checked").each(function() { this.value = "" + this.value.replace(/^(.*)\./, ''); });
    $("#customselect1_selectto option:checked").each(function() { $("#customselect1_selectfrom [value='" + this.value + "']").remove(); });

    //Resort after a brief delay, to give time for choices
    //to move back over to the "from" side of the double listbox
    setTimeout(function(){ resort() }, 100);

    //Begin function resort
    function resort() {
        var lb = document.getElementById('customselect1_selectfrom');
        var arrTexts = new Array();
        for(i=0; i<lb.length; i++)  {
            arrTexts[i] = new Array(2);
            arrTexts[i][0] = lb.options[i].text;
            arrTexts[i][1] = lb.options[i].value;
        }
        arrTexts.sort(sortFunction);
        for(i=0; i<lb.length; i++)  {
            lb.options[i].text = arrTexts[i][0];
            lb.options[i].value = arrTexts[i][1];
        }
    }
    function sortFunction(a, b) {
        if (a[0] === b[0]) {
            return 0;
        }
        else {
            return (a[0] < b[0]) ? -1 : 1;
        }
    }
    //End function resort
}

After a slight delay to allow the double list box time to update the display, the left side is sorted.