La saisie semi-automatique pour la zone de texte en mvc

C'est mon point de vue et contrôleur. J'ai converti en code c# vb le code fonctionne parfaitement en C# mais je ne sais pas pourquoi ce java script ne fonctionne pas en vb. J'ai commencé le débogage, mais les contrôleurs jamais quand je tape quelque chose dans la boîte de recherche.

Code pour Afficher

@ModelType  PrudentHealthCare.Product
@Code
Layout = Nothing
End Code
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Search</title>
</head>
<body>
<div> 
@Using (Html.BeginForm())
@Html.HiddenFor(Function(model) model.id)
@<input type="text" id="search" placeholder="Search for a product" required />
@<input type="submit" value="Go" id="submit" />
End Using
</div>
</body>
</html>
<link href="~/Content/AutoComplete/jquery-ui.css" rel="stylesheet" />
<script src="~/Content/AutoComplete/jquery-ui.js"></script>
<script src="~/Content/AutoComplete/jquery-1.9.1.js"></script>
<script type="text/javascript">
var url = '@Url.RouteUrl( "DefaultApi" , New With { .httproute = "", .controller = "ProductApi" })';
$('#search').autocomplete({
source: function (request, response) {
$.ajax({
url: url,
data: { query: request.term },
dataType: 'json',
type: 'GET',
success: function (data) {
response($.map(data, function (item) {
return {
label: item.Description,
value: item.Id
}
}));
}
})
},
select: function (event, ui) {
$('#search').val(ui.item.label);
$('#Id').val(ui.item.value);
return false;
},
minLength: 1
});
</script>

ProductApiController

Imports System.Web.Mvc
Namespace Controllers
Public Class ProductApiController
Inherits Controller
<HttpGet>
Public Function GetProducts(Optional query As String = "") As IEnumerable(Of Product)
Dim xyz As String
xyz = query
End Function
End Class
End Namespace
  • Avez-vous vérifié le navigateur de la console pour voir si il y a une erreur?
  • Nope, je n'ai pas vérifier. Comment vérifier si javascript est bien ou pas, avec l'aide du navigateur de la console. J'ai firebug mais je ne pense pas qu'il puisse faire ce genre de trucs
  • Vous pouvez le faire sur firefox. Voir ici
InformationsquelleAutor Aayushi Jain | 2015-04-13
  1. 5

    jQuery UI a un La saisie semi-automatique widget. Le widget de saisie semi-automatique est assez agréable et simple à utiliser. Dans ce post, comment intégrer le widget de saisie semi-automatique avec un ASP.NET application MVC.

    La première étape consiste à ajouter les scripts jQuery et de styles. Avec ASP.NET MVC 4, le code suivant fonctionne:

    @Styles.Render("~/Content/themes/base/css")
@Scripts.Render("~/bundles/jquery")    
@Scripts.Render("~/bundles/jqueryui")

    À l'aide de la saisie semi-automatique widget est également simple. Vous devrez ajouter une zone de texte et fixez le widget de saisie semi-automatique dans la zone de texte. Le seul paramètre qui est nécessaire pour le widget en fonction de la source. Pour cet exemple, nous allons obtenir les données de la saisie semi-automatique à partir d'un MVC méthode d'action.

    $(document).ready(function () {
$('#tags').autocomplete(
{
source: '@Url.Action("TagSearch", "Home")'
});
})

    Dans le code ci-dessus, la zone de texte id=balises est attaché avec le widget de saisie semi-automatique. La source pointe vers l'URL de TagSearch action du contrôleur HomeController: /Home/TagSearch. Dans le code HTML de la zone de texte ci-dessous:

    <input type="text" id="tags" />

    Lorsque l'utilisateur tape du texte dans la zone de texte, la méthode d'action - TagSearch est appelée avec un paramètre dans le corps de la requête. Le nom du paramètre est terme. Donc, votre méthode d'action doit avoir la signature suivante:

    public ActionResult TagSearch(string term)
{
// Get Tags from database
string[] tags = { "ASP.NET", "WebForms", 
"MVC", "jQuery", "ActionResult", 
"MangoDB", "Java", "Windows" };
return this.Json(tags.Where(t => t.StartsWith(term)), 
JsonRequestBehavior.AllowGet);
}
    InformationsquelleAutor Parth Akbari