تقييم الموضوع :
  • 0 أصوات - بمعدل 0
  • 1
  • 2
  • 3
  • 4
  • 5
الجزء الأول- إستدعاء دالة Server-Side بإستخدام Client-Side
#1
كاتب الموضوع : Ahmed Moosa

تنفيذ دالة Server –side من خلال كود Client Side
بإستخدام Ajax و JQuery
الجزء الأول

الهدف من الدرس :
تجنب عمل PostBack للصفحة بأكملها .أو بصيغة أخرى : تحديث جزء من الصفحة دون الرجوع بكامل الصفحة إلى الخادم Server .

المقدمة :
فى هذة السلسلة سنتعرف على كيفية تنفيذ دالة معينة قد تكون فى ملف منفصل code Behindأو صفحة aspx أو حتى Web Service أو ربما HttpHandler من خلال إستدعائها بإستخدام Client Side Code . سنمر خلال هذة السلسلة بوظائف عديدة تقدمها Ajax وJquery مروراً بمجموعة من الدوال الشيقة التى ستوفر علي المستخدم ضياع الوقت فى الإنتظار حتى يتم الإتصال بالخادمServer ومن ثم الرجوع بالنتيجة وعرضها على الصفحة مما قد يسبب فى قلة جودة الأداء فى العمل مع الموقع . لذلك كوننا سننفذ هذة العملية من خلال client Side فلا حاجة لعمل PostBack وذهاب الصفحة بأكملها والعودة مرة أخرى بالبيانات الجديدة ولكن فقط سنتصل بالخادم ونرجع بالبيانات فقط ومن ثم عرضها للمستخدم دون أن يشعر أن هناك إتصال بالخادم .ومما لا شك فيه ان هذا Best Practice .

سنبدأ أولاً مع ajax ولكن قبل أن نبداً لنرى محتويات الصفحة التى سنعمل معها والدالة التى بها :
لنقل أنها default.aspx

كود :
[color=#000000][COLOR=#0000bb][/color][color=#007700]<[/color][color=#0000bb]body[/color][COLOR=#007700]>
    <[/COLOR][color=#0000bb]form id[/color][color=#007700]=[/color][color=#dd0000]"form1" [/color][color=#0000bb]runat[/color][color=#007700]=[/color][color=#dd0000]"server"[/color][COLOR=#007700]>
    <[/COLOR][color=#0000bb]div[/color][COLOR=#007700]>
        <[/COLOR][color=#0000bb]br [/color][COLOR=#007700]/>
          <[/COLOR][color=#0000bb]input id[/color][color=#007700]=[/color][color=#dd0000]"Button1" [/color][color=#0000bb]type[/color][color=#007700]=[/color][color=#dd0000]"button" [/color][color=#0000bb]value[/color][color=#007700]=[/color][color=#dd0000]"Call Server Side Method" [/color][COLOR=#007700]/>
        <[/COLOR][color=#0000bb]br [/color][COLOR=#007700]/>
    </[/COLOR][color=#0000bb]div[/color][COLOR=#007700]>
    </[/COLOR][color=#0000bb]form[/color][COLOR=#007700]>
</[/COLOR][color=#0000bb]body[/color][COLOR=#007700]>  
[/COLOR][color=#0000bb][/color][/COLOR]

ما تراه هو صفحة ليس فيها سوا اداة button سيقوم عند الضغط عليه بتنفيذ دالة معينة ووظيفتها الإتصال بالخادم وإحضار الناتج وهو ما نسمية Response .
وهذة هى الدالة :

كود :
[color=#000000][COLOR=#0000bb]    [/color][color=#007700][[/color][color=#0000bb]System[/color][color=#007700].[/color][color=#0000bb]Web[/color][color=#007700].[/color][color=#0000bb]Services[/color][color=#007700].[/color][color=#0000bb]WebMethod[/color][COLOR=#007700]]
    public static [/COLOR][color=#0000bb]String GetSome[/color][COLOR=#007700]()
    {
        return [/COLOR][color=#dd0000]"Hello World! from Server Side Method "[/color][COLOR=#007700];
    }  
[/COLOR][color=#0000bb][/color][/COLOR]

والجديد بالذكر هنا انه يجب تعريف الدالة على أنها WebMethod من خلال وضع Attribute كما ترى بالشكل ولماذا ذلك ؟ سؤال جيد ولكن إذا عرفت وظيفتها لم يعد هناك سؤال وهى للسماح للدالة بإن يتم إستدعائها من خلال Remote Web clients . وكذلك تعريف الدالة على انها public وStatic وذلك لضبط ما يسمى Scope وهو مجال أو نطاق إستدعاء الدالة .


الطريقة الأولى : العمل من خلال PageMethods

ما هى PageMethods ؟
تعد تقنية PageMethods أحد مزايا Ajax والتى تعمل فى إطار العمل مع الخادم دون الرجوع بكامل الصفحة لإحضار جزء من الصفحة وهو ما أطلق عليه partial Page updating (تحديث جزئى للصفحة ). ولهذا كانت PageMethods لتعمل على مناداة دالة معينة بإسمهما لتنفذ وتعود بالناتج للصفحة ومن ثم نتحكم فى عرضه فى أى مكان نختار .

كيف تعمل PageMethods ؟
يتم إنشاء JavaScript PageMethods Object وقت التشغيل والذى يعمل على إيجاد الدوال التى تم الإعلان على أنها WebMethod والذى يعمل على أنه Proxy (وهو طريقة التفاعل مع المستخدمين فى جلب بيانات من جهاز إلى جهاز آخر ) . وتعمل بمثابة Class تحتوى على الدوال المراد إستدعائها مثال على ذلك :

كود :
[color=#000000][COLOR=#0000bb]PageMethods[/color][color=#007700].[/color][color=#0000bb]MethodName [/color][color=#007700]( [[/color][color=#0000bb]parameters[/color][color=#007700]] , [/color][color=#0000bb]OnSuccess [/color][color=#007700],[/color][color=#0000bb]OnError [/color][COLOR=#007700])  
[/COLOR][color=#0000bb][/color][/COLOR]

حيث نجد أن Parameters إختيارى فقط يتم إدراجها إن كانت الدالة تتطلب وجودها . ونجد أيضاً دالتى onsuccess و onerror .
كيف وإين يتم إنشاء هذا الـ object وهذة Class ؟
يمكن رؤية كامل الكود أثناء وقت التشغيل وذلك بعد إستعراض الصفحة ومن ثم عرض View Source فى المتصفح من Right Click ومن ثم إختيار view Source على لصفحة لترى ما يسمى Proxy الناتج لإجراء عملية الإتصال ومن قام بإدراج هذا الكود هو ScriptManager وذلك بعد ضبط الخاصية EnablePageMethods = true .
بعد أن ترى الكود السابق الكلام عنه . قد تتفاجأ بتعقيداته . ولكن لا عليك فليس لك فيه أى تدخل ربما تتجول فيه من باب العلم بالشئ . أما أنا فقد تعلمت منه شئ هام جداً الحقيقة فادنى كثيراً , فماذا عنك ؟

طريقة العمل
ويتم العمل على ثلاث خطوات :
الخطوة الآولى :
إدراج اداة ScriptManager ثم ضبط الخاصية EnabledPageMethods = true كما بالشكل :

كود :
[color=#000000][COLOR=#0000bb][/color][color=#007700]<[/color][color=#0000bb]body[/color][COLOR=#007700]>
    <[/COLOR][color=#0000bb]form id[/color][color=#007700]=[/color][color=#dd0000]"form1" [/color][color=#0000bb]runat[/color][color=#007700]=[/color][color=#dd0000]"server"[/color][COLOR=#007700]>
    <[/COLOR][color=#0000bb]asp[/color][color=#007700]:[/color][color=#0000bb]ScriptManager ID[/color][color=#007700]=[/color][COLOR=#dd0000]"ScriptManager1"
                       [/COLOR][color=#0000bb]runat[/color][color=#007700]=[/color][COLOR=#dd0000]"server"
                       [/COLOR][color=#0000bb]EnablePageMethods[/color][color=#007700]=[/color][color=#dd0000]"true"[/color][COLOR=#007700]>
    </[/COLOR][color=#0000bb]asp[/color][color=#007700]:[/color][color=#0000bb]ScriptManager[/color][COLOR=#007700]>
    <[/COLOR][color=#0000bb]div[/color][COLOR=#007700]>
        <[/COLOR][color=#0000bb]br [/color][COLOR=#007700]/>
        <[/COLOR][color=#0000bb]input id[/color][color=#007700]=[/color][color=#dd0000]"Button1" [/color][color=#0000bb]type[/color][color=#007700]=[/color][color=#dd0000]"button" [/color][color=#0000bb]value[/color][color=#007700]=[/color][color=#dd0000]"Call Server Side Method" [/color][color=#0000bb]onclick[/color][color=#007700]=[/color][color=#dd0000]"func()" [/color][COLOR=#007700]/>
        <[/COLOR][color=#0000bb]br [/color][COLOR=#007700]/>
    </[/COLOR][color=#0000bb]div[/color][COLOR=#007700]>
    </[/COLOR][color=#0000bb]form[/color][COLOR=#007700]>
</[/COLOR][color=#0000bb]body[/color][COLOR=#007700]>
</[/COLOR][color=#0000bb]html[/color][COLOR=#007700]>  
[/COLOR][color=#0000bb][/color][/COLOR]

الخطوة الثانية :

بالطبع إنشاء الدالة التى رأيتها بالأعلى فى بداية الدرس وتكون إما فى داخل الصفحة default.aspx أو ملف كود المنفصل وهو ما يسمى Code behind .

كود :
[color=#000000][COLOR=#0000bb]    [/color][color=#007700][[/color][color=#0000bb]System[/color][color=#007700].[/color][color=#0000bb]Web[/color][color=#007700].[/color][color=#0000bb]Services[/color][color=#007700].[/color][color=#0000bb]WebMethod[/color][COLOR=#007700]]
    public static [/COLOR][color=#0000bb]String GetSome[/color][COLOR=#007700]()
    {
        return [/COLOR][color=#dd0000]"Hello World! from Server Side Method "[/color][COLOR=#007700];
    }  
[/COLOR][color=#0000bb][/color][/COLOR]

الخطوة الثالثة :
إستدعاء الدالة وهذا يكون من خلال كتابة JavaScript Code والذى بدوره يستدعى الدالة ويأتى بالناتج هكذا :

كود :
[color=#000000][COLOR=#0000bb]    [/color][color=#007700]function [/color][color=#0000bb]func[/color][COLOR=#007700]() {
            [/COLOR][color=#0000bb]PageMethods[/color][color=#007700].[/color][color=#0000bb]GetSome[/color][color=#007700]([/color][color=#0000bb]onsuccess[/color][color=#007700], [/color][color=#0000bb]onerror [/color][COLOR=#007700]);
            function [/COLOR][color=#0000bb]onsuccess[/color][color=#007700]([/color][color=#0000bb]result[/color][COLOR=#007700]) {
                [/COLOR][color=#0000bb]alert[/color][color=#007700]([/color][color=#0000bb]result[/color][COLOR=#007700]);
            }
            function [/COLOR][color=#0000bb]onerror[/color][color=#007700]([/color][color=#0000bb]err[/color][COLOR=#007700]) {
                [/COLOR][color=#0000bb]alert[/color][color=#007700]([/color][color=#0000bb]err[/color][color=#007700].[/color][color=#0000bb]get_message[/color][COLOR=#007700]());
            }
       }  
[/COLOR][color=#0000bb][/color][/COLOR]

فى الحقيقة كان يمكن إدراجهم فى سطر واحد ولكن حتى لايصعب فهم الكود ولتتم قرائته بشكل جيد ولوكان لكان هكذا :
PageMethods.GetSome(function (result) {alert(result);},function(err){alert(err.get_messa ge());});
وللعلم : الدوال التى فى السطر الأعلى تسمى Anonymous method .

لاحظ اننا وضعنا الكود داخل دالة وإسمها func والتى ستنفذ بالضغط على أداة Button الموجودة فى الصفحة .

وبعد التنفيذ يجب أن الشكل التالى :



لاحظ عند وجود Parameters سيتغير القليل مثال :
PageMethods.GetSome("Ahmed ",succes, error);
فى حين الدالة جب ان تكون بالفعل تقبل Parameters كمثال الدالة التى تعمل مع السطر السابق تكون على الشكل التالى :

كود :
[color=#000000][COLOR=#0000bb]    [/color][color=#007700][[/color][color=#0000bb]System[/color][color=#007700].[/color][color=#0000bb]Web[/color][color=#007700].[/color][color=#0000bb]Services[/color][color=#007700].[/color][color=#0000bb]WebMethod[/color][COLOR=#007700]]
    public static [/COLOR][color=#0000bb]String GetSome[/color][color=#007700]([/color][color=#0000bb]string some [/color][COLOR=#007700])
    {
        return [/COLOR][color=#dd0000]"Hello : " [/color][color=#007700]+ [/color][color=#0000bb]some[/color][color=#007700].[/color][color=#0000bb]ToString [/color][COLOR=#007700]();
    }  
[/COLOR][color=#0000bb][/color][/COLOR]

هل لاحظت شيئاً ؟
إن لم تلاحظ فقد لاحظته لك الدالة التى قمنا بإستدعائها فى نفس الصفحة أى تتبع الصفحة التى تستدعيها أى أن الدالة فى default.aspx والكود الذى قام بإستدعاء الدالة أيضاً فى default.aspx . فماذا إن كنا نريد إستدعاء دالة فى صفحة أخرى ولتكن default2.aspx وذلك من صفحةdefault.aspx.

هنا يأتى دور تغير مسار العمل التى تعتمده PageMethods من خلال إعطاء عنوان أخر بإستخدام الدالة Set_path() . وهذا مثال يوضح أكثر :


كود :
[color=#000000][COLOR=#0000bb][/color][color=#007700]function [/color][color=#0000bb]func[/color][COLOR=#007700]() {

[/COLOR][color=#0000bb]PageMethods[/color][color=#007700].[/color][color=#0000bb]set_path[/color][color=#007700]([/color][color=#dd0000]"default2.aspx"[/color][COLOR=#007700]);
                        
[/COLOR][color=#0000bb]PageMethods[/color][color=#007700].[/color][color=#0000bb]GetSome[/color][color=#007700](function ([/color][color=#0000bb]result[/color][COLOR=#007700]) {
[/COLOR][color=#0000bb]alert[/color][color=#007700]([/color][color=#0000bb]result[/color][color=#007700].[/color][color=#0000bb]toString[/color][COLOR=#007700]());
        }, function [/COLOR][color=#0000bb]error[/color][color=#007700]([/color][color=#0000bb]err[/color][COLOR=#007700]) {
                            [/COLOR][color=#0000bb]alert[/color][color=#007700]([/color][color=#0000bb]err[/color][COLOR=#007700]);
                        });
}  
[/COLOR][color=#0000bb][/color][/COLOR]

هناك طريقة اخرى لعمل ذلك وهو إستدعاء دالة تسمى _invoke وتعمل بهذا الشكل :

كود :
[color=#000000][COLOR=#0000bb]_invoke[/color][color=#007700]([/color][color=#0000bb]servicePath[/color][color=#007700], [/color][color=#0000bb]methodName[/color][color=#007700], [/color][color=#0000bb]useGet[/color][color=#007700], [/color][color=#0000bb]params[/color][color=#007700], [/color][color=#0000bb]onSuccess[/color][color=#007700], [/color][color=#0000bb]onFailure[/color][color=#007700], [/color][color=#0000bb]userContext[/color][COLOR=#007700])  
[/COLOR][color=#0000bb][/color][/COLOR]

ومثال على ذلك .

كود :
[color=#000000][COLOR=#0000bb][/color][color=#007700]var [/color][color=#0000bb]pm [/color][color=#007700]= new [/color][color=#0000bb]PageMethods[/color][COLOR=#007700];
[/COLOR][color=#0000bb]pm[/color][color=#007700].[/color][color=#0000bb]_invoke[/color][color=#007700]([/color][color=#dd0000]"default7.aspx"[/color][color=#007700], [/color][color=#dd0000]'GetSome'[/color][color=#007700], [/color][color=#0000bb]false[/color][color=#007700], {}, [/color][color=#0000bb]success[/color][color=#007700], [/color][color=#0000bb]error[/color][color=#007700], [/color][color=#0000bb]null[/color][COLOR=#007700]);  
[/COLOR][color=#0000bb][/color][/COLOR]

وبدلاً من إنشاء object كما فى المثال السابق يمكن الإستغناء بذلك :

كود :
[color=#000000][COLOR=#0000bb]PageMethods[/color][color=#007700].[/color][color=#0000bb]prototype[/color][color=#007700].[/color][color=#0000bb]_invoke[/color][color=#007700]([/color][color=#dd0000]"default7.aspx"[/color][color=#007700], [/color][color=#dd0000]'GetSome'[/color][color=#007700], [/color][color=#0000bb]false[/color][color=#007700], {}, [/color][color=#0000bb]succes[/color][color=#007700], [/color][color=#0000bb]error[/color][color=#007700], [/color][color=#0000bb]null[/color][COLOR=#007700]);  
[/COLOR][color=#0000bb][/color][/COLOR]

جرب وستعمل معك إن شاء الله .

ولكن ماذا إن كنا مثلاً نقوم بإدخال بيانات مثلاً فى قواعد البيانات فسنجد أن الدالة ستقبل بيانات أى Parameters فنجد هنا أن الكود سيتغير للشكل التالى :

كود :
[color=#000000][COLOR=#0000bb]pm[/color][color=#007700].[/color][color=#0000bb]_invoke[/color][color=#007700]([/color][color=#dd0000]"default7.aspx"[/color][color=#007700],[/color][color=#dd0000]'GetSome'[/color][color=#007700],[/color][color=#0000bb]false[/color][color=#007700],{[/color][color=#0000bb]some [/color][color=#007700]:[/color][color=#dd0000]"MyValue"[/color][color=#007700],[/color][color=#0000bb]some2[/color][color=#007700]:[/color][color=#dd0000]"myvalue"[/color][color=#007700]},[/color][color=#0000bb]success[/color][color=#007700], [/color][color=#0000bb]error[/color][color=#007700], [/color][color=#0000bb]null[/color][COLOR=#007700]);  
[/COLOR][color=#0000bb][/color][/COLOR]

فى حين أن الدالة تكون بالشكل التالى :


كود :
[color=#000000][COLOR=#0000bb]    [/color][color=#007700][[/color][color=#0000bb]System[/color][color=#007700].[/color][color=#0000bb]Web[/color][color=#007700].[/color][color=#0000bb]Services[/color][color=#007700].[/color][color=#0000bb]WebMethod[/color][COLOR=#007700]]
    public static [/COLOR][color=#0000bb]String GetSome[/color][color=#007700]([/color][color=#0000bb]string some [/color][color=#007700], [/color][color=#0000bb]string some2[/color][COLOR=#007700])
    {
        return [/COLOR][color=#dd0000]"Hello " [/color][color=#007700]+ [/color][color=#0000bb]some [/color][color=#007700]+ [/color][color=#dd0000]"  :  " [/color][color=#007700]+ [/color][color=#0000bb]some2  [/color][COLOR=#007700];
    }  
[/COLOR][color=#0000bb][/color][/COLOR]

والشاهد هنا ان المتغيرات تتم كتابتها بهذا الشكل .{some :"MyValue",some2:"myvalue"} ولاحظ حالة الأحرف للمتغيرات السابقة .

الكود كاملاً للمثال الأخير وهو لأستدعاء دالة فى صفحة أخرى تتطلب وجود parameters :

كود :
[color=#000000][COLOR=#0000bb][/color][color=#007700]<%@ [/color][color=#0000bb]Page Language[/color][color=#007700]=[/color][color=#dd0000]"C#" [/color][color=#0000bb]AutoEventWireup[/color][color=#007700]=[/color][color=#dd0000]"true" [/color][color=#0000bb]CodeFile[/color][color=#007700]=[/color][color=#dd0000]"Default5.aspx.cs" [/color][color=#0000bb]Inherits[/color][color=#007700]=[/color][color=#dd0000]"Default5" [/color][COLOR=#007700]%>

<![/COLOR][color=#0000bb]DOCTYPE html [/color][color=#007700]PUBLIC [/color][color=#dd0000]"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"[/color][COLOR=#007700]>

<[/COLOR][color=#0000bb]html xmlns[/color][color=#007700]=[/color][color=#dd0000]"http://www.w3.org/1999/xhtml"[/color][COLOR=#007700]>
<[/COLOR][color=#0000bb]head runat[/color][color=#007700]=[/color][color=#dd0000]"server"[/color][COLOR=#007700]>
    <[/COLOR][color=#0000bb]title[/color][color=#007700]></[/color][color=#0000bb]title[/color][COLOR=#007700]>

    <[/COLOR][color=#0000bb]script type[/color][color=#007700]=[/color][color=#dd0000]"text/javascript"[/color][COLOR=#007700]>
        function [/COLOR][color=#0000bb]func[/color][COLOR=#007700]() {
            var [/COLOR][color=#0000bb]pm [/color][color=#007700]= new [/color][color=#0000bb]PageMethods[/color][COLOR=#007700];
            [/COLOR][color=#0000bb]pm[/color][color=#007700].[/color][color=#0000bb]_invoke[/color][color=#007700]([/color][color=#dd0000]"default7.aspx"[/color][color=#007700], [/color][color=#dd0000]'GetSome'[/color][color=#007700], [/color][color=#0000bb]false[/color][color=#007700], {[/color][color=#0000bb]some [/color][color=#007700]:[/color][color=#dd0000]"MyValue" [/color][color=#007700], [/color][color=#0000bb]some2[/color][color=#007700]: [/color][color=#dd0000]"myvalue" [/color][color=#007700]}, [/color][color=#0000bb]success[/color][color=#007700], [/color][color=#0000bb]error[/color][color=#007700], [/color][color=#0000bb]null[/color][COLOR=#007700]);
        }
        function [/COLOR][color=#0000bb]success[/color][color=#007700]([/color][color=#0000bb]result[/color][COLOR=#007700]) {
            [/COLOR][color=#0000bb]alert[/color][color=#007700]([/color][color=#0000bb]result[/color][color=#007700].[/color][color=#0000bb]toString[/color][COLOR=#007700]());
        }
        function [/COLOR][color=#0000bb]error[/color][color=#007700]([/color][color=#0000bb]err[/color][COLOR=#007700]) {
            [/COLOR][color=#0000bb]alert[/color][color=#007700]([/color][color=#0000bb]err[/color][color=#007700].[/color][color=#0000bb]get_message[/color][COLOR=#007700]());
        }

    [/COLOR][COLOR=#0000bb]</script>
[/COLOR]</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1"
                       runat="server"
                       EnablePageMethods="true">
    </asp:ScriptManager>
    <div>
        <br />
        <input id="Button1" type="button" value="Call Server Side Method" onclick="func()" />
        <br />
    </div>
    </form>
</body>
</html>  
[/COLOR]

مشكلات :
ربما تحاول الأشارة إلى أحد أدوات الصفحة مثال TextBox أو ما شابه من أداوت الصفحة . وللأسف لن تحصل على ماتريد . لإن الصفحة لا تعتبر وقت التنفيذ حين نصل إلى الدالة ونعود بالبيانات منها وما العمل إذاً ؟ هل ستعد مشكلة إذا أردنا أن نستخدم دالة لتحديث قاعدة البيانات ولدينا مدخلات فى اداوت وليكن مثال TextBox نريد ان نأخذ القيم منها ونعود بها إلى الدالة المستدعاه لتحديث قاعدة البيانات . فما العمل ؟
الحل يأتى فى التعامل مع هذة الأدوات من خلال Ajax او JavaScript للحصول على قيم هذة الأدوات وتمرير هذة القيم كـParameters للدالة مثال على ذلك ما يلى :

من خلال JavaScript

كود :
[color=#000000][COLOR=#0000bb][/color][color=#007700]var [/color][color=#0000bb]Txtval [/color][color=#007700]= [/color][color=#0000bb]document[/color][color=#007700].[/color][color=#0000bb]getElementById[/color][color=#007700]([/color][color=#dd0000]"TextBox1"[/color][color=#007700]).[/color][color=#0000bb]value[/color][COLOR=#007700];  
[/COLOR][color=#0000bb][/color][/COLOR]

ومن ثم تمريها للدالة هكذا

كود :
[color=#000000][COLOR=#0000bb]PageMethods[/color][color=#007700].[/color][color=#0000bb]GetSome[/color][color=#007700]([/color][color=#0000bb]Txtval[/color][color=#007700], [/color][color=#0000bb]success[/color][color=#007700], [/color][color=#0000bb]error[/color][COLOR=#007700]);  
[/COLOR][color=#0000bb][/color][/COLOR]

أو من خلال Ajax

كود :
[color=#000000][COLOR=#0000bb][/color][color=#007700]var [/color][color=#0000bb]Txtval [/color][color=#007700]= [/color][color=#0000bb]$get[/color][color=#007700]([/color][color=#dd0000]"TextBox1"[/color][color=#007700]).[/color][color=#0000bb]value[/color][COLOR=#007700];  
[/COLOR][color=#0000bb][/color][/COLOR]

وأيضاً تمريره بنفس الطريقة ولتكن الدالة الأخرى مثلاً هكذا

كود :
[color=#000000][COLOR=#0000bb]pm[/color][color=#007700].[/color][color=#0000bb]_invoke[/color][color=#007700]([/color][color=#dd0000]"default7.aspx"[/color][color=#007700],[/color][color=#dd0000]'GetSome'[/color][color=#007700],[/color][color=#0000bb]false[/color][color=#007700], {[/color][color=#0000bb]some [/color][color=#007700]: [/color][color=#0000bb]Txtval[/color][color=#007700]}, [/color][color=#0000bb]success [/color][color=#007700], [/color][color=#0000bb]error[/color][color=#007700], [/color][color=#0000bb]null[/color][COLOR=#007700]);  
[/COLOR][color=#0000bb][/color][/COLOR]

مشكلة اخرى :
وماذا عن تحديث Session أو Cookies أو أياً من أوامر التعامل مع State Management ؟
بطريقة مباشرة لن تستطيع لإن هذا غير مسموح مباشرة ولكن يمكن الإلتفاف من طريق أخر HttpContext

ومثال على ذلك التالى :

كود :
[color=#000000][COLOR=#0000bb]string Some [/color][color=#007700]= [/color][color=#0000bb]HttpContext[/color][color=#007700].[/color][color=#0000bb]Current[/color][color=#007700].[/color][color=#0000bb]Session[/color][color=#007700][[/color][color=#dd0000]"Some"[/color][color=#007700]].[/color][color=#0000bb]ToString[/color][COLOR=#007700]();
[/COLOR][color=#0000bb]string dom [/color][color=#007700]= [/color][color=#0000bb]HttpContext[/color][color=#007700].[/color][color=#0000bb]Current[/color][color=#007700].[/color][color=#0000bb]Application[/color][color=#007700][[/color][color=#0000bb]0[/color][color=#007700]].[/color][color=#0000bb]ToString[/color][COLOR=#007700]();
[/COLOR][color=#0000bb]string cook [/color][color=#007700]= [/color][color=#0000bb]HttpContext[/color][color=#007700].[/color][color=#0000bb]Current[/color][color=#007700].[/color][color=#0000bb]Request[/color][color=#007700].[/color][color=#0000bb]Cookies[/color][color=#007700][[/color][color=#dd0000]"cok"[/color][color=#007700]].[/color][color=#0000bb]Value[/color][COLOR=#007700];  
[/COLOR][color=#0000bb][/color][/COLOR]

ولكن بالطبع لابد ان يكون هناك اولاً Session بالإسم الذى طلبته وهو some وكذلك الحال مع البقية .

مشكلة اخرى :
ماذا عن العمل مع HttpHandler ؟ فهو لا يحتوى على دوال فكيف أحصل على بيانات منه ؟
هنا لايمكن أن تستخدم الطريقة الأولى مثال PageMotheds.MethodName() لإننا هنا ليس لدينا دالة حتى نأتى بإسمها . وأما الطريقة ألأخرى مثال :

كود :
[color=#000000][COLOR=#0000bb][/color][color=#007700]var [/color][color=#0000bb]pm [/color][color=#007700]= new [/color][color=#0000bb]PageMethods[/color][COLOR=#007700];
[/COLOR][color=#0000bb]pm[/color][color=#007700].[/color][color=#0000bb]_invoke[/color][color=#007700]([/color][color=#dd0000]"default7.aspx"[/color][color=#007700], [/color][color=#dd0000]'GetSome'[/color][color=#007700], [/color][color=#0000bb]false[/color][color=#007700], {[/color][color=#0000bb]some[/color][color=#007700]:[/color][color=#0000bb]Txtval [/color][color=#007700], [/color][color=#0000bb]some2[/color][color=#007700]:[/color][color=#dd0000]" "[/color][color=#007700]}, [/color][color=#0000bb]success[/color][color=#007700], [/color][color=#0000bb]error[/color][color=#007700], [/color][color=#0000bb]null[/color][COLOR=#007700]);  
[/COLOR][color=#0000bb][/color][/COLOR]

فمثال على إستخدام HttpHandler يكون على هذا الحال :

كود :
[color=#000000][COLOR=#0000bb][/color][color=#007700]var [/color][color=#0000bb]pm [/color][color=#007700]= new [/color][color=#0000bb]PageMethods[/color][COLOR=#007700];
[/COLOR][color=#0000bb]pm[/color][color=#007700].[/color][color=#0000bb]_invoke[/color][color=#007700]([/color][color=#dd0000]"handler.ashx"[/color][color=#007700], [/color][color=#dd0000]''[/color][color=#007700], [/color][color=#0000bb]false[/color][color=#007700], { }, [/color][color=#0000bb]success[/color][color=#007700], [/color][color=#0000bb]error[/color][color=#007700], [/color][color=#0000bb]null[/color][COLOR=#007700]);  
[/COLOR][color=#0000bb][/color][/COLOR]

فنجد أن إسم الدالة فارغ ولكن ستحصل على الناتج بلا شك .

دعنى أرى نظرتك للدرس , يمكنك كتابة تعليق ربما نستفيد منه أو سؤال جديد نتعلم منه .

الخلاصة :
تعرفت فى هذا الدرس كيفية إستخدام Page Methods بمساعدة Script Manager وكيف يتم توليد ما يسمى Proxy أثناء وقت التشغيل وكيفية إدراجه لـClass تحتوى على كل الدوال التى تم إعلانها على انها WebMethod . وكذلك تم التعرف على كيفية إستدعاء دالة ولكن فى صفحة أخرى . أيضاً تعرفت على كيفية تمرير parameters إلى الدوال لتحديث .

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


إنتهى الجزء الأول . والحمد لله رب العالمين .
}}}
تم الشكر بواسطة:


المواضيع المحتمل أن تكون متشابهة .
الموضوع : الكاتب الردود : المشاهدات : آخر رد
  الفرق بين Response.Redirect و Server.Transfer eng_mohammed190 2 3,799 10-12-17, 12:49 PM
آخر رد: eng_mohammed190
  معرض صور ديناميكي بJquery و Asp.net وقاعدة البيانات Sql Server ….. محمد الساعدي 5 5,028 03-06-13, 12:29 PM
آخر رد: محمد الساعدي
  الجزء الثانى - إستدعاء دالة Server-Side من خلال Client-Side RaggiTech 0 2,541 15-10-12, 11:18 AM
آخر رد: RaggiTech
  تعلم كيف تنقل بيانات من صفحة لأخرى بإستخدام QueryString RaggiTech 0 2,506 15-10-12, 10:49 AM
آخر رد: RaggiTech
  مقدمة تعريفية بـ ASP.Net- الجزء السادس - Page Class RaggiTech 0 2,119 15-10-12, 10:43 AM
آخر رد: RaggiTech
  مقدمة تعريفية بـ ASP.Net - الجزء الخامس--ِASP.Net Compilation RaggiTech 0 2,388 15-10-12, 10:41 AM
آخر رد: RaggiTech
  مقدمة تعريفيه بـ ASP.Net - الجزء الرابع-- Global.asax-Modules-Handlers RaggiTech 0 2,414 15-10-12, 10:39 AM
آخر رد: RaggiTech
  مقدمة تعريفيه بـ ASP.Net - الجزء الثالث-HttpContext -HttpApplication RaggiTech 0 2,300 15-10-12, 10:36 AM
آخر رد: RaggiTech
  مقدمة تعريفيه بـ ASP.Net - الجزء الثانى - ASP.Net Patterns RaggiTech 0 2,371 15-10-12, 10:34 AM
آخر رد: RaggiTech
  مقدمة تعريفية بـ ASP.Net - الجزء الأول RaggiTech 0 2,209 15-10-12, 10:30 AM
آخر رد: RaggiTech

التنقل السريع :


يقوم بقرائة الموضوع: بالاضافة الى ( 1 ) ضيف كريم