だから何が起こっているの:私は辞書であると考えられるUmbraco 7で親テンプレートを持っていると私はテンプレートがレスを各辞書の単語を作った検索MVC/AJAX/jQueryを使ってUmbraco
「leksi」と呼ばれるタイトルと、単語の説明が「perigrafileksis」と呼ばれるリッチテキストエディタの2つのプロパティのみを持つdoctypeです。私はそのページの上に検索フォームを持っています。私は元の単語があった場所で、ページを更新せずにタイトルまたは説明(Umbraco内)を検索するために検索フォームを必要とします。理解を容易にするために絵を:
私はMVCでこれをやっている(またはそれをしようとします)が、私はかなりさえW3Schoolsのチュートリアルと、このようなを読んだ後、AJAXを使用する方法はほとんど分かりません。
は、これまでのところ私が持っている:
コントローラー:
using MyUmbraco.Models;
using System.Web.Mvc;
using Umbraco.Web.Mvc;
namespace MyUmbraco.Controllers
{
public class SearchDictionarySurfaceController : SurfaceController
{
// GET: SearchDictionarySurface
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult HandleDictionarySearching(SearchBarViewModel model)
{
if (!string.IsNullOrEmpty(model.query))
{
var query = Request.QueryString["query"];
//var url = Umbraco.Content("1409");
return CurrentUmbracoPage();
}
else
{
return new RedirectResult("/homePage/", false);
}
}
}
}
部分:
@inherits Umbraco.Web.Mvc.UmbracoViewPage<SearchBarViewModel>
@using MyUmbraco.Controllers
@using MyUmbraco.Models
@using Umbraco.Web;
@{
var node = UmbracoContext.Current.PublishedContentRequest.PublishedContent;
}
@using (Html.BeginUmbracoForm<SearchDictionarySurfaceController>("HandleDictionarySearching", null, new { @class = "input-group input-lg add-on" }))
{
@Html.ValidationSummary(true)
@Html.AntiForgeryToken()
@*<form action="" method="post" target="_blank" class="input-group input-lg add-on searchbarbackground">*@
@Html.TextBoxFor(model => model.query, null, new { @class = "form-control searchbar", @method = "post", @target = "_blank", @id = "query" })
<div class="input-group-btn searchbutton">
<button class="btn" type="submit" tabindex="2" id="search">
@if (node == Umbraco.TypedContent(1254))
{
<img src="~/css/images/focal-lense-brown.png" />
}
else
{
<img src="~/css/images/focal-lense.png" />
}
</button>
</div>
@*</form>*@
}
<script>
//the script is the one that tells the controller to send the data to the model. If we don't have that, we can't do anything.
$(document).ready(function() {
$("#search").click(function (event) {
event.preventDefault();
xhttp.open("POST", "ajax_info.txt", true);
xhttp.send();
});
});
</script>
と部分検索フォームがレンダリングされる実際の辞書のページ:
<body>
@Html.Partial("_Navbar")
<div class="container plainwhite">
<div class="row">
<div class="col-md-12">
@{ Html.RenderPartial("_DictionarySearchBar", new SearchBarViewModel());}
</div>
</div>
<div class="row">
@foreach (var item in Model.Content.Descendants("lekseisDiatrofikouLeksikou"))
{
<div class="col-sm-3 styled">
<button data-id="@id" type="button" class="btn">
@(item.GetPropertyValue<string>("leksi"))
</button>
<div id="@("button-wrapper"+id)" class="col-xs-12 styled2 text-center nopadding">
@Html.Raw(item.GetPropertyValue<string>("perigrafiLeksis"))
</div>
</div>
id++;
}
</div>
</div>
@Html.Partial("_FooterMenu")
</body>
あなたは私のためにそれを解決する必要はありません、私はちょうどそれの論理を理解したい。私が何も見つけていないので、私がしたいことをやっているチュートリアルに私を指摘しても、すばらしいことになります。
質問は、AJAXのロジックは何ですか?私は元のページと同じ結果をレンダリングする余分な部分を持って、それを隠しdivまたは何にする必要がありますか?私は本当に混乱しています。また、私は、送信>更新ページを防ぐためにJQueryが必要だと思いますが、そこに何を書き込むのか分かりません。また、AJAXはスクリプト内にあるのか、ページ内だけにあるのでしょうか?または別のファイルで?
私たちは戦争を失っている、助けを送ろう!
本当に誰もインターネットの歴史の中で今までそれのようなものに出くわしたことがありますか? – Jabberwocky