Ergebnis 1 bis 2 von 2

Thema: DevBridge Autocomplete wirkt nicht auf nachgealdene Elemente

  1. #1
    Neuer Benutzer
    Registriert seit
    26.11.2016
    Beiträge
    2

    DevBridge Autocomplete wirkt nicht auf nachgealdene Elemente

    Hallo liebe Community,

    ich habe ein Problem mit jQuery und der Wirksamkeit auf nachgeladene Objekte. Beim initial geladenen Input-Feld wirkt die class Autocomplete-Ajax problemlos. Bei nachgeladenen inputfeldern wirkt die Klasse nicht. Hier ist der Code:

    HTML-Code:
    <body>
        <div class="container">
            <h1>Anästhesie Prämedikation</h1>
    
            <h2>Anamnese</h2>
            <p>Diagnose:</p>
            <div style="position: relative; height: 60px;">
            <div class="input_fields_wrap">
            <input type="text" name="mytext[]" class="autocomplete-ajax"><input type="checkbox" name="diagnosestandard[]"></div>
    		<button class="add_field_button">Add More Fields</button>
        </div>
        
      
    
        <script type="text/javascript" src="scripts/jquery-1.8.2.min.js"></script>
        <script type="text/javascript" src="scripts/jquery.mockjax.js"></script>
        <script type="text/javascript" src="src/jquery.autocomplete.js"></script>
        <script type="text/javascript" src="scripts/demo2.js"></script>
    </body>
    Sowie die dazughörige Jquery-Datei:

    Code:
    	
    	$(document).ready(function() {
        var max_fields      = 10; //maximum input boxes allowed
        var wrapper         = $(".input_fields_wrap"); //Fields wrapper
        var add_button      = $(".add_field_button"); //Add button ID
        
        var x = 1; //initlal text box count
        $(add_button).click(function(e){ //on add input button click
            e.preventDefault();
            if(x < max_fields){ //max input box allowed
                x++; //text box increment
                $(wrapper).append('<div><input class="autocomplete-ajax" type="text" name="mytext[]" autocomplete="off"/><input type="checkbox" name="diagnosestandard[]"><a href="#" class="remove_field">Remove</a></div>'); //add input box
            }
            
        });
        
        $(wrapper).on("click",".remove_field", function(e){ //user click on remove text
            e.preventDefault(); $(this).parent('div').remove(); x--;
        })
    
        'use strict';
    
        
        $('.autocomplete-ajax').autocomplete({
        serviceUrl: '/autocomplete/data.php',
        dataType: 'json',
        onSelect: function (suggestion) {
     
         
        }   
        });
        
    	});
    Hat jemand eine Idee?

    Vielen Dank!

    Hans

  2. #2
    Erfahrener Benutzer
    Registriert seit
    29.10.2014
    Beiträge
    477
    Schau dir mal delegate an.
    i++; // zaehler i um 1 erhoehen

Lesezeichen

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •