You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
80 lines
3.5 KiB
80 lines
3.5 KiB
|
|
window.onload=init();
|
|
|
|
function init() {
|
|
var defaultText=`
|
|
<h3 style="margin-top:24px;">Ask <span style="color: #696035">{</span>dev<span style="color: #696035">}</span>Osan</h3>
|
|
<!--<input type="text" style="width:85%" name="question" value="What would you like to know?"><input type="submit">-->
|
|
<form name="q" "action="#formanchor" onsubmit="submitQuestion(); return false;">
|
|
<div class="input-group input-group-lg">
|
|
<div class="input-group-prepend">
|
|
<span class="input-group-text" id="inputGroup-sizing-lg">Q</span>
|
|
</div>
|
|
<input type="text" class="form-control" placeholder="What would you like to know?" aria-label="Question" aria-describedby="inputGroup-sizing-lg" name="question" required>
|
|
</div>
|
|
<br>
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-5">
|
|
<div class="input-group input-group-sm">
|
|
<input type="text" id="name" class="form-control" placeholder="Name (Optional)" aria-describedby="namehelp">
|
|
</div>
|
|
<small id="namehelp" class="form-text text-muted">
|
|
Your name will be displayed next to the question.
|
|
</small>
|
|
</div>
|
|
<div class="col-7">
|
|
<div class="input-group input-group-sm">
|
|
<input type="text" id="email" class="form-control" placeholder="Email (Optional)" aria-describedby="namehelp">
|
|
</div>
|
|
<small id="namehelp" class="form-text text-muted">
|
|
Providing an email will send you a notification when your question has been answered.
|
|
</small>
|
|
</div>
|
|
<button class="btn btn-primary col-3 m-2" type="submit">Submit</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
<hr>
|
|
<div class="sig-ask-devosan-popular">Fetching data...</div>
|
|
`;
|
|
document.getElementsByClassName("sig-ask-devosan")[0].innerHTML=`
|
|
<div class="sig-ask-devosan1"></div>
|
|
<div class="sig-ask-devosan2"></div>
|
|
`;
|
|
document.getElementsByClassName("sig-ask-devosan1")[0].style.display="block";
|
|
document.getElementsByClassName("sig-ask-devosan1")[0].innerHTML=defaultText;
|
|
document.getElementsByClassName("sig-ask-devosan2")[0].style.display="none";
|
|
var req = new XMLHttpRequest();
|
|
req.onreadystatechange = function() {
|
|
if (this.readyState==4 && this.status==200) {
|
|
document.getElementsByClassName("sig-ask-devosan-popular")[0].innerHTML=this.responseText;
|
|
}
|
|
}
|
|
req.open("POST","http://45.33.13.215/projects/dev-osan/dev-osan.github.io/sig-ask-devosan/popularquestions.php",true)
|
|
req.send();
|
|
document.getElementsByClassName("sig-ask-devosan-popular")[0].innerHTML=`
|
|
Fetch data...
|
|
`;
|
|
}
|
|
|
|
function submitQuestion() {
|
|
document.getElementsByClassName("sig-ask-devosan1")[0].style.display="none";
|
|
document.getElementsByClassName("sig-ask-devosan2")[0].style.display="block";
|
|
document.getElementsByClassName("sig-ask-devosan2")[0].innerHTML=`<hr>
|
|
<button class="btn btn-primary m-2" type="button" disabled>
|
|
<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
|
Submitting Question...
|
|
</button>
|
|
`;
|
|
var req = new XMLHttpRequest();
|
|
req.onreadystatechange = function() {
|
|
if (this.readyState==4 && this.status==200) {
|
|
document.getElementsByClassName("sig-ask-devosan2")[0].innerHTML=this.responseText;
|
|
}
|
|
}
|
|
req.open("POST","http://45.33.13.215/projects/dev-osan/dev-osan.github.io/sig-ask-devosan/index.php",true)
|
|
req.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
|
|
req.send(`question=${document.forms["q"]["question"].value}&name=${document.forms["q"]["name"].value}&email=${document.forms["q"]["email"].value}`);
|
|
}
|
|
|
|
|