Intersoft Community - WebCombo - how to select a value in webcombo 1 and autoshow the first result in webcombo 2

how to select a value in webcombo 1 and autoshow the first result in webcombo 2

yudi — Tue, 20 Nov 2012 21:01:23 GMT

Glad to hear the good news.

Should you need further assistance or run into any problems regarding our controls, feel free to post it into the community site. We would be happy to assist you again.

how to select a value in webcombo 1 and autoshow the first result in webcombo 2

macedes — Tue, 20 Nov 2012 05:47:34 GMT

I found a solution, thanks anyway

 function WebCombo1_OnAfterItemSelected(controlId) {
            var WebCombo1 = ISGetObject("WebCombo1");
            var grid = ISGetObject("WebGrid1");
            grid.GetSelectedObject().ToRowObject().GetCell('NAME').SetText(WebCombo1.GetSelectedRow().cells[1].innerText, true);
            return true;
        }

how to select a value in webcombo 1 and autoshow the first result in webcombo 2

yudi — Tue, 20 Nov 2012 04:21:46 GMT

I enclosed my test page as attachment to be evaluated on your end. Please try to change/modify the WebCombo’s selected row under Supplier-Company or Supplier-ContactName column and let us know whether this helps or not.

how to select a value in webcombo 1 and autoshow the first result in webcombo 2

macedes — Tue, 20 Nov 2012 02:47:14 GMT

i tried your solution. when i debug the page i can see that it saves the correct name in this line:

gridCellCity.SetText(WebCombo2.GetSelectedRow().cells[1].innerText, true);

but the row is still empty.

the datasource look like this:

        WebCombo1.DataSource = allUsers
        WebCombo1.DataTextField = "Trigram"
        WebCombo1.DataValueField = "Trigram"
        WebCombo1.DataBind()
        WebCombo2.DataSource = allUsers
        WebCombo2.DataTextField = "Name"
        WebCombo2.DataValueField = "Name"
        WebCombo2.DataBind()

And here are the functions:

 function WebCombo1_OnAfterItemSelected(controlId) {
            var WebCombo1 = ISGetObject("WebCombo1");
            var WebCombo1_rowIdx = WebCombo1.GetSelectedRow().rowIndex;
            var grid = ISGetObject("WebGrid1");
            var gridRow = grid.GetSelectedObject().GetRowObject();
            var gridCell = gridRow.GetCells();
            var gridCellCity = gridCell.GetNamedItem("TRIGRAM");
            gridCellCity.SetText(WebCombo1.GetSelectedRow().cells[1].innerText, true);
            return true;
        }
        function WebCombo2_OnAfterItemSelected(controlId) {
            var WebCombo2 = ISGetObject("WebCombo2");
            var WebCombo2_rowIdx = WebCombo2.GetSelectedRow().rowIndex;
            var grid = ISGetObject("WebGrid1");
            var gridRow = grid.GetSelectedObject().GetRowObject();
            var gridCell = gridRow.GetCells();
            var gridCellCity = gridCell.GetNamedItem("NAME");
            gridCellCity.SetText(WebCombo2.GetSelectedRow().cells[1].innerText, true);
            return true;
        }

Webcombo 1

      <ISWebCombo:WebCombo ID="WebCombo1" runat="server" Height="20px" 
                UseDefaultStyle="True" Width="300px" DataMember="">
                <LayoutSettings EntryMode="AutoComplete" AlwaysShowAllRowsOnDropdown="true" ComboMode="MultipleColumns">
                <ClientSideEvents OnAfterItemSelected="WebCombo1_OnAfterItemSelected" />
                </LayoutSettings>
            </ISWebCombo:WebCombo>

Webcombo 2

<ISWebCombo:WebCombo ID="WebCombo2" runat="server" UseDefaultStyle="True" 
             DataMember="" Height="20px" Width="300px">
        <LayoutSettings EntryMode="AutoComplete" AlwaysShowAllRowsOnDropdown="true" ComboMode="MultipleColumns">
        </LayoutSettings>
         </ISWebCombo:WebCombo>

Webgrid

  <ISWebGrid:WebGridColumn Caption="Trigram" DataMember="TRIGRAM" Name="TRIGRAM" 
                        EditType="WebComboNET" WebComboID="WebCombo1" Width="200px" meta:resourcekey="Trigram">
                        </ISWebGrid:WebGridColumn>
                        <ISWebGrid:WebGridColumn Caption="Name" DataMember="NAME" Name="NAME"
                         EditType="WebComboNET" WebComboID="WebCombo2" Width="200px" meta:resourcekey="Name"
                            InputRequired="true">
                        </ISWebGrid:WebGridColumn>

how to select a value in webcombo 1 and autoshow the first result in webcombo 2

yudi — Tue, 20 Nov 2012 00:01:46 GMT

Thank you for your feedback.

I have modified my test page so that it would be compatible with a dynamic list. The key is that we need to have a multiple column WebCombo. Why multiple column WebCombo? Because we need to obtain the other column information of WebCombo’s selected row. For example: when user selects a name, we need to obtain the phone number of the selected person.

After enable the multiple column feature of WebCombo, we can simplify the OnAfterItemSelected JavaScript function into the following.

function WebCombo1_OnAfterItemSelected(controlId)
{
    var WebCombo1 = ISGetObject("WebCombo1");
    var WebCombo1_rowIdx = WebCombo1.GetSelectedRow().rowIndex;
    var grid = ISGetObject("WebGrid1");
    var gridRow = grid.GetSelectedObject().GetRowObject();
    var gridCell = gridRow.GetCells();
    var gridCellCity = gridCell.GetNamedItem("Supplier-ContactName");
    gridCellCity.SetText(WebCombo1.GetSelectedRow().cells[1].innerText, true);
    return true;
}
function WebCombo2_OnAfterItemSelected(controlId)
{
    var WebCombo2 = ISGetObject("WebCombo2");
    var WebCombo2_rowIdx = WebCombo2.GetSelectedRow().rowIndex;
    var grid = ISGetObject("WebGrid1");
    var gridRow = grid.GetSelectedObject().GetRowObject();
    var gridCell = gridRow.GetCells();
    var gridCellCity = gridCell.GetNamedItem("Supplier-PhoneNumber");
    gridCellCity.SetText(WebCombo2.GetSelectedRow().cells[1].innerText, true);
    return true;
}

Additionally, we can utilize the RenderOnHidden property of WebComboColumn to have WebCombo show a single column.

<ISWebCombo:WebCombo ID="WebCombo1" runat="server" DataSourceID="AccessDataSource2"
    DataTextField="CompanyName" DataValueField="SupplierID" Height="20px" UseDefaultStyle="True"
    Width="200px">
    <LayoutSettings AlwaysShowAllRowsOnDropdown="true" ComboMode="MultipleColumns" >
        <ClientSideEvents OnAfterItemSelected="WebCombo1_OnAfterItemSelected" />
    </LayoutSettings>
    <Columns>
        <ISWebCombo:WebComboColumn BaseFieldName="PhoneNumber" HeaderText="PhoneNumber"
            Name="PhoneNumber" />
        <ISWebCombo:WebComboColumn BaseFieldName="ContactName" Name="ContactName"
            RenderOnHidden="true" Hidden="true" />
    </Columns>
</ISWebCombo:WebCombo>
<ISWebCombo:WebCombo ID="WebCombo2" runat="server" DataSourceID="AccessDataSource2"
    DataTextField="ContactName" DataValueField="SupplierID" Height="20px" UseDefaultStyle="True"
    Width="200px">
    <LayoutSettings AlwaysShowAllRowsOnDropdown="true" ComboMode="MultipleColumns" >
        <ClientSideEvents OnAfterItemSelected="WebCombo2_OnAfterItemSelected" />
    </LayoutSettings>
    <Columns>
        <ISWebCombo:WebComboColumn BaseFieldName="ContactName" HeaderText="ContactName"
            Name="ContactName" />
        <ISWebCombo:WebComboColumn BaseFieldName="PhoneNumber" Name="PhoneNumber"
            RenderOnHidden="true" Hidden="true" />
    </Columns>
</ISWebCombo:WebCombo>

Please let us know whether this helps or not.

how to select a value in webcombo 1 and autoshow the first result in webcombo 2

macedes — Mon, 19 Nov 2012 01:57:31 GMT

thanks for your help but how can i do that with a dynamic list? or a database?

how to select a value in webcombo 1 and autoshow the first result in webcombo 2

yudi — Fri, 16 Nov 2012 01:34:02 GMT

I made a simple sample of WebGrid based on the given information of your scenario. A WebGrid is bound to Products table of Northwind.mdb. In the RootTable, there are Supplier-Company column and Supplier-ContactName column. wcSupplierCompany and wcSupplierContactName WebCombo controls are assigned for each of those columns respectively.

When user select "Exotic Liquids" from wcSupplierCompany, then the text of SupplierContactName column is set to "Charlotte ". When user select "New Orleans Cajun Delights" from wcSupplierCompany, then the text of SupplierContactName column is set to "Shelley Burke". And so on.

Please try to use the OnAfterItemSelected of WebCombo's client-side event to set the value of another control such as shown in the following snippet code.

function WebCombo1_OnAfterItemSelected(controlId)
{
    var WebCombo1 = ISGetObject("WebCombo1");
    var grid = ISGetObject("WebGrid1");
    var row = grid.GetSelectedObject().GetRowObject();
            
    if (WebCombo1.Text == "Exotic Liquids")
    {
        var cells = row.GetCells();
        var cellCity = cells.GetNamedItem("Supplier-ContactName");
        cellCity.SetText("Charlotte Cooper");
        cellCity.SetValue("Charlotte Cooper");
    }
    if (WebCombo1.Text == "New Orleans Cajun Delights")
    {
        var cells = row.GetCells();
        var cellCity = cells.GetNamedItem("Supplier-ContactName");
        cellCity.SetText("Shelley Burke");
        cellCity.SetValue("Shelley Burke");
    }
    if (WebCombo1.Text == "Grandma Kelly's Homestead")
    {
        var cells = row.GetCells();
        var cellCity = cells.GetNamedItem("Supplier-ContactName");
        cellCity.SetText("Regina Murphy");
        cellCity.SetValue("Regina Murphy");
    }
    return true;
}

Next, we can add the wcSupplierContactName_OnAfterItemSelected client-side event to set the value of Supplier-Company column.

Please allow me to suggest another approach for this kind of scenario. In my opinion, we can use the multiple column WebCombo as the Supplier column's EditType. By enabling the multiple column feature of WebCombo, user can see the detail information of Supplier in a WebCombo.

You may also try to set the AdditionalSearchField of WebCombo to provide user a convenient way to search more than one data field instead of specified DataTextField.

Please let us know whether this helps or not.

how to select a value in webcombo 1 and autoshow the first result in webcombo 2

macedes — Thu, 15 Nov 2012 06:19:23 GMT

Hello, i have 2 webcombos and a webgrid.

the first webcombo has the same sqldatasource as the second webcombo.

the difference between them two is, that i can select in the first webcombo the name and in the second webcombo i can select the tel number.

what i want is that when i select a tel nr. in the second webcombo the first should show me the name which belongs to the number. and the other way too.

i am using the webcombos in the webgrid to add data in the table.

is that possible?

Thanks in advance for your help