WebCombo focus issue

6 replies. Last post: December 20, 2010 1:31 AM by Yudi
Tags :
Frank BruceMember

when I have chosen a value of "WebComName" ,and then I enter keydown ,How can I focus on "WebComUnit" from "WebComName"    ???
Can you give me a demo ?thanks
(My code and picture below)

 JS 
function WebComName_KeyDown() { var WebComName = ISGetObject("WebComName"); var WebComUnit= ISGetObject("WebComUnit"); if (event.keyCode == 13) { WebComUnit.SetFocus(); } }

 WebComName                  
<ISWebCombo:WebCombo  ID="WebComName" runat="server" UseDefaultStyle="True" DataSourceID="SqlwebcomName"
                        Height="20px" Width="100px" DataTextField="fullname" DataValueField="fullname"
                        AllowWildCardSearch="true"  AdditionalSearchFields="fullname,employeecode"
                        TabIndex="1">
                        <Columns>
                            <ISWebCombo:WebComboColumn Width="60px" BaseFieldName="fullname" Name="fullname"
                                HeaderText="姓名" />
                            <ISWebCombo:WebComboColumn Width="60px" BaseFieldName="dept" Name="dept" HeaderText="职位" />
                            <ISWebCombo:WebComboColumn Width="60px" BaseFieldName="employeecode" Name="code"
                                HeaderText="编号" />
                        </Columns>
                        <LayoutSettings ComboMode="MultipleColumns" EntryMode="AutoComplete">                    
                        <ClientSideEvents  OnKeyDown="WebComName_KeyDown" />
                        </LayoutSettings>
                    </ISWebCombo:WebCombo>
                    <asp:SqlDataSource ID="SqlwebcomName" runat="server" ConnectionString="<%$ ConnectionStrings:db_CMSConnectionString %>"
                        SelectCommand="SELECT [employeecode], [fullname] , [dept]  FROM [tb_employee] where dept='进货员' ">
                    </asp:SqlDataSource>
                    

WebComUnit
<ISWebCombo:WebCombo ID="WebComUnit" runat="server" UseDefaultStyle="True" DataSourceID="SqlwebcomUnits"
                        Height="20px" Width="214px" DataTextField="fullname" DataValueField="fullname"
                        AllowWildCardSearch="true"
                        AdditionalSearchFields="fullname,linkman,unitcode" TabIndex="2">
                        <Columns>
                            <ISWebCombo:WebComboColumn Width="150px" BaseFieldName="fullname" Name="fullname"
                                HeaderText="公司" />
                            <ISWebCombo:WebComboColumn Width="60px" BaseFieldName="type" Name="type" HeaderText="类别" />
                            <ISWebCombo:WebComboColumn Width="60px" BaseFieldName="linkman" Name="linkman" HeaderText="联系人" />
                            <ISWebCombo:WebComboColumn Width="60px" BaseFieldName="unitcode" Name="unitcode"
                                HeaderText="编号" />
                        </Columns>
                        <LayoutSettings ComboMode="MultipleColumns" EntryMode="AutoComplete">
                        </LayoutSettings>
                    </ISWebCombo:WebCombo>
                    <asp:SqlDataSource ID="SqlwebcomUnits" runat="server" ConnectionString="<%$ ConnectionStrings:db_CMSConnectionString %>"
                        SelectCommand="SELECT [type], [fullname], [unitcode], [linkman] FROM [tb_units] where type='供货商'">
                    </asp:SqlDataSource>
1 attachment

Answers

Yudi Member

The OnKeyDown client-side event of WebCombo is invoked only when ResultBox is opened (the ResultBox of WebCombo shows you the filtered data based on the inputted text in WebCombo’s TextBox).

The best approach for your scenario is by manually adding the OnKeyDown or OnKeyUp client-side event handler to WebCombo’s text box.

The snippet code below shows how to add the OnKeyUp client-side event handler to WebCombo’s textbox in window on load.

<script type="text/javascript">
    <!--
    window.onload = function () {
        var wcCategoryTxtBox = document.getElementById("wcCategory_text");

        Listener.Add(wcCategoryTxtBox, "onkeyup", wcCategory_OnKeyDown);
            
        return true;
    }

    function wcCategory_OnKeyUp() {
        var wcCategory = ISGetObject("wcCategory");
            
        if (event.keyCode == 13) {
            var wcProduct = ISGetObject("wcProduct");

            window.setTimeout(function () {
                if (wcCategory.Value != "")
                    wcProduct.SetFocus();
                else
                    return false;
            }, 1);
        }

        return true;
    }
    // -->
</script>

This should helps.

All Replies

Yudi Member

I enclosed one simple sample of WebCombo based on your description of your scenario.

On the sample page, there are two WebCombo instances, wcCategory and wcProduct. Both of the WebCombo are bound to ISDataSource control. The data is supplied by dsNorthwind data set. The wcProduct WebCombo has its Link feature enabled where the parent WebCombo id is the wcCategory. In a simple word, wcProduct depend on the value of wcCategory.

On initially, the wcCategory is set to get focus so that user can directly set and choose the value of wcCategory by using following snippet code.

window.onload = function () {
    var wcCategory = ISGetObject("wcCategory");

    wcCategory.SetFocus();

    return true;
}

In OnKeyDown client-side event of wcCategory WebCombo, a validation is added so that if user presses the “Enter” key then set the focus to wcProduct WebCombo.

function wcCategory_OnKeyDown(controlId, keyValue) {
    var wcCategory = ISGetObject("wcCategory");

    if (keyValue == 13) {
        var wcProduct = ISGetObject("wcProduct");

        window.setTimeout(function () {
            wcProduct.SetFocus();
        }, 1);
    }

    return true;
}

A delay (time-out) is added when invoke SetFocus() method because there is another event that happen when value item is selected.

Please let us hear your response whether this helps or not.

1 attachment

I am  sorry,you demo can not meet my need.
Please See the picture below,my need has described by the picture.Thank you.

It such as:

    function wcCategory_OnKeyDown(controlId, keyValue) {
            var wcCategory = ISGetObject("wcCategory");

            if (keyValue == 13 && wcCategory.Value!="") {
                var wcProduct = ISGetObject("wcProduct");

                window.setTimeout(function () {
                    wcProduct.SetFocus();
                }, 1);
            }

            return true;
        }
1 attachment

Can you  help me?the demand is on the last answer

Yudi Member

Please try to use following script and let us know whether it has suit with your scenario or not.

function wcCategory_OnKeyDown(controlId, keyValue) {
    var wcCategory = ISGetObject("wcCategory");

    if (keyValue == 13) {
        var wcProduct = ISGetObject("wcProduct");

        window.setTimeout(function () {
            if (wcCategory.Value != "")
                wcProduct.SetFocus();
        }, 1);
    }

    return true;
}

Hope this helps.

I am sorry your Code It Only works on "when the dropdown has displayed and I press Enter to choose value ".

But  when  I have set value to 'WebComName',I press Enter,It can not Focus to 'WebComUnit'.

Can you  help me?thanks..

Yudi Member

The OnKeyDown client-side event of WebCombo is invoked only when ResultBox is opened (the ResultBox of WebCombo shows you the filtered data based on the inputted text in WebCombo’s TextBox).

The best approach for your scenario is by manually adding the OnKeyDown or OnKeyUp client-side event handler to WebCombo’s text box.

The snippet code below shows how to add the OnKeyUp client-side event handler to WebCombo’s textbox in window on load.

<script type="text/javascript">
    <!--
    window.onload = function () {
        var wcCategoryTxtBox = document.getElementById("wcCategory_text");

        Listener.Add(wcCategoryTxtBox, "onkeyup", wcCategory_OnKeyDown);
            
        return true;
    }

    function wcCategory_OnKeyUp() {
        var wcCategory = ISGetObject("wcCategory");
            
        if (event.keyCode == 13) {
            var wcProduct = ISGetObject("wcProduct");

            window.setTimeout(function () {
                if (wcCategory.Value != "")
                    wcProduct.SetFocus();
                else
                    return false;
            }, 1);
        }

        return true;
    }
    // -->
</script>

This should helps.

All times are GMT -5. The time now is 9:04 AM.
Previous Next