Maison > interface Web > js tutoriel > le corps du texte

JQuery Ajax implémente les fonctions de requête de données, de tri et de pagination_jquery

ringa_lee
Libérer: 2018-05-10 11:53:55
original
1835 Les gens l'ont consulté

Dans le passé, j'utilisais rarement javascript pour implémenter les fonctions de page principalement parce que j'avais peur des ennuis, mais après avoir découvert JQuery, cette idée a changé avec un tel composant de script, il est pratique de l'isoler du HTML lors de l'écriture de scripts ; , de sorte que l'écriture soit hautement réutilisable. Les scripts sexuels sont plus pratiques. Ce qui suit est une introduction au script réutilisable basé sur les fonctions de requête de données Ajax, de tri et de pagination écrites dans le processus d'apprentissage de JQuery. Tant que vous suivez certaines règles du script pour décrire le HTML et introduire le fichier de script, vous pouvez facilement l'implémenter. les fonctions décrites ci-dessus.
Regardons d'abord le code pour implémenter la fonction :

/**应用脚本规则:
引用脚本: JQuery脚本和JQuery的form插件脚本
Form的ID: viewform
显示数据的p的ID: listview
分页按钮HTML属性: pageindex="1"
排序按钮HTML属性: orderfield="employeeid desc";
提效排序字段Input的ID,Name: orderfield
提交分页索引Input的ID,Name: pageindex
**/
function onInitPaging()
{
$("#listview").find("[@orderfield]").each(function(i)
{
var ordervalue = $(this).attr("orderfield");
$(this).click(function()
{
$("#orderfield").val(ordervalue);
onSubmitPage();
}
);
}
);
$("#listview").find("[@pageindex]").each(function(i)
{
var piValue = $(this).attr("pageindex");
$(this).click(function()
{
$("#pageindex").val(piValue);
onSubmitPage();
}
);
}
);
}
function onSubmitPage()
{
var options = {
success: function SubmitSuccess(data){
$("#listview").html(data);
onInitPaging();
}
};
$('#viewform').ajaxSubmit(options);
}
$(document).ready(
function()
{
$("#search").click(function(){
$("#pageindex").val('0');
onSubmitPage()
});
onSubmitPage();
}
);
Copier après la connexion

Les règles de contrainte utilisent intelligemment les attributs personnalisés du HTML. Le code ci-dessus décrit le traitement de la soumission ajax de requête, de tri et de pagination. Suivez simplement les règles décrites lors de l'écriture HTML. Vous n'avez pas besoin d'écrire de code de script ; ajoutez simplement le script à la page :

<br/>
Copier après la connexion

.
Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal