jQuery: Textbox value to Listbox

Discussion in 'jQuery' started by cancer10, Nov 2, 2008.

  1. #1
    Hello,

    I have the following:
    - textbox (txt_RegionName)
    - button (btn_AddToList)
    - listbox (lst_Regions)

    I want to add text to listbox which I enter in the textbox on click of the button.


    For example, If I enter "xyz" in the textbox >> [click button] >> Its should add in the listbox.

    I am using the following code to do this but getting a diff result. The whole of the textbox is getting listed in the listbox. (pic attached)

    <script>
    			
    			
    	$(document).ready(function(){
    	
    	
    		$("#btn_AddToList").click(function(){
    		$('input[name=txt_RegionName]').appendTo("#lst_Regions");
    		 });
    			
    			
    	});
    </script>
    Code (markup):

    Plz tell me a solution.


    Thanx
     

    Attached Files:

    cancer10, Nov 2, 2008 IP
  2. Sergey Ten

    Sergey Ten Peon

    Messages:
    8
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Hi, Raider

    Try this:

    
    <html>
    <head>
    <title>Add to list box</title>
    <script type="text/javascript" src="js/jquery.js"></script>
    </head>
    <body>
    	<input type="text" name="region" id="txt_RegionName" /><br />
    	<input type="button" name="add" id="btn_AddToList" value="add" /></br />
    	<select size="7" id="lst_Regions" style="width: 200px;">
    	</select>
    <script type="text/javascript">
    $(function()
    {
    	$('#btn_AddToList').click(function()
    	{
    		var select = document.getElementById('lst_Regions');
    		var region = $('#txt_RegionName').val();
    	
    		if('' != region)
    		{
    			var newOption = document.createElement('option');
    
    			newOption.text = region;
    			newOption.value = region;
    		
    			if($.browser.msie)
    			{
    				select.add(newOption);
    			}
    			else
    			{
    				select.add(newOption, null);
    			}
    		}
    
    		return false;
    	});
    });
    </script>
    </body>
    </html>
    
    PHP:
    It should be work.
     
    Sergey Ten, Nov 3, 2008 IP
  3. cancer10

    cancer10 Guest

    Messages:
    364
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Thanx so much for your reply.

    I actually wanted this in jQuery.


    Thanx
     
    cancer10, Nov 3, 2008 IP
  4. Sergey Ten

    Sergey Ten Peon

    Messages:
    8
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Cancer,

    So you could use this jQuery plugin:
    
    http://www.texotela.co.uk/code/jquery/select/
    
    Code (markup):
     
    Sergey Ten, Nov 3, 2008 IP