The idea is to pick one of three choices and have the data for that choice displayed.
This code works fine on the first pick. On subsequent picks in the same session the data is being captured by the php & mysql scripts (verified by firebug) but will not be displayed.
I've tried various things like .hide(), .show() and .toggle() with no results.
Any help to solve this is greatly appreciated.
RP
Code: Select all
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style>
#patient {
font-size: 1.5em;
font-weight: bold;
}
#patientname {
color: red;
}
</style>
<script type="text/javascript" src="/jquery/jquery-1.5.1.js"></script>
<script type="text/javascript" >
$(document).ready(function(){
});
function trip() {
alert("in trip");
// $("#content").hide();
//$('#content').remove();
var patient =$('input[name=pick]:checked').val()
$("#content").append('<p id="patient" > Patient '+ "<span id='patientname'>" + patient + '</span></p>');
$("#content").show();
var url="JSON-test.php";
$.getJSON(url, {'patient': patient}, function(myResponse){
// loop through the posts here
$.each(myResponse.drugs,function(i,cb){
$("#content").append (
'<div class="post">'+
'<p>Drug Id:'+cb.Id+'</p>'+
'<p>Doctor Id: '+cb.DoctorId+'</p>'+
'<p>Pharmacy Id: <em>'+cb.PharmacyId+'</em></p>'+
'<p>Drug: <strong>'+cb.Name+'</strong></p>'+
'<p>Prescription No: <em>'+cb.RX+'</em></p>'+
'<p>Order Date: <em>'+cb.Orderdate+'</em></p><br><br>'+
' </div>'
);
}); // end each
}); // end myResponse
} // end trip
//}); // end doc ready
</script>
</head>
<body>
<div id="pickname">
<form action="" name="form0" id="form0">
<p>Rick: <input type="radio" name="pick" value="Rick" onclick="trip()"></input></p>
<p>Polly: <input type="radio" name="pick" value="Polly" onclick="trip()"></input></p>
<p>Rick & Polly: <input type="radio" name="pick" value="Rick & Polly" onclick="trip()"></input></p>
</form>
</div>
<div id="content">
</div>
</body>
</html>