PetrQ 0 Newbie Poster

Hello all,
please help!
I need use two jquery scripts - dynamic select box and clone row.
Each of them work fine but I cannot find the way to use it together in one script.
Thank you for any suggestion! Petr

live demo: http://www.guitarcases.cz/index.php?clanek=zakaznik_objednavkawww

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />



<script type="text/javascript">
		$(function(){
			// start a counter for new row IDs
			// by setting it to the number
			// of existing rows
			var newRowNum = 0;
		
			// bind a click event to the "Add" link
			$('#addnew').click(function(){
				// increment the counter
				newRowNum += 1;
						
				// get the entire "Add" row --
				// "this" refers to the clicked element
				// and "parent" moves the selection up
				// to the parent node in the DOM
				var addRow = $(this).parent().parent();
				
				// copy the entire row from the DOM
				// with "clone"
				var newRow = addRow.clone();
				
				// set the values of the inputs
				// in the "Add" row to empty strings
				$('input', addRow).val('');
				
				// replace the HTML for the "Add" link 
				// with the new row number
				$('td:first-child', newRow).html(newRowNum);
				
				// insert a remove link in the last cell
				$('td:last-child', newRow).html('<a href="" class="remove">Remove<\/a>');
				
				// loop through the inputs in the new row
				// and update the ID and name attributes
				$('input', newRow).each(function(i){
					var newID = newRowNum + '_' + i;
					$(this).attr('id',newID).attr('name',newID);
				});
				
				// insert the new row into the table
				// "before" the Add row
				addRow.before(newRow);
				
				// add the remove function to the new row
				$('a.remove', newRow).click(function(){
					$(this).parent().parent().remove();
					return false;				
				});
			
				// prevent the default click
				return false;
			});
		});
		</script>


<script language="javascript">
function makeSublist(parent,child,isSubselectOptional,childVal)
{
	$("body").append("<select style='display:none' id='"+parent+child+"'></select>");
	$('#'+parent+child).html($("#"+child+" option"));

	var parentValue = $('#'+parent).attr('value');
	$('#'+child).html($("#"+parent+child+" .sub_"+parentValue).clone());

	childVal = (typeof childVal == "undefined")? "" : childVal ;
	$("#"+child).val(childVal).attr('selected','selected');

	$('#'+parent).change(function(){
		var parentValue = $('#'+parent).attr('value');
		$('#'+child).html($("#"+parent+child+" .sub_"+parentValue).clone());
		if(isSubselectOptional) $('#'+child).prepend("<option value='none' selected='selected'> -- Select -- </option>");
		$('#'+child).trigger("change");
		$('#'+child).focus();
	});
}

$(document).ready(function()
{
	makeSublist('child','grandsun', true, '');	
	makeSublist('parent','child', false, '1');	
	
	
	
	$("#selectListButton1").click(function(){
		alert( 'Value is: ' + $('#parent').val() );
	});
	$("#selectListButton2").click(function(){
		alert( 'Text is: ' + $('#child :selected').text() );
	});


	
	
	
});
</script>
</head>
<body>




<form method='POST' name='signupForm' class='cmxform' id='signupForm' action='#'>
 <table cellspacing='0'>
 <tr></tr>
 <tr>
      <td><a id="addnew" href="">Add</a></td>
 <td>
<select id="parent">
	<option value="1">Flower</option>
	<option value="2">Animal</option>

</select>
</td>

<td>
<select id="child">
	<option class="sub_1" value="1">Rose</option>
	<option class="sub_1" value="2">Sunflower</option>
	<option class="sub_1" value="3">Orchid</option>
	<option class="sub_2" value="4">Cow</option>
	<option class="sub_2" value="5">Dog</option>

	<option class="sub_2" value="6">Cat</option>
	<option class="sub_2" value="7">Tiger</option>
</select>
</td>
<td>
<select id="grandsun">
	<option class="sub_1" value="1">Rose type 1</option>
	<option class="sub_1" value="2">Rose type 2</option>
	<option class="sub_1" value="3">Rose type 3</option>

	<option class="sub_2" value="4">Sunflower type 1</option>
	<option class="sub_2" value="5">Sunflower type 2</option>
	<option class="sub_3" value="6">Orchid type 1</option>
	<option class="sub_3" value="7">Orchid type 2</option>
	<option class="sub_4" value="8">Cow type 1</option>
	<option class="sub_4" value="9">Cow type 2</option>

	<option class="sub_5" value="10">Dog type 1</option>
	<option class="sub_6" value="11">Cat type 2</option>
	<option class="sub_7" value="12">Tiger type 2</option>
	<option class="sub_7" value="13">Tiger type 2</option>
	<option class="sub_7" value="14">Tiger type 3</option>
	
</select>
</td>
</tr>
<tr>
<td>
<button id="selectListButton1">Get Value</button>    <button id="selectListButton2">Get Text</button>
</td>

	  </tr>
	  </table>
	  </form>

</body>
</html>