Click here to Skip to main content
15,665,319 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
Hi Friends,
I want to add items in ListBox on press of (Enter) key in TextBox.
(Just like we do while logging in --put id & password and hit Enter).
I know this is possible with onkeyup event and it worked for me very well.
I have another Button , on click of which I want to get the items in the ListBox.
I managed to do this on client side with no problem.

Now my problem is, when i try to put another item in list box,
I type some text in textbox & hit Enter, the item does not get added in the listbox.
But instead, it calls the button's OnClientClick event.
I wonder how the OnClientClick event is getting fired.

This is my ASPX :

    <asp:UpdatePanel ID="PnlUpdate" runat="server" UpdateMode="Conditional">
                    <td align="center">
                        <asp:TextBox ID="txtPONo" runat="server"  onKeyUp="inputKeyUp(event)"></asp:TextBox>
                    <td align="center">
                        <asp:ListBox ID="lstPONo" runat="server" SelectionMode="Multiple" Height="300px"></asp:ListBox>
                        <asp:Button ID="btnAddToList" runat="server" OnClientClick="GetPOListInHiddenField()" Text="Get PO List" />

<script type="text/javascript">
    function inputKeyUp(e) {
        e.which = e.which || e.keyCode;
        if (e.which == 13) {
            var varFromBox = document.all('lstPONo');
            var ListBox = document.getElementById('ctl00_MainContentPlaceHolder_lstPONo');
            var TextBox = document.getElementById('ctl00_MainContentPlaceHolder_txtPONo');

            if (document.getElementById('ctl00_MainContentPlaceHolder_txtPONo').value.replace(/\s/g, "") != "") {
                var myOption = new Option();
                myOption.text = document.getElementById('ctl00_MainContentPlaceHolder_txtPONo').value.trim(); //Textbox's value
                myOption.value = document.getElementById('ctl00_MainContentPlaceHolder_txtPONo').value.trim(); //Textbox's value
                document.getElementById('ctl00_MainContentPlaceHolder_txtPONo').value = '';
                alert("Please enter PO Number");

function GetPOListInHiddenField() {
        var htmlSelect = document.getElementById('ctl00_MainContentPlaceHolder_lstPONo'); //html select box 
        var listLength = htmlSelect.options.length;
        for (var i = 0; i < listLength; i++) {
            document.getElementById('ctl00_MainContentPlaceHolder_HiddenField_PONoList').value = document.getElementById('ctl00_MainContentPlaceHolder_HiddenField_PONoList').value + htmlSelect.options[i].value + ",";


I am doing this on client side is because, the user will be putting almost over 100 records in List.
And if I go for server side code, that will be costly in performance.

So if you know any better ways,
please suggest me.

Please help me friends.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900