Hello !
I am currently building a website in korea, and I try to add this plugg-in options to my checkout page:
By clicken this button, we arrive to an pop-up that will look for a complete adress just by entering the postal code. It’s really common in south korea but I can’t find which application offer this solutions.
By any chance, any members would have a thoughts on which app to use ?
I tried to search through the code source but could find any. The website I use as references is: THISISNEVERTHAT (kor version checkout page)
And I will add the soruce code just in case for oyur references. Please let me know if you have any thoughts?
(function($) {
$(document).on("page:load page:change", function() {
$("select#checkout_shipping_address_id").find('option:selected', this).removeAttr('selected');
$("select#checkout_shipping_address_id option:first").attr('selected','selected');
$("select#checkout_shipping_address_id").trigger('change');
var provience = $("#checkout_shipping_address_province").val();
$("#checkout_shipping_address_address1").prop('readonly', true);
$("#checkout_shipping_address_zip").prop('readonly', true);
$('#checkout_shipping_address_province option:not(:selected)').prop('disabled', true)
$('<button class="btn fill_address ">주소 검색</button>').insertAfter('#checkout_shipping_address_zip');
});
jQuery(document).on('click', '#continue_button', function() {
$('#checkout_shipping_address_province option:not(:selected)').prop('disabled', false);
$('#checkout_shipping_address_province option:selected').prop('disabled', false);
});
jQuery(document).on('click', 'div[data-address-field="zip"]', function(e) {
e.preventDefault();
jQuery('.addresspopup').css('display', 'block');
jQuery('body').addClass('popup_overlay');
jQuery('.addresspopup_back').css('display', 'block');
});
jQuery(document).on('keyup', '.customer_address', function() {
var searchAdd = jQuery(this).val();
jQuery('.addr_error').html('');
if(searchAdd) {
jQuery.ajax({
url: 'https://thisisneverthat-jknd.com/app/address/address_api.php',
type: 'POST',
data: {
action : 'search_korea_address',
shop : 'thisisneverthatstore.myshopify.com',
searchAdd : searchAdd
},
success: function(result){
var array = JSON.parse(result);
if(typeof array !== 'undefined' && array.length > 0) {
jQuery('.address_suggestion').html('');
jQuery('.address_suggestion').css('display', 'grid');
jQuery('.customer_address').addClass('open');
jQuery('.addr_error').removeClass('address_error');
jQuery('.addr_error').html('');
for(var i = 0; i < array.length; i++) {
var address = array[i].fulladdress;
var address1 = array[i].address1;
var city = array[i].city;
var province = array[i].province;
var province1 = array[i].province1;
var zip = array[i].zip;
var country = array[i].country;
var fulladdress = 'address1:'+address1+';city:'+city+';province:'+province1+';zip:'+zip+';country:'+country;
var cutStart = province1.length + city.length + 2;
var address1_new = address.substring(cutStart);
var fulladdress = 'address1:'+address1_new+';city:'+city+';province:'+province1+';zip:'+zip+';country:'+country;
jQuery('.address_suggestion').append('<li value="'+address+'">'+zip+' '+address+'<p class="fulladdress">'+fulladdress+'</p></li>');
}
} else {
jQuery('.addr_error').html('');
jQuery('.address_suggestion').css('display', 'none');
jQuery('.customer_address').removeClass('open');
jQuery('.addr_error').addClass('address_error');
jQuery('.address_error').append('<span>검색 결과가 없습니다. 정확한 주소인지 확인해 주세요.</span>');
}
}
});
} else {
jQuery('.address_suggestion').css('display', 'none');
jQuery('.customer_address').removeClass('open');
jQuery('.addr_error').removeClass('address_error');
}
});
jQuery(document).on('click', '.address_suggestion li', function() {
var address = $(this).attr('value');
//console.log("address",address);
var fulladdress = jQuery(this).find('.fulladdress').text();
jQuery('.address_suggestion').css('display', 'none');
jQuery('.customer_address').removeClass('open');
jQuery('.addresspopup').css('display', 'none');
jQuery('body').removeClass('popup_overlay');
jQuery('.addresspopup_back').css('display', 'none');
var split_address = fulladdress.split(';');
var expldAdd1 = split_address[0].split('address1:');
var expldCity = split_address[1].split('city:');
var expldPrvnc = split_address[2].split('province:');
var expldZip = split_address[3].split('zip:');
var expldCntry = split_address[4].split('country:');
//console.log("split_address",split_address);
if(expldPrvnc[1] == "세종특별자치시"){
var addressdata = address.split(' ');
let address1 ='';
let i;
for (i in addressdata){
address1 = i >=1 ? address1 +' '+addressdata[i] : '';
}
jQuery('#checkout_shipping_address_address1').val(address1);
} else if(expldPrvnc[1]=="경기도" || expldPrvnc[1]=="충청북도" || expldPrvnc[1]=="충청남도" ||expldPrvnc[1]=="전라북도" ||expldPrvnc[1]=="경상북도" || expldPrvnc[1]=="경상남도"){
var addressdata = address.split(' ');
console.log(addressdata)
let address1 ='';
let i;
for (i in addressdata){
address1 = i >=2 ? address1 +' '+addressdata[i] : '';
}
jQuery('#checkout_shipping_address_address1').val(address1);
}
else{
jQuery('#checkout_shipping_address_address1').val(expldAdd1[1]);
}
jQuery('.address2').val('');
if(expldCity[1]==""){
jQuery('.city').val('세종시');
}
else if(expldPrvnc[1]=="경기도" || expldPrvnc[1]=="충청북도" || expldPrvnc[1]=="충청남도" ||expldPrvnc[1]=="전라북도" ||expldPrvnc[1]=="경상북도" || expldPrvnc[1]=="경상남도"){
var citydata = expldCity[1].split(' ');
// console.log("citydata",citydata);
jQuery('.city').val(citydata[0]);
}else{
jQuery('.city').val(expldCity[1]);
}
jQuery('#checkout_shipping_address_province option:selected').removeAttr('selected');
// console.log(expldPrvnc[1]);
// console.log(jQuery('#checkout_shipping_address_province option').val());
jQuery('#checkout_shipping_address_province option:contains('+expldPrvnc[1]+')').attr('selected', 'selected');
// jQuery('#checkout_shipping_address_province option[data-alternate-values="'+expldPrvnc[1]+'"]').attr('selected', 'selected');
jQuery('#checkout_shipping_address_zip').val(expldZip[1]);
// if(expldCity[1]==""){
if(address.indexOf("세종특별자치시") != -1){
jQuery('#checkout_shipping_address_city').val('세종시');
}else if(expldPrvnc[1]=="경기도" || expldPrvnc[1]=="충청북도" || expldPrvnc[1]=="충청남도" ||expldPrvnc[1]=="전라북도" ||expldPrvnc[1]=="경상북도" || expldPrvnc[1]=="경상남도"){
var citydata = expldCity[1].split(' ');
// console.log("citydata",citydata);
jQuery('#checkout_shipping_address_city').val(citydata[0]);
}
else{
jQuery('#checkout_shipping_address_city').val(expldCity[1]);
}
jQuery('#checkout_shipping_address_country option:selected').removeAttr('selected');
jQuery('#checkout_shipping_address_country option[value="'+expldCntry[1]+'"]').attr('selected', 'selected');
//jQuery('#checkout_shipping_address_country').val(expldCntry[1]);
jQuery('.fullAddress').val(fulladdress);
});
jQuery(document).on('click', '.addresspopup_close,.addresspopup_back', function() {
jQuery('.address_suggestion').css('display', 'none');
jQuery('.addresspopup').css('display', 'none');
jQuery('body').removeClass('popup_overlay');
jQuery('.addresspopup_back').css('display', 'none');
jQuery('.customer_address').removeClass('open');
// jQuery('html, body').animate({
// scrollTop: jQuery(".countryCheck").offset().top
// }, 2000);
});
jQuery(document).on('click', '.Cart__Checkout-copy', function(e){
e.preventDefault();
var cust_lname = jQuery('.last_name').val();
var oldcust_lname = '';
var cust_fname = jQuery('.first_name').val();
var oldcust_fname = '';
var address1 = jQuery('.address1').val();
var fulladdress = jQuery('.fullAddress').val();
var address2 = jQuery('.address2').val();
var oldAddress2 = '';
var city = jQuery('.city').val();
var zip = jQuery('.zip').val();
var country = jQuery('.country').val();
var province = jQuery('.province option:selected').val();
var oldProvince = '';
var cust_phone = jQuery('.phone').val();
var oldcust_phone = '';
var phoneno = /^\(?([0-9]{3})\)?[- ]?([0-9]{4})[- ]?([0-9]{4})$/;
var keywords = [];
$( ".cart-data" ).each(function() {
var quantity = $(this).find('.js--num').val();
var variant_id = $(this).find(".cart_prdtit").attr('data-id');
var data = variant_id+':'+quantity;
keywords.push(data);
});
if(cust_lname != '' && cust_fname != '' && address1 != '' && cust_phone != '') {
if(province != 'Select') {
if((address1 != fulladdress) || (address2 != oldAddress2) || (cust_lname != oldcust_lname) || (cust_fname != oldcust_fname) || (cust_phone != oldcust_phone) || (province != oldProvince)) {
if(cust_phone.match(phoneno)) {
var customerId = '6321267114159';
var addressId = '';
jQuery.ajax({
url: 'https://thisisneverthat-jknd.com/app/address/address_api.php',
type: 'POST',
data: {
action : 'update_address',
shop : 'thisisneverthatstore.myshopify.com',
customerId : customerId,
customrLName : cust_lname,
customrFName : cust_fname,
addressId : addressId,
address1 : address1,
address2 : address2,
city : city,
province : province,
zip : zip,
country : country,
phone : cust_phone
},
success: function(result){
// console.log(result);
var data = JSON.parse(result);
if(data.status != '주소가 업데이트 되었습니다!') {
alert(data.status);
return false;
} else {
window.location.replace('https://thisisneverthat.com/cart/'+keywords+'?checkout[shipping_address][zip]='+zip+'&checkout[shipping_address][address1]='+address1+'&checkout[shipping_address][city]='+city+'&checkout[shipping_address][last_name]='+cust_lname+'&checkout[shipping_address][first_name]='+cust_fname+'');
// jQuery('.Cart__Checkout').removeAttr('disabled');
// jQuery('.Cart__Checkout').trigger('click');
}
}
});
} else {
alert('Please enter valid Phone number!');
}
} else {
window.location.replace('https://thisisneverthat.com/cart/'+keywords+'?checkout[shipping_address][zip]='+zip+'&checkout[shipping_address][address1]='+address1+'&checkout[shipping_address][city]='+city+'&checkout[shipping_address][last_name]='+cust_lname+'&checkout[shipping_address][first_name]='+cust_fname+'');
// jQuery('.Cart__Checkout').removeAttr('disabled');
// jQuery('.Cart__Checkout').trigger('click');
}
} else {
alert('Please select valid Province!');
}
} else {
alert('Please fill the required fields.');
}
});
})(Checkout.$);
$("#customer_address").on("propertychange change keyup paste input", function() {
$('.customer_address_wrap').addClass('on');
// 현재 변경된 데이터 셋팅
var newValue = $(this).val();
if ( newValue.trim() == '') {
$('.customer_address_wrap').removeClass('on');
} else {
$('.customer_address_wrap').addClass('on')
}
});
Merci
