Pole ma się pojawić dopiero po wybraniu czegoś z listy

0

Witam,
Bardzo proszę o pomoc...
Mam formularz w nim pole z listą. Po wybraniu odpowiedniej wartości z listy pokazuje kolejne pole: drugą listę z danymi z bazy danych lub pole typu autocomplet - zależy co wybrano w pierwszej liście. Niby wszystko działa do momentu pola autocomplet.

Fragment Formularz.php

	<select name="lista" id="lista"  onchange="showCustomer(this.value)">
	<option value="0">jeden</option>
	<option value="1">dwa</option>
	<option value="2">trzy</option>
</select>

<div id="txtHint">	Tu pokaże  nowe pola po wybraniu czegoś z listy</div>

// Skrypt odpowiedzialny za załadowanie nowych danych do div'a txtHint  po wybraniu czegoś z listy
<script>
function showCustomer(str) {
 if (str=="") {
    document.getElementById("txtHint").innerHTML="";
    return;
  }
  if (window.XMLHttpRequest) {
    // code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
  } else {  // code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.onreadystatechange=function() {
    if (this.readyState==4 && this.status==200) {
      document.getElementById("txtHint").innerHTML=this.responseText;
    }
  }
  xmlhttp.open("GET","showfield.php&idfield="+str,true);
  xmlhttp.send();
}
</script>

// Skrypt odpowiedzialny za pole autocomplete, który wysyła dane  do fieldauto.php gdzie wszystko jest pobierane z bazy danych w pętli while
<script type='text/javascript' >
    $( function() {
        $( "#autocomplete-custom1" ).autocomplete({
			minLength: 2,
            source: function( request, response ) {
                $.ajax({
                    url: "fieldauto.php",
                    type: 'post',
                    dataType: "json",
                    data: {
                        search: request.term,
                    },
                    success: function( data ) {
                        response( data );
                    }
                });
            },
            select: function (event, ui) {
                $('#autocomplete-custom1').val(ui.item.label); // display the selected text
				
				$('#selectcustom1_id').val(ui.item.value); // save selected id to input

				
				
                return false;
            }
        });

    });

    function split( val ) {
      return val.split( /,\s*/ );
    }
    function extractLast( term ) {
      return split( term ).pop();
    }
    </script>

jeśli dodam poniższy kod do Formularz.php to pole autocomplete działa

<input type='text' id='autocomplete-custom1' >
<input type="text" name="selectcustom1_id" id="selectcustom1_id" />

ale przecież pola te mają być załadowane tylko wtedy jeśli użytkownik wybierze odpowiednią wartość z listy więc powyższy fragment kodu umieściłem w pliku który ma być załadowany po wybraniu czegoś z listy (showfield.php)
Pole autocomplete się pojawia, ale niestety nie działa. Mam tu namyśli, że po wpisaniu pierwszych liter słowa nie pokazuje propozycji pasujących wartości... co robię źle?.. Dodam, że cały kod odpowiedzialny za pole autocomplete jest poprawny bo pola działają jeśli zostaną zładowane od razu.

0

A zobacz jaki html generuje Twój skrypt JS.
Jeśli taki sam co z ręki to zobacz TO jako inspiracja

1 użytkowników online, w tym zalogowanych: 0, gości: 1