下拉菜单选择ditactes将显示哪种形式 [英] Drop down menu selection ditactes what form will display
问题描述
我目前正在研究一个项目,将不同类型对象的细节保存到数据库,例如书,网页和期刊文章。为了保存这些对象的不同属性,我试图获得不同的表单来显示,这取决于下拉菜单中的选择。
I'm currently working on a project that saves details of different types of objects to a database e.g. book, webpage and journal article. To save the different attributes of these objects I am trying to get different forms to display that depend on the selection in a drop down menu.
这是下拉菜单: p>
Here's the dropdown menu:
<div class="dropdown">
<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown">
Select Reference Type...
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
<li role="presentation"><a role="menuitem" tabindex="-1" href="book.php">Book</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="journal.php">Journal</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="webpage.php">Webpage</a></li>
</ul>
</div>
如何在不重定向到其他页面的情况下获得不同的窗体加载屏幕。我一直在尝试这样做在php,但我得到的感觉,php不是正确的方式来做这个。此外,我以前没有Javascript,AJAX或jQuery的经验提前道歉。
How to I get a different form to load on screen without redirecting to a different page. I've been trying to do this in php but I get the feeling that php isn't the right way of going about doing this. Also, apologies in advance as I have no previous experience in Javascript, AJAX or jQuery.
推荐答案
好的,所以没有了解你的其余代码,我建议最好的选择是拥有不同的表单在单独的文件中。
例如
Okay, so without knowing the rest of your code, I would suggest that the best option would be to have the different forms in separate documents. For example
HTML
<div class="dropdown">
<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown">
Select Reference Type...
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
<li role="presentation"><a onclick="bookinclude()" role="menuitem" tabindex="-1" href="book.php">Book</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="journal.php">Journal</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="webpage.php">Webpage</a></li>
</ul>
</div>
<div id="contentwrapper">
Some Initial Content Here
</div>
Javascript
Javascript
function bookinclude(){
$("#contentwrapper").fadeOut(400);
setTimeout(function(){$("#contentwrapper").load("book.php").fadeIn();}, 400);
};
并记得包含Jquery!在你的HTML头上:
And remember to include Jquery!In the head of your HTML:
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
基本上,点击图书链接,它将加载book.php到contentwrapper div
Basically, on the click of the book link, it will load the book.php into the contentwrapper div.
我想这是你想要的?所有你需要做的是复制功能和链接,但用日记和网页替换这本书。
I think this is what you want? All you need to do is replicate the function, and the link, but replace the book with journal, and with webpage.
希望这有帮助!
这篇关于下拉菜单选择ditactes将显示哪种形式的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!