Pass javascript variable data to MySQL database in this situation

Question

I have followed a codepen project to build an animated form. May I know how can I store the answer to my SQL database? The answers are stored in the questions array with the key answer but I am not sure how to extract them. Thanks!

var questions = [
  {question:"What's your first name?"},
  {question:"What's your last name?"},
  {question:"What's your email?", pattern: /^[^\s@]+@[^\s@]+\.[^\s@]+$/},
  {question:"Create your password", type: "password"}
]

var onComplete = function() {

    var h1 = document.createElement('h1')
    h1.appendChild(document.createTextNode('Thanks ' + questions[0].answer + ' for checking this pen out!'))
    setTimeout(function() {
      register.parentElement.appendChild(h1)
      setTimeout(function() { h1.style.opacity = 1 }, 50)
    }, 1000)

}

;(function(questions, onComplete) {

    var tTime = 100 // transition transform time from #register in ms
    var wTime = 200 // transition width time from #register in ms
    var eTime = 1000 // transition width time from inputLabel in ms

    if (questions.length == 0) return

    var position = 0

    putQuestion()

    forwardButton.addEventListener('click', validate)
    inputField.addEventListener('keyup', function(e) {
        transform(0, 0) // ie hack to redraw
        if (e.keyCode == 13) validate()
    })

    previousButton.addEventListener('click', function(e) {
        if (position === 0) return
        position -= 1
        hideCurrent(putQuestion)
    })

    function putQuestion() {
        inputLabel.innerHTML = questions[position].question
        inputField.type = questions[position].type || 'text'
        inputField.value = questions[position].answer || ''
        inputField.focus()

        progress.style.width = position * 100 / questions.length + '%'

        previousButton.className = position ? 'ion-android-arrow-back' : 'ion-person'

        showCurrent()

    }

}(questions, onComplete))

If you are storing your answers just as your questions. Try using forEach. functionality to Ajax them with Jquery. Exert from w3schools follows var txt = ""; var numbers = [45, 4, 9, 16, 25]; numbers.forEach(myFunction); function myFunction(value, index, array) { txt = txt + value + "<br>"; } Note that the function takes 3 arguments: The item value The item index The array itself — Undry
– Undry, Commented Sep 17, 2020 at 17:20
Like in the example above try sending ajax for to your server script for every record in an array — Undry
– Undry, Commented Sep 17, 2020 at 17:22
That comment seems like it could be an answer Undry. You should just post it and get the cred! — bart cubrich
– bart cubrich, Commented Sep 17, 2020 at 19:56
Thank you @Undry. I am trying to figure that out but I have just started learning javascript so not quite understand how to exercise your answer. If you don't mind, would it be possible to post the code for reference?Thanks a lot and sorry for any inconvenience. — sevenine
– sevenine, Commented Sep 18, 2020 at 6:25

Kopi Bryant · Accepted Answer · 2020-09-18 07:29:02Z

1

In order for it to work you need jquery support for your website

Try doing following:

Assume you are storing your variables in JS array like

var numbers = [45, 4, 9, 16, 25];

You can try using built-in JS funtion to cycle through the array like:

numbers.forEach(myFunction);

You define your function that you use in point 2, with ajax, smth like

myFunction(value){ 
// answers is used to indicate to your server side script type of operation to be performed to be use in isset(), as value is too general`

  var datastring = 'answers' + '&value=' + value;
  // in URL indicate path to your actual server side script that will put records in database

  ajax({
    type: "POST",
    url: "/app/server.php",   
    data: datastring,
    success: function (html) {
      console.log(html);
    }
  }); //End of Ajax
  
  return false;
}

edited Sep 18, 2020 at 7:29

Kopi Bryant

1,3641 gold badge17 silver badges30 bronze badges

answered Sep 18, 2020 at 7:13

Undry

4574 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Undry Over a year ago

Don't know why format is not that good, tried several times

Collectives™ on Stack Overflow

Pass javascript variable data to MySQL database in this situation

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related