반복문에서 alert창 한번만 호출 후 window창 새로고침
본문
안녕하세요. 제가 지금 반복문을 사용하여 값을 받는데 에러가 발생했을 때 alert창이 나와 경고 후 화면새로고침을 하여 값을 새로 입력받으려고 합니다.
그런데 alert창 아래 새로고침을 넣어도 모든 반복문이 끝난 후 화면에 값이 나오고 있습니다...
혹시 한번만 호출하여 새로고침할 수 있는 방법이 있을까요?
let keyword = ['tideObsPreTab', 'tideObsTemp', 'tideObsSalt', 'tideObsAirTemp', 'tideObsAirPres', 'tideObsWind']
Promise.all(keyword.map(async (key)=>{
console.log(key)
// console.log("word_seq",word_seq)
if(key == "tideObsPreTab"){
observatory = tide_area_code
}else{
observatory = sea_obs_code
}
$.ajax({
method: 'GET', // HTTP 요청 방식(GET, POST)
async: false,
url: "http://www.khoa.go.kr/api/oceangrid/"+key+"/search.do?ServiceKey="+ocean_data_service_key+"&ObsCode="+observatory+"&Date="+end_date+"&ResultType=json", // 서버의 URL 주소
dataType: 'json' // 서버에서 보내줄 데이터의 타입
}).done(function (data) { // HTTP 요청이 성공하면 요청한 데이터가 done() 메소드로 전달됨.
console.log("data error message", data.result.error)
let resultErr = data.result.error
if(resultErr == "invalid ServiceKey"){
alert('바다누리 api : '+resultErr)
location.reload()
}else{
if(key == "tideObsPreTab"){ // 고조, 저조
$('#tide_low').html("")
$('#tide_high').html("")
$.each(data.result.data, function (i, item) { //each(매개변수, 함수)
console.log("저조, 고조",data.result.data)
if(item.hl_code =="저조"){
$('#tide_low').append(`<input name="tide_low_value[]" type="text" value="${item.tph_level}" style="text-align:center; border:none; width:100%;" readonly>`)
}else if(item.hl_code =="고조"){
$('#tide_high').append(`<input name="tide_high_value[]" type="text" value="${item.tph_level}" style="text-align:center; border:none; width:100%;" readonly>`)
}
})
}else if(key == "tideObsTemp"){ // 수온
$.each(data.result.data, function (i, item) { //each(매개변수, 함수)
if(item.record_time==record_time){
$('#water_temperature').val(item.water_temp)
}
})
}else if(key == "tideObsSalt"){ // 염분
$.each(data.result.data, function (i, item) { //each(매개변수, 함수)
if(item.record_time==record_time){
$('#salinity').val(item.salinity)
}
})
}else if(key == "tideObsAirTemp"){ // 염분
$.each(data.result.data, function (i, item) { //each(매개변수, 함수)
if(item.record_time==record_time){
$('#temperature').val(item.air_temp)
}
})
}else if(key == "tideObsAirPres"){ // 기압
$.each(data.result.data, function (i, item) { //each(매개변수, 함수)
if(item.record_time==record_time){
$('#pressure').val(item.air_pres)
}
})
}else if(key == "tideObsWind"){ // 풍향, 풍속
$.each(data.result.data, function (i, item) { //each(매개변수, 함수)
if(item.record_time==record_time){
$('#wind_direction').val(item.wind_dir)
$('#wind_speed').val(item.wind_speed)
}
})
}
} // resultErr가 없을 때 else문 end
}) // done함수
}))
break를 쓰고 싶어도 계속 에러가 나와 사용하지 못하고 있습니다... if에서 에러가 발생시 반복문을 나가고 싶습니다 ...
반복문을 사용하는 이유는 ajax에서 받는 url이 key 값에 따라 바뀌기 때문입니다...
개인적으로는 break loop로 해서 나가서 하고 싶은데 계속 에러가 발생해서 할 수가 없습니다 ㅠ
답변 2
location.reload()
아래에
return false;
를 넣어보셨나요?
아니면 별도의 변수값을 선언하셔서 예) type = 0; 에러발생시 해당 변수 값을 type = 1로 바꾸셔서 해당 값이 0일때만 돌아가게끔 해주면 되지않을까요?
return false로는 안되고 말씀하신대로 type으로 에러발생시 1을 줘서 그 문장을 실행하지 않도록 했더니 해결되었습니다.. 정말 감사합니다~
재귀함수 형식을 사용하면 될 것 같습니다. 테스트로 작성한 코드이니 참고만 해주세요 :)
$(function() {
let keyword = ['tideObsPreTab', 'tideObsTemp', 'tideObsSalt', 'tideObsAirTemp', 'tideObsAirPres', 'tideObsWind']
$("#click").on("click", function(){
getApi(0);
})
function getApi(index) {
$.ajax({
method: 'GET', // HTTP 요청 방식(GET, POST)
async: false,
url: "http://www.khoa.go.kr/api/oceangrid/"+key+"/search.do?ServiceKey="+ocean_data_service_key+"&ObsCode="+observatory+"&Date="+end_date+"&ResultType=json", // 서버의 URL 주소
dataType: 'json'
}).done(function (data) { // HTTP 요청이 성공하면 요청한 데이터가 done() 메소드로 전달됨.
console.log("data error message", data.result.error)
let resultErr = data.result.error
if(resultErr == "invalid ServiceKey"){
alert("1")
location.reload()
} else {
alert("2")
if (keyword.length > index) {
getApi(index + 1)
}
}
}) // done함수
}
})
재귀함수는 생각도 못했는데 감사합니다! 말씀하신대로 해보도록 하겠습니다!
답변을 작성하시기 전에 로그인 해주세요.
