2017-09-15 14 views
1

내 Ajax 호출에서 결과가 표시되지만 채워진 select 요소는 재질 선택시 브라우저 선택 기본값에서만 렌더링됩니다. 나는 이미 안에 $.each, $.append 안에 모두 기능을 렌더링하고 다양한 기능을 시도했지만 결과는 없었지만 성공했다.재료 디자인에서 선택하지 않음 - 예기치 않은 토큰`< '

템플릿 측면.

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

아약스 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

어디에서 선택 하시겠습니까? $ unit입니까? – epascarello

+0

'$ .each'가 끝나면'$ unit.material_select();'를 실행하십시오. 그렇게해야합니다. – trincot

+0

@epascarello yesss – Gabriel

답변

0

콘솔이 오류 보여 :

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();을 실행하십시오. 요소를 원하는대로 렌더링해야합니다.