在材质设计中选择未呈现 - 意外标记`<`

我在我的Ajax调用中获取了结果，但填充的select元素未以材质样式呈现，仅在选择浏览器默认情况下呈现。我已经尝试过在$.each,$.append以及功能成功但没有结果的$('select').material_select();中呈现我的功能的各种形式。在材质设计中选择未呈现 - 意外标记`<`

模板面。

<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的标签。

编辑：

这是我的控制台输出：

来源

2017-09-15 Gabriel

你在哪里选择选择？是$单位吗？ – epascarello

'$ .each'完成后，执行'$ unit.material_select（）;'。这应该做到这一点。 – trincot

@epascarello yesss – Gabriel

控制台显示此错误：

Uncaught SyntaxError: Unexpected token < materialize.js:1

...和其他modal.js脚本同样的错误你加载。

这表明脚本文件已损坏。可能是它被错误地保存了。也许当你下载它，你在浏览器中打开它作为网页，并将该页面以HTML编码保存到最终位置。或者还有其他事情发生。

要验证它与一个合适的脚本文件，从替换脚本标签：

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

到：

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

现在，你不应该再得到这个错误在控制台中。然后，您可以继续正确下载该文件（不要打开它），将其复制到js文件夹，然后将src属性恢复到原来的状态。

一旦控制台错误得到解决，您仍然需要使select元素正确呈现。 $.each循环完成后，执行$unit.material_select();。这应该使该元素按需要呈现。

来源

2017-09-16 06:31:54 trincot

在材质设计中选择未呈现 - 意外标记`<`

回答

相关问题