سؤال

أنا جديد على ajax/jquery وقد واجهت صعوبة في العثور على عينة بسيطة تتضمن ما يلي:

  • ASP.Net MVC RC1 (أو 2)
  • مسج
  • شكل مشروط

أرغب في أن يتمكن المستخدم من النقر فوق رابط/زر في طريقة عرض (الأصل) وأن يظهر نموذج مشروط يحتوي على نموذج.يجب أن تكون محتويات مربع الحوار المشروط طريقة عرض MVC (فرعية).

بمجرد إرسال النموذج، أرغب في اختفاء مربع الحوار المشروط وتحديث جزء من العرض الأصلي.

هل كانت مفيدة؟

المحلول

لذلك، لا تحتاج إلى التفكير في الأمر كله مرة واحدة.أولاً، اجعل النموذج الخاص بك بتنسيق html في مقدمة الصفحة وفي وسطها، وأرفق إجراءً، واجعله يعمل دون أي مبالغة مشروطة.
بمجرد أن يعمل منطق النموذج الخاص بك، يمكنك التكرار في jQuery.سواء كنت تريد البدء بالطريقة والنوافذ المنبثقة أو بالنشر غير المتزامن مع jQuery فالأمر متروك لك.عادةً ما أحب أن أجعل الأمر ناجحًا قبل أن أجعله جميلًا، لذلك سنتخذ هذا الطريق.إذا كنت تستخدم معيار <% Html.BeginForm...{ %> بناء جملة لتحديد النموذج الخاص بك، قم بإزالته.اذهب إلى المدرسة القديمة HTML!(أعلم أنه يمكنك تخصيص Html.Beginform بشكل أكبر ولكن من الأسهل استخدام html فقط)

<form action="<%= Url.ActionLink(...)%>" id="SomeForm">

يمكنك الآن توصيل jQuery في ملف document.ready، أو في أي مكان تقوم فيه بتهيئة JS.

$('#SomeForm').bind('submit', youractionfunction);

في نموذج الإجراء الخاص بك، من المحتمل أن تقوم باستدعاء منشور jQuery حيث يؤدي رد الاتصال الخاص بالمنشور إلى إخفاء النموذج الخاص بك وتحديث بقية الصفحة. توثيق واجهة برمجة التطبيقات

function youractionfunction(e){
  $.post($(e).attr('action'), // we get the action attribute (url) from the form
         { title : $('#titleBox').val()}, // the values we're passing
         yourCallbackFunction); 
  return false;  // This is important, this will stop the event from bubbling and your form from submitting twice.
}

الآن لديك نموذج أجاكسي، حتى تتمكن من العمل على رد الاتصال.

function yourCallbackFunction(data)
{
    // do something with the result.
}

الآن يمكننا أن نتحدث عن الطريقة.عادةً ما يكون الأمر مؤلمًا بعض الشيء، ولكن يمكنك استخدام مكون إضافي jQuery مثل هذا أو شيء مشابه للقيام بذلك نيابةً عنك.بعد ذلك، يكون الأمر مجرد مسألة توصيل الأحداث لإظهار النافذة المنبثقة وإخفائها، وستكون جاهزًا تمامًا.

إذا كانت نيتك هي تحميل هذا النموذج بشكل غير متزامن عند النقر على الرابط "إظهار"، فهذا أكثر إزعاجًا بعض الشيء، ولكنه لا يزال قابلاً للتنفيذ.يمكنك استخدام jQuery.Load (توثيق واجهة برمجة التطبيقات) لسحب html وإدخاله في dom، ولكن لا يزال يتعين عليك ربط الأحداث (مرة أخرى، باستخدام الرابط ("إرسال"...) الموضح أعلاه).

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top