我正在尝试使用Web-API创建常见问题解答解决方案。我从数据库中获得问题和答案。我只希望在单击实际问题时显示问题,并显示答案。
我现在得到的只是每个问题和答案。
这是我从数据库中获取问题的功能:
function ShowAllFaqs(faqs) {
var strResult = "<table class='table table-boarded'>";
$.each(faqs, function (i, p) {
strResult += "<tr><td>" + p.Question+ "</td></tr>";
strResult += "<tr><td>" + p.Answer+ "</td><td>" + p.Likes + "</td></tr>";
});
strResult += "</table>";
$("#faqs").html(strResult);
}
,它们就会出现在此div中:
<div class="container-fluid">
<h3>FAQs</h3>
<div id="faqs"></div>
</div>
This is what i'm trying to achieve 我想做这样的事情,只显示问题,当问题扩展时显示答案?任何人都知道如何在没有新观点的情况下找到答案
更新:
现在我有了这个视图,是否可以隐藏-element,直到您单击the然后显示每个单个元素的基础?
从表中的数据库显示的代码。
function ShowAllFaqs(faqs) {
var strResult = "<table class='table table-boarded'>";
$.each(faqs, function (i, p) {
strResult += "<tr><th>" + p.Question+ "</th></tr>";
strResult += "<td>" + p.Answer+ "</td>";
strResult += "<tr><td>" + "Did this answer you question?" + "</td><tr>";
});
strResult += "</table>";
$("#faqs").html(strResult);
}
答案 0 :(得分:0)
有几种方法可以满足需要,最简单的方法是使用DataGrid来管理“主/详细”模式下的显示。 这是一个建议,可以通过单击与问题对应的按钮来在新页面中显示答案。
索引视图中的Javascript代码
<script type="text/javascript">
function ShowAllFaqs(faqs) {
var strResult = "<table class='table table-boarded'>";
$.each(faqs, function (i, p) {
strResult += "<tr><td>" + p.Question+ "</td></tr>";
strResult += "<tr><td>" + p.Answer+ "</td><td>" + p.Likes + "</td></tr>";
strResult += "<tr>
<td> <button type'button' value='Show Answer' onclick='fnGetAnswer('@p.id'); return false;'></button> </td>
<td></td>
</tr>";
});
strResult += "</table>";
$("#faqs").html(strResult);
function fnGetAnswer(idQuestion) {
window.location.href = '/Answers/GetAnswer?id=' + idQuestion;
return false;
}
</script>
答案视图
@model FAQ.Models.AnswerModel
@{
ViewBag.Title = "Answers";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<body>
<table class="table">
<tr>
<th>
@Html.DisplayNameFor(model => model.First().NumAnswer)
</th>
<th>
@Html.DisplayNameFor(model => model.First().Anwser)
</th>
</tr>
@foreach (var item in Model)
{
<tr>
<td>
@Html.DisplayFor(modelItem => item.NumAnswer)
</td>
<td>
@Html.DisplayFor(modelItem => item.Anwser)
</td>
</tr>
}
</table>
</body>
答案控制者
public ActionResult GetAnswer(string NumQuestion)
{
AnswerModel answerModel = GetAnswers (NumQuestion);
return View(answerModel);
}
Cordialy