2017-09-15 19 views
1

私のAjax呼び出しで結果が得られますが、埋め込まれたselect要素は選択されたブラウザのデフォルトでのみマテリアルスタイルでレンダリングされません。私はすでにに$.each$.appendの両方の内部と何も結果を出さないで、さまざまな形式のレンダリング機能を試しました。材料デザインでレンダリングしません - 予期しないトークン `<'

テンプレート側。

<div class="input-field col s12"> 
    <select id="getUnit" ></select> 
    <label>Units</label> 
    </div> 

Ajax Jquery Get。

$(function() { 
    //request the JSON data and parse into the select element 
    $.ajax({ 
    type: "GET", 
    url: '/product/unit-measurement-search', 
    success: function (unitMeasurement) { 
     //get a reference to the select element 
     $unit = $('#getUnit'); 
     //clear the current content of the select 
     $unit.html(''); 
     //iterate over the data and append a select option 
     $.each(unitMeasurement, function (info, unitSearch) { 
     $unit.append('<option id="' + unitSearch.descriptionUnitMeasurement + '">' + unitSearch.descriptionUnitMeasurement + '</option>'); 
     }); 
    } 
    }); 
}); 

バックエンドプロセス要求json。

router.get('/product/unit-measurement-search', function (req, res) { 
    connection.query('SELECT 
    acronymUnitMeasurement,descriptionUnitMeasurement FROM unit_measurement', 
    function (err, unitMeasurement, fields) { 
    if (err) { 
     throw err; 
    } 
    res.send(unitMeasurement); 
    } 
); 
}); 

フロントエンドテンプレートに戻ると、selectのラベルのみが表示されます。

編集:

これは私のコンソール出力です:

enter image description here

+0

選択はどこですか?それは$単位ですか? – epascarello

+0

'$ .each'の終了後、' $ unit.material_select(); 'を実行します。それはそれを行う必要があります。 – trincot

+0

@epascarello yesss – Gabriel

答えて

0

コンソールはこのエラーを示した:

Uncaught SyntaxError: Unexpected token <                       materialize.js:1

...と他のmodal.jsスクリプトの同じエラーあなたは読み込みます。

これは、スクリプトファイルが破損していることを示しています。間違って保存された可能性があります。たぶんあなたがそれをダウンロードしたときに、それをブラウザでWebページとして開き、そのページをHTMLエンコーディングで最終的な場所に保存しました。それでも何か他のことが起こった。今、あなたは、もはやコンソールでそのエラーを取得する必要があります

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/j‌​s/materialize.min.js"> 

:に

<script type="text/javascript" src="js/materialize.min.js"> 

からスクリプトタグを置き換え、それは適切なスクリプトファイルで動作することを確認しないように。その後、そのファイルを適切にダウンロードして(開かないで)、jsフォルダにコピーし、src属性を元の状態に戻すことができます。

コンソールエラーが解決したら、select要素を適切にレンダリングする必要があります。 $.eachループが終了したら、$unit.material_select();を実行します。これにより、要素は必要に応じてレンダリングされます。

関連する問題