This code, if click on text inside div class="example4DOMWindow" sends defined values to php and then get back php data and in popup window displays data received from php.
Here is example http://jsfiddle.net/rigaconnect/q3RcV/1/
This is ajax that sends and receives data
$(document).ready(function()
{
var one = $("#first_var").text();
var two = $("#second_var").text();
$.ajax({
type: "POST",
url: '__popup-window_ajax.php',
data: {var1: one, var2: two },
dataType: "json",
success: function(data) {
$('#load').html(data);
}
});
});
This part of code displays popup window (sample here http://swip.codylindley.com/DOMWindowDemo.html)
<body>
<div id="first_var" class="example4DOMWindow" style="width: 50px;">text one</div>
<div id="second_var" class="example4DOMWindow" style="width: 50px;">text two</div>
<script type="text/javascript">
$('.example4DOMWindow').openDOMWindow({
eventType:'click',
windowSourceID:'#example4InlineContent',
});
</script>
<div id="example4InlineContent" style="display:none">
<div>
<div id="load"></div>
</div>
</div>
</body>
And this is php file code
$p_one = $_POST['var1'];
$p_two = $_POST['var2'];
$test = $p_one. '<br>test<br>'. $p_two;
echo json_encode($test);
The code sends to php only var that is defined. Like var one = $("#first_var").text(); So if no var inside ajax code, nothing send. And sends all vars.
Necessary the code to send to php only clicked text. User clicks on text one, sends text one and do not send text two; clicks on text two, sends only text two.
Here http://stackoverflow.com/a/17622947/2360831 / http://jsfiddle.net/aGWGn/5/
clicked text is passed as value to javascript.
Tried to put all together like this
$(document).ready(function(){
document.body.onmousedown = whichElement;
var output = document.getElementById("load")
function whichElement(e) {
e = e || window.event;
var targ = e.target || e.srcElement;
if (targ.nodeType===3) {// defeat Safari bug
targ = targ.parentNode;
}
output.innerHTML = targ.innerHTML;
}
//var one = $("#first_var").text();
var one = targ;
var two = $("#second_var").text();
$.ajax({
type: "POST",
url: '__popup-window_ajax.php',
data: {var1: one, var2: two },
dataType: "json",
success: function(data) {
$('#load').html(data);
}
});
});
But the code does not pass var one = targ; to php file (var two also does not pass).
From my understanding the main question is how to pass var targ or var output(?) to var one....
Please, advice what is incorrect
Update
Changed data to data: {var1: output, var2: two },
and in popup window see
[object HTMLDivElement]
test
text two
text two
Changed to var one = targ.innerHTML; but does not work....
Changes to get to work
Changed var output = document.getElementById("load") to var output = document.getElementById("load1")
In html added <div id="load1"></div>
And changed
//var one = $("#first_var").text();
var one = targ;
var two = $("#second_var").text();
to var one = $("#load1").text();
Now seems work. But think the code need improvements
