جستجو در دورآموز

خانه / وبگاه / Ajax در Asp.net core
652 برگشت

Ajax در Asp.net core

رامین اسلامی
رامین اسلامی

مدیر وب سایت دورآموز ،مدیر پروژه تیم برنامه نویسی جی وب ، برنامه نویس و مدرس زبان های برنامه نویسی و گرافیک

یکشنبه، 19 آبان 1398 ساعت 21:10:53
Ajax در Asp.net core

Ajax در Asp.net core

این آموزش در مورد گرفتن کمکهای آژاکس بدون  جی کوئری در  Asp.net Core می باشد. تمام ویژگی های Ajax.Form موجود در MVC به عنوان ویژگی های data-* در core در دسترس هستند.

برای استفاده از این ابتدا باید اسکریپهای جی کوئری و jquery.unobtrusive-ajax را فراخوانی کنید، میتوانید آن را از طریق bower دانلود و نصب کنید.

هنگامی که اسکریپت را نصب می کنید، می توانید آن را در فایل _layout.cshtml مانند این بنویسید.

<script src = “~/ lib/Microsoft.jQuery.Unobtrusive.Ajax/jquery.unobtrusive-ajax.min.js”> </ script>

در اینجا ویژگی هایی است که می توان برای مهاجرت Ajax.Form helpers استفاده کرد.

شما می توانید این صفات را با عنصر فرم مانند این اضافه کنید.

<form asp-controller="Home" asp-action="SaveForm" data-ajax="true" data-ajax-method="POST">
</form

در اینجا کدی است که در هنگام ارسال فرم نشانگر پیشرفتی را نشان می دهد و پس از تکمیل، موفقیت یا عدم موفقیت، پیام هشدار را نشان می دهد

var results = $("#Results");
var onBegin = function(){
    results.html("<img src=\"/images/ajax-loader.gif\" alt=\"Loading\" />");
};
 
var onComplete = function(){
    results.html("");
};
 
var onSuccess = function(context){
    alert(context);
};
 
var onFailed = function(context){
    alert("Failed");
};

و فرم HTML به صورت زیر خواهد بود

<form asp-controller="Home" asp-action="SaveForm"
    data-ajax-begin="onBegin" data-ajax-complete="onComplete"
    data-ajax-failure="onFailed" data-ajax-success="onSuccess"
    data-ajax="true" data-ajax-method="POST">
    <input type="submit" value="Save" class="btn btn-primary" />
    <div id="Results"></div>
</form>

 

موفق باشید

جهت برقراری ارتباط با نویسنده پست و یا ارسال نظر اطلاعات زیر را وارد نمایید
تصویر کپچا دورآموز
زهرا مفتاحی

ممنون از زحمات شما ,, خیلی مفید و کامل بود.

سوالات متداول دورآموز