Hello.
Okay im a bit of a noob with Ajax, and havnt used it much and having a little problem with something.
Its a div which is hidden (until click a link which unhides it), the div contains a form which is submitted via AJAX, and should then return a response and display it within my SPAN however it seems to flash the response quickly and then resets and hides the div 
Which isnt helpful when the response is that PHP validation failed...
Also just realised this only seems work and submit properly in IE 7 only
Code:
<script type="text/javascript">
<!--
var state = 'none';
function showhide(layer_ref) {
if (state == 'block') {
state = 'none';
}
else {
state = 'block';
}
if (document.all) { //IS IE 4 or 5 (or 6 beta)
eval( "document.all." + layer_ref + ".style.display = state");
}
if (document.layers) { //IS NETSCAPE 4 or below
document.layers[layer_ref].display = state;
}
if (document.getElementById &&!document.all) {
hza = document.getElementById(layer_ref);
hza.style.display = state;
}
}
//-->
</script>
<script language="javascript" type="text/javascript">
<!--
//Browser Support Code
function ajaxFunction(){
var ajaxRequest; // The variable that makes Ajax possible!
try{
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
} catch (e){
// Internet Explorer Browsers
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){
// Something went wrong
alert("Your browser broke!");
return false;
}
}
}
// Create a function that will receive data sent from the server
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
document.getElementById("server_response").innerHTML = ajaxRequest.responseText;
}
}
var title = document.getElementById('title').value;
var presenter = document.getElementById('presenter').value;
var info = document.getElementById('info').value;
var ref = document.getElementById('ref').value;
var time_start_hr = document.getElementById('time_start_hr').value;
var time_start_min = document.getElementById('time_start_min').value;
var time_end_hr = document.getElementById('time_end_hr').value;
var time_end_min = document.getElementById('time_end_min').value;
var contact = document.getElementById('contact').value;
var hidetime = document.getElementById('hidetime').value;
var queryString = "?title=" + title +
"&presenter=" + presenter +
"&info=" + info +
"&ref=" + ref +
"&time_start_hr=" + time_start_hr +
"&time_start_min=" + time_start_min +
"&time_end_hr=" + time_end_hr +
"&time_end_min=" + time_end_min +
"&contact=" + contact +
"&hidetime=" + hidetime +
"&submit";
ajaxRequest.open("GET", "/admin/addshow.php" + queryString, true);
ajaxRequest.send(null);
}
//-->
</script>
Code:
<div id="addshow" style="display:none; border:1px solid #000; background: #CCCCCC; width: 450px; height: 400px">
<span id="server_response"></span>
<form name="addshowForm">
<label for="title">Show Title:</label><input type="text" name="title" id="title" size="30" /><br />
<label for="presenter">Presenter:</label><input type="text" name="presenter" id="presenter" size="30" /><br />
<label for="info">Show Info:</label>
<textarea name="info" id="info" cols="20" rows="3">
</textarea>
<br />
<label for="ref">Show REF:</label><input type="text" name="ref" id="ref" size="8" />
<br />
<label for="start_time">(normal) Start Time:</label>
<input type="text" name="time_start_hr" id="time_start_hr" size="2" />
<input type="text" name="time_start_min" id="time_start_min" size="2" /><br />
<label for="start_time">(normal) End Time:</label>
<input type="text" name="time_end_hr" id="time_end_hr" size="2" />
<input type="text" name="time_end_min" id="time_end_min" size="2" /><br />
<label for="contact">Contact:</label>
<input type="checkbox" name="contact" id="contact" />
<br />
<label for="hidetime">Hide:</label>
<input type="checkbox" name="hidetime" id="hidetime" />
<br />
<input type="submit" onClick="ajaxFunction()" value="Add Show" name="submit" />
<input type="reset" name="clear" value="Clear" />
<input type="reset" onClick="showhide('addshow')" value="Cancel" name="cancel" />
</form>
</div>
Of course anyone who can help will get mucho TP 
Thanks,
Dan
__________________
Discounted Web Hosting With XDnet! >> Get 25% of hosting~ Promo: Webmaster-talk <<
|
