This is the example of "ask a question" HTML code we used here,
- Code:
[panda=html]<script>
html_tpl = "<b>Title:</b> $0 <br><br><b> Name of the Question:</b> $1 <br><br><b>Forum Address:</b> $2<br><br><b>Forum Version:</b> $3 <br><br>";
bbcode_tpl = "[b]Details:[/b]\n$1\n\n[b]Your Forum Address:[/b]\n$2 \n\n[b]Forum Version:[/b]\n$3 ";
$(document).ready(function(){
$('#bt-apagar').click(function() {
$('#form-submit input[type="text"],#form-submit textarea').val('');
$('input[name="f"]').val($(this).val());
});
$('#bt-pr-questao').click(function() {
tpl = html_tpl;
tpl = tpl.replace("$0", $('#titulo').val());
tpl = tpl.replace("$1", $('#text_editor_textarea').val());
tpl = tpl.replace("$2", $('#endereco').val());
tpl = tpl.replace("$3", $('#versao').val());
$('html, body').animate({
scrollTop: $("#pr-questao").offset().top
}, 800);
$('#pr-questao').slideDown(300);
$('#html-questao').html(tpl);
});
$('#bt-enviar').click(function() {
tpl = bbcode_tpl;
if($('#titulo').val()!=='' && $('#text_editor_textarea').val()!=='' && $('#endereco').val()!=='' && $('#versao').val()!==''){
jQuery(this).closest('.submit-buttons').fadeOut();
jQuery(this).closest('.submit-buttons').next('#js').fadeIn();
tpl = tpl.replace("$0", $('#titulo').val());
tpl = tpl.replace("$1", $('#text_editor_textarea').val());
tpl = tpl.replace("$2", $('#endereco').val());
tpl = tpl.replace("$3", $('#versao').val());
$('input[name="message"]').val(tpl);
$('input[name="subject"]').val($('#titulo').val());
jQuery('#bt-enviar-e').click();
jQuery('#form-submit').slideUp(300);
jQuery('#enviado').slideDown(800);
}else{
$('#erro').slideUp(1);
$('#erro').slideDown(800);
}
});
jQuery('#bts .inner #js #js-but span .js-radio').click(function() {
jQuery('#bts .inner #js #js-but').find('input[class="js-radio"]').removeAttr('checked');
jQuery(this).attr('checked','checked');
jQuery('#bts .inner #js').fadeOut();
jQuery('#bts .inner .submit-buttons, .panel#form-part2').fadeIn();
if(jQuery(this).attr('name')=="yes-js") {
jQuery('#frame_perf').contents().each(function() {
if(jQuery(this).find('form[action="/profile"] .main-content .frm-set dl:contains("Pedidos disponíveis") dd input').val()=="0") {
jQuery('#bts .inner .submit-buttons').html('<span style="color: red; font-weight: bold; padding: 5px 0;font-size: 13px;">Erro: Limite de pedidos relacionados á JS atingido!</span>');
jQuery('#bts .inner #js, #frame_perf').remove();
} else {
var input=Number(jQuery(this).find('form[action="/profile"] .main-content .frm-set dl:contains("Pedidos disponíveis") dd input').val());
var valpd=Number(1);
var somah=Number(input) - Number(valpd);
jQuery(this).find('form[action="/profile"] .main-content .frm-set dl:contains("Pedidos disponíveis") dd input').val(somah);
jQuery(this).find('form[action="/profile"]').find('input[class="button2"][type="submit"][name="submit"][value="Salvar"]').click();
}
});
}
});
$('#bt-pr-fechar').click(function() {
$('html, body').animate({
scrollTop: $("#pr-questao").offset().top
}, 800);
$('#pr-questao').slideUp(300);
return false;
});
$('#titulo').click(function() {
if($('#titulo').val()=='Coloque aqui um título descritivo sobre a sua questão'){
$('#titulo').val('');
}
});
jQuery('#titulo').keyup(function(){
var t=document.getElementById('titulo').value.length;
var i=document.getElementById('identifytitle');
if(t<10&&t>0){
var l=t-10;i.innerHTML='You need '+l*-1+' characters'
}
else{
i.innerHTML=''
}
});
if(VarGET('f')!==''){
$('#form-part2, #bts').slideDown(800);
$('input[name="f"]').val(VarGET('f'));
$('#bt-selecciona-forum').val(VarGET('f'));
}
});
</script>
<form action="/post" method="post" id="form-submit">
<div id="erro" style="display:none;" class="panel">
<div class="inner">
<span class="corners-top"><span></span></span>
<center>
<span class="conteudo_texto" style="color:#C00"><strong>Você deve preencher todos os campos</strong></span>
</center><span class="corners-bottom"><span></span></span>
</div>
</div><br /><br />
<div class="panel">
<div class="inner">
<div class="main-content frm-set">
<strong>Note:</strong> Before ask a question, use Search option maybe that question is already answered.
</div>
</div><span class="corners-bottom"></span>
</div>
<div class="panel" id="form-part2" style="">
<div class="inner">
<span class="corners-top"><span></span></span><br /><fieldset class="fields1"><dl><dt></dt><label></label>Topic title:<dd><input id="titulo" placeholder="Name of the Question" class="inputbox" style="clear: both; width: 510px;" type="text" /></dd></dl></fieldset>
<div id="identifytitle" style="display: inline;">
</div><fieldset class="fields1"><dl></dl><dd></dd><br /><dl><dt></dt><label></label>Your Forum Address:<dd><input id="endereco" placeholder="Your Forum Address" class="inputbox" style="clear: both; width: 510px;" type="text" /></dd></dl></fieldset>
<div id="ender" style="display: inline;">
</div><fieldset class="fields1"><dl><dd></dd></dl><br /><dl><dt><label>Forum Version:</label></dt><dd><select class="inputbox" id="versao"><option value="PunBB">PunBB</option><option value="Phpbb3">Phpbb3</option><option value="Phpbb2">Phpbb2</option><option value="Invision">Invision</option></select></dd></dl><dl><dt><br /><label>Question:<span style="color: red;"><strong> To post IMAGES just post link without [img][/img] tags.</strong></span></label></dt><strong><dd><textarea id="text_editor_textarea" name="questao" class="inputbox" tabindex="14" style="clear: both; height: 280px; width:880px;"></textarea><input name="subject" type="hidden" /><input name="message" type="hidden" /><input name="mode" value="newtopic" type="hidden" /><input name="f" value="7" type="hidden" /><input name="lt" value="0" type="hidden" /><span class="corners-bottom"><span></span></span></dd></strong></dl></fieldset>
</div>
</div>
<div id="sthd" style="margin:0px">
</div><strong><br /></strong>
<div id="bts" style="" class="panel">
<div class="inner">
<span class="corners-top"><span></span></span><fieldset class="submit-buttons" style=""><input id="bt-enviar" value="Send Question" class="button1" name="post" type="button" /><input id="bt-enviar-e" value="Enviar Questão" class="button1" style="display:none;" name="post" type="submit" /></fieldset>
</div><style>.button1 {
background: url("http://i43.servimg.com/u/f43/15/93/99/44/highli10.png") repeat-x scroll 0px 0px purple !important;
border-radius: 3px 3px 3px 3px;
box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.3);
color: rgb(255, 255, 255);
cursor: pointer;
display: block;
font-size: 11px;
font-weight: 400;
height: 20px;
line-height: 23px;
margin: 6px 1px;
padding: 1px 6px 3px;
}
.pun input {
border-width: 1px;
padding: 4px;
}</style>
</div><strong></strong>
</form>
Home
![[Solved] Question form How10](https://i.servimg.com/u/f56/15/05/85/45/how10.png)
![[Solved] Question form Left1011](https://i.servimg.com/u/f57/17/68/86/50/left1011.png){kind=small}
![[Solved] Question form Middle10](https://i.servimg.com/u/f72/17/48/02/71/middle10.png){kind=small}
![[Solved] Question form Right10](https://i.servimg.com/u/f72/17/48/02/71/right10.png){kind=small}
