Wie die Umsetzung Autocomplete Textbox in MVC
Stehe ich vor einem problem in autocompleting die textbox vith hardcoded Daten, mein json "Suchen" - Methode nicht ausgelöst, ich Suche eine Menge code zu implementieren, die es in meinem Projekt aber nicht den Erfolg noch. ich weiß nicht, wo das problem ist. bitte helfen Sie mir thankx im Voraus
Modell:
public class Locations
{
public int Id { get; set; }
public string Name { get; set; }
}
Controller:
public JsonResult Search(string query)
{
List<Locations> locations = new List<Locations>()
{
new Locations() {Id = 1, Name = "London"},
new Locations() {Id = 2, Name = "Walles"},
new Locations() {Id = 3, Name = "Birmingham"},
new Locations() {Id = 4, Name = "Edinburgh"},
new Locations() {Id = 5, Name = "Glasgow"},
new Locations() {Id = 6, Name = "Liverpool"},
new Locations() {Id = 7, Name = "Bristol"},
new Locations() {Id = 8, Name = "Manchester"},
new Locations() {Id = 9, Name = "NewCastle"},
new Locations() {Id = 10, Name = "Leeds"},
new Locations() {Id = 11, Name = "Sheffield"},
new Locations() {Id = 12, Name = "Nottingham"},
new Locations() {Id = 13, Name = "Cardif"},
new Locations() {Id = 14, Name = "Cambridge"},
new Locations() {Id = 15, Name = "Bradford"},
new Locations() {Id = 16, Name = "Kingston Upon Hall"},
new Locations() {Id = 17, Name = "Norwich"},
new Locations() {Id = 18, Name = "Conventory"}
};
List<string> Loc;
Loc = locations.Where(x => x.Name.StartsWith(query.ToLower())).Select(x => x.Name).ToList();
return Json(Loc, JsonRequestBehavior.AllowGet);
}
Anzeigen:
@model IEnumerable<SearchBox.Models.Locations>
@using SearchBox.Models
@{
ViewBag.Title = "Index";
}
<link href="~/Content/Autocomplete/jquery-ui.css" rel="stylesheet" />
<script src="~/Content/Autocomplete/jquery-ui.js"></script>
<link href="~/Content/Autocomplete/jquery-ui.theme.css" rel="stylesheet" />
<script type="text/javascript">
$("#tags").autocomplete({
source: '@Url.Action("Search")'
});
</script>
<input type="text" id="tags" />
Sie verwenden müssen, um AJAX-Aufruf im Quellcode-Zuordnung:
versuchte dies, aber ich weiß nicht wo das problem her kam raus, nichts passiert 🙁
Auch die Json-Methode nicht aufrufen, wo die Liste ist, binden
source: function (request, response) { $.ajax({ ... }) })
mit URL-parameter festlegen, wie url: '@Url.Action("Search")'
zu tun, oder das hinzufügen query
string-parameter in Url.Action
Helfer-Methode.versuchte dies, aber ich weiß nicht wo das problem her kam raus, nichts passiert 🙁
Auch die Json-Methode nicht aufrufen, wo die Liste ist, binden
InformationsquelleAutor Muhammad Aamir Majeed | 2017-04-21
Du musst angemeldet sein, um einen Kommentar abzugeben.
Die Sie benötigen, um ajax-request statt der übergabe einfach mit url in der Datenquelle.
Sehen, wie Sie mit autocomplete mit ajax-request.
Haben Sie jquery beacuase es funktioniert, auf mein Ende.
ja @Amit Kumar, die ich aufgenommen haben, das die Jquery-an der Spitze der meine Ansicht Seite Wie diese ... ist das du redest ??
<link href="~/Content/Autocomplete/jquery-ui.css" /> <script src="~/Content/Autocomplete/jquery-ui.js"></script> <link href="~/Content/Autocomplete/jquery-ui.Thema.css" />
außerdem müssen Sie die jquery-bundle.
<script src="~/Content/jquery-1.12.4.js"></script>
InformationsquelleAutor Amit Kumar
Habe ich implementiert diese in mein Projekt. Bitte prüfen Sie, ob Sie davon Gebrauch machen kann
JQuery:
Controller:
welche Fehler hast du?
es ist nichts zu zeigen, wenn ich beginnen Sie mit der Eingabe in textbox-auch wenn es nicht das Feuer die json-Methode
Sie haben zu Debuggen, die jede Zeile code dann. Prüfen Sie nach Eingabe eines Zeichens in die textbox, ob es den Aufruf der jquery-Methode oder nicht. Setzen debugger; an einigen stellen und überprüfen die Ausführung.
Seine nicht den Aufruf der Jquery-Methode
InformationsquelleAutor Naveen K N