In javascript this works easily, wordpress requires jquery ajax, and I'm not the most familiar with jquery. Is the following example possible with ajax jquery?
How to send multiple variables so that the "var notei++" increase by one number, send as:
note1 = "My note 1",
note2 = "My note 2",
note3 = "My note 3",
note4 = "My note 4",
and more.....
var i = "";
var note = "";
var divsname = document.getElementsByClassName("notes");
for (i = 1, i++) {
divsname.forEach(function(div) {
note += note i++ = div.innerHTML;
});
jQuery(document).ready(function($) {
var data = {
'action': 'my_actione',
'user_id': '1',
note
};
// since 2.8 ajaxurl is always defined in the admin header and points to admin-ajax.php
jQuery.post(ajaxurl, data, function(response) {
alert('Got this from the server: ' + response);
});
});
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="notes">My note 1</div>
<div class="notes">My note 2</div>
<div class="notes">My note 3</div>
<div class="notes">My note 4</div>
You can send your div data using JSON Array with index number and value is the text inside your div and then pass same to your ajax.
Demo Code :
var divsname = $(".notes");
notes = []
divsname.each(function(i) {
//push in json array
notes.push({
[`note${i + 1}`]: $(this).text()
})
});
var data = {
'action': 'my_actione',
'user_id': '1',
'note': notes //pass same
};
console.log(data)
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="notes">My note 1</div>
<div class="notes">My note 2</div>
<div class="notes">My note 3</div>
<div class="notes">My note 4</div>