2015-07-15 7 views
10

Ich habe es schon versucht: yii2 dependent autocomplete widgetYii2 DropDownList Onchange Änderung Autocomplete Widget "source" Attribut?

aber ich weiß nicht, warum es nicht funktioniert. hier mein html mit Skript:

<?= $form->field($model, 'lbt_holder_type')->dropDownList(['prompt' => '--- Select Holder Type ---', 'S' => 'Student', 'E' => 'Employee'], 
        ['onChange' => 'JS: var value = (this.value); 
           if(value == "S"){$(#libraryborrowtransaction-name).autoComplete({source: '. $s_data.');} 
           if(value == "E"){$(#libraryborrowtransaction-name).autoComplete({source: '. $e_data.');} 

        '])?> 

Automatische Vervollständigung:

<?= $form->field($model, 'name')->widget(\yii\jui\AutoComplete::classname(), [ 
       'options' => ['class' => 'form-control', 'placeholder' => 'Enter Name/ID'], 
       'clientOptions' => [ 
        'source' => $s_data, 
        'autoFill' => true, 
        'minLength' => '1', 
        'select' => new yii\web\JsExpression("function(event, ui) { 
         $('#libraryborrowtransaction-lbt_holder_id').val(ui.item.id); 
        }") 
       ], 
      ])?> 

ich will nach Dropdownlist-Wert der automatischen Vervollständigung Quelle ändern, wenn S dann $ S_DATA sonst Last $ e_data laden. Jede Hilfe mit diesem. Vielen Dank.

Hier ist meine Daten,

$s_data = (new \yii\db\Query()) 
->select(["CONCAT(stu_unique_id,' - ',stu_first_name,' ',stu_last_name) as value","CONCAT(stu_unique_id,' - ',stu_first_name,' ',stu_last_name) as label","s_info.stu_info_stu_master_id as id"]) 
->from('stu_master stu') 
->join('join','stu_info s_info','s_info.stu_info_id = stu_master_stu_info_id') 
->where('is_status = 0') 
->all(); 

und

$e_data = (new \yii\db\Query()) 
    ->select(["CONCAT(emp_unique_id, ' - ',emp_first_name,' ',emp_last_name) as value","info.emp_info_emp_master_id as id"]) 
    ->from('emp_master emp') 
    ->join('join', 'emp_info info', 'info.emp_info_id = emp_info_emp_master_id') 
    ->where('is_status = 0')   
    ->all(); 
+0

Wer wird mir heute helfen ??? –

Antwort

8

Nun, ich habe den Code-Schnipsel zu meinem Test yii2 Umgebung hinzugefügt, um zu testen, was falsch ist. So gibt es einige Probleme mit Ihrem Code:

[ 
    'onChange' => 
     'JS: var value = (this.value); 

     if(value == "S"){$(#libraryborrowtransaction-name). 
      autoComplete({source: '. $s_data.');} 

     if(value == "E"){$(#libraryborrowtransaction-name). 
      autoComplete({source: '. $e_data.');} 

'] 

Als erstes habe ich bemerkt, was yii etwas Flucht für Anführungszeichen Symbole für „S“ gelten und „E“, und Ihr Code in Browser sieht aus wie &quot;S&quot;.

Als nächstes fügt jui Autocomplete-Plugin eine Eigenschaft zu jquery Prototyp mit dem Namen "autocomplete", aber nicht "autoComplete". Da für js die Groß-/Kleinschreibung beachtet wird, sehen diese beiden Namen anders aus.

So war meine Lösung alle js von onchange Eigenschaft zu bewegen js Skript zu trennen, wie es weiter unten (zu Testzwecken für Sie es direkt in Ihrer yii View-Datei hinzufügen können, wo Sie Code in Ihrer Frage zur Verfügung gestellt verwenden)

<script> 
    function holderTypeChangeHandler(ev) { 
     var value = (this.value); 
     if(value == 'S'){ 
      $('#libraryborrowtransaction-name').autocomplete({source: ' . $s_data . '}); 
     } 
     if(value == 'E'){ 
      $('#libraryborrowtransaction-name').autocomplete({source: ' . $e_data . '}); 
     } 
    } 
    window.onload = function(){ 
     $('#libraryborrowtransaction-lbt_holder_type').on('change', holderTypeChangeHandler); 

    }; 
</script> 

Und Paste Name dieses neuen Event-Handler onchange Unterkunft Ihre Dropdownlist wie folgt aus:

['onChange' => 'holderTypeChangeHandler'] 

UPDATE: -------------------- -

Seit Yii2 Autocomplete basierend auf JQuery UI Autocomplete-Widget und Yii2 Autocomplete clientOptions enthält settings for JUI autocomplete widget, dann können wir auf JUI API Docs für die Erklärung der source option beziehen. Wie Sie sehen können, kann diese Option eine Zeichenfolge (in diesem Fall wird sie als URI für JSON-Daten verwendet werden), eine Funktion oder ein js-Array von Daten oder ein js-Array von Objekten sein.

In Ihrer Frage verwenden Sie \yii\db\Query, um einige Daten aus db mit Hilfe von method all() zu holen, die ein Array von Daten zurückgibt. Schließlich müssen Sie das Datenfeld, das Sie mit \yii\db\Query->all erhalten, in ein js Array von Objekten konvertieren. Um es zu machen, verwenden Sie PHP json functions, besonders für Ihren Fall, dass Sie json_encode() Funktion verwenden:

// Let's say this is a result of your query to db with use of `\yii\db\Query->...->all();` 
$some_array = [                                                                                                                 
    [                                      
     "value" => "Val 1",                                 
     "label" => "Label 1", 
     "id" => 1 
    ], 
    [ 
     "value" => "Val 2", 
     "label" => "Label 2", 
     "id" => 2 
    ] 
] 

// Just convert it to json string 
$s_data = json_encode($some_array); 
... 
// When concat this json string as a value of source attribute for Yii Autocomplete 
$('#libraryborrowtransaction-name').autocomplete({source: <?= $s_data ?> }); 

Das gleiche, wenn für Ihre $e_data. Achte nur darauf, dass du deine Daten von db mit PHP bekommst, aber benutze sie mit JS, also muss php array in ein string presentation js Array von Objekten konvertiert werden, und diese Konvertierung kannst du mit json_encode machen.

+0

was soll ich an meine Auto-Complete "Quelle" übergeben? Ich bekomme JSON Parse Fehler. –

+0

Wenn ich den Wert von S oder E ändere, wird ein höherer Fehler angezeigt. –

+0

Meine Konsole zeigt dies "Return JSON.parse (Daten +" ");" Seite nicht gefunden. Ich denke, dass die URL erstellt wurde, nachdem onChange-Ereignis nicht funktioniert. –