-
-
Save zazk/ee4964ca03c2b9144499fb02b00bffc6 to your computer and use it in GitHub Desktop.
in process
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$ = jQuery.noConflict(); | |
function menuRespuesta(id){ | |
var htmlTextArea = `<div class="c-wrap-menu b1"> | |
<span class="c-open-menu"> | |
<span class="fa fa-caret-down"></span> | |
</span> | |
<div class="c-menu-desplegable"> | |
<h3 class="c-menu-title">Tipo de respuesta</h3> | |
<ul class="c-menu-list"> | |
<li> | |
<a data-id="'+id+'" data-type="textarea" class="c-select-tipo active">Área de texto</a> | |
</li> | |
<li> | |
<a data-id="'+id+'" data-type="checkbox" onclick="openModal(this)" class="c-select-tipo c-open-modal">Checkbox</a> | |
</li> | |
<li> | |
<a data-id="'+id+'" data-type="option" onclick="openModal(this)" class="c-select-tipo c-open-modal">Seleccionar opción</a> | |
</li> | |
</ul> | |
</div> | |
</div>`; | |
return htmlTextArea; | |
} | |
function modalBox(id,textButton,typeResponse){ | |
var htmlModalBox = '<div class="modalWrap modal-cuestionario">'+ | |
'<div class="modalOverlay"></div>'+ | |
'<div class="wrapBoxInner">'+ | |
'<div class="boxContent">'+ | |
'<h3 class="c-title-filling">Tipo de Respuesta:<span>'+textButton+'</span></h3>'+ | |
'<div class="c-wrap-filling" data-id="'+id+'">'+ | |
'<div class="c-inputs-fill">'+ | |
'<div class="c-input-fill-item">'+ | |
'<input type="text" placeholder="Escriba una opcion">'+ | |
'</div>'+ | |
'</div>'+ | |
'<div class="c-input-buttons right">'+ | |
'<button onclick="addMoreInput()" class="c-btn">Agregar +</button>'+ | |
'</div>'+ | |
'</div>'+ | |
'</div>'+ | |
'<div class="boxControls">'+ | |
'<button data-id="'+id+'" data-type="'+typeResponse+'" onclick="saveModal(this)" class="saved-modal c-btn">'+ | |
'Guardar'+ | |
'</button>'+ | |
'<button data-id="'+id+'" onclick="cancelModal()" class="cancel-modal c-btn">'+ | |
'Cancelar'+ | |
'</button>'+ | |
'</div>'+ | |
'</div>'+ | |
'</div>'; | |
return htmlModalBox; | |
} | |
function addMoreInput(){ | |
var currentInput = document.querySelectorAll(".c-input-fill-item"); | |
var lastInput = currentInput.length - 1; | |
var htmlInput ='<div class="c-input-fill-item">'+ | |
'<input type="text" placeholder="Escriba una opcion">'+ | |
'</div>'; | |
currentInput[lastInput].insertAdjacentHTML('afterend', htmlInput); | |
console.log("lastInput",lastInput) | |
} | |
function openModal(event){ | |
var dataId = event; | |
var id = dataId.getAttribute("data-id"); | |
var textButton = dataId.textContent; | |
var typeResponse = dataId.getAttribute("data-type") | |
var ubicationModal = document.querySelector("#wpwrap"); | |
console.log("body",textButton) | |
ubicationModal.insertAdjacentHTML('afterend', modalBox(id,textButton,typeResponse)); | |
console.log("idxxdataid",dataId) | |
console.log("idxx",id) | |
} | |
function cancelModal(){ | |
var elementModal = document.querySelector(".modalWrap"); | |
elementModal.remove(); | |
} | |
function saveModal(event){ | |
var btnSave = event; | |
var btnSaveId = btnSave.getAttribute("data-id"); | |
var typeValueResponse = btnSave.getAttribute("data-type"); | |
console.log("btnSave",btnSaveId); | |
var inputsElements = document.querySelectorAll(".c-input-fill-item input"); | |
console.log("inputsElements",inputsElements) | |
var inputValuesData ={ | |
options:[], | |
parameters:typeValueResponse | |
}; | |
if (inputsElements[0].value.trim() === "") { | |
alert("Debe llenar al menos una opción"); | |
}else{ | |
for(var e = 0; e < inputsElements.length; e++ ){ | |
var inputValue = inputsElements[e]; | |
if (inputValue.value.trim() === "") { | |
}else{ | |
console.log("ddddd",inputValue.value); | |
var infod ={}; | |
infod['value'] = inputValue.value; | |
console.log("infod",infod) | |
inputValuesData.options.push(infod); | |
} | |
} | |
var dataForSaved = document.querySelector('textarea[id="'+btnSaveId+'"]'); | |
dataForSaved.value = JSON.stringify(inputValuesData); | |
cancelModal(); | |
console.log("inputValuesData",inputValuesData) | |
} | |
} | |
// bloque 1: recorriendo los inputs para agregar menu tipo de respuesta | |
var itemsQuestions = document.querySelectorAll(".tipo_respuesta textarea"); | |
for(var i = 0; i < itemsQuestions.length; i++ ){ | |
var element = itemsQuestions[i]; | |
var hasValue = element.value | |
var parentTextarea = element.closest(".acf-input"); | |
var idElement = element.getAttribute("id"); | |
if (hasValue.length > 0) { | |
parentTextarea.insertAdjacentHTML('afterend', menuRespuesta(idElement)); | |
} | |
} | |
$(document).ready(function() { | |
}); | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment