Talent without working hard is nothing.
by

في هذه المقالة سوف نتحدث عن JQuery  ومميزاتها في ASP.NET MVC  .

من اهم المميزا تالرائعه في JQuery Ajax  هي عند عمل تحميل (GET,POST ) للبيانات من السيرفر , لا تحتاج لعمل تحديث لكامل الصفحة , فقط الجزء المستخدم للكود (على سبيل المثال DIV  معينه ) .

GET

تستخدم GET  عند الحاجة لجلب بيانات من السيرفر على سبيل المثال تحميل بيانات مستخدم من قاعدة البيانات .

الشكل العام ل GET  :

.get( url [, data ] [, success(data, textStatus, jqXHR) ] [, dataType ] ).done/.fail

لنقوم بعمل مثال يوضح كيف يمكننا الاستفادة من GET  في MVC App  .

في الكود التالي شوف يتم ارجاع الوقت من التابع GetTime  .

public string GetTime()
{
    return DateTime.Today.ToString();
}

 

لنقم باضافة السكريبت التالي في صفحة الويب .

 

<p id="DisplayHere">
</p>

 

<script type="text/jscript">
    var url = "GetTime";
    $.get(url, null, function (data) {
        $("#DisplayHere").html(data);
    });
</script>

 

 

 الناتج كما في الصوره السابقة . 

لو اردنا ان يكون التنفيذ عند النقر على Button  .

يتم تعديل الكود السابق كما التالي :

<script type="text/jscript">
    $('#btnID').click(function () {
        var url = "GetTime";
        $.get(url, null, function (data) {
            $("#Displayhere").html(data);
        });
    })
</script>

لنتعمق اكثر في استخدام Get  , ولنقوم بارسال بيانات من صفحة الويب إلى كود ال C#  ويتم ارجاعه ليظهر في اداة اخرى .

الكود التالي يقوم بانشاء صندوق نص باسم txtName  (الاسم هذا مهم جدا لانه وقف التنقيذ Razor  سيحول الاسم اي ID ) .

input  هي عباره عن button  من نوع Submit  . 

<p>
    Enter you name @Html.TextBox("TXTName")
    <input type="submit" id="SubmitName" value="Submit"/>
</p>
 
<script type="text/jscript">
    $('#SubmitName').click(function () {
        var url = "MsgFromRazro";
        var name = $('#TXTName').val();
        $.get(url, { input: name }, function (data) {
            $("#Displayhere").html(data);
        });
    })
</script>

كود ال C# , تابع يستقبل متحول من نوع string  يتاكد من انه غير فارع او NULL  .

يتم ارجاع نص  Please Welcome Name 

public string MsgFromRazro(string input)
{
    if (!String.IsNullOrEmpty(input))
        return "Please welcome " + input + ".";
    else
        return "Please enter your name.";
}

لنتعمق اكثر في JQuery AJAX   . 

هذه المره مع DataBase  , جلب البيانات من قاعدة بياانات واظهارها في صفحة الويب .

اضافة الكود التالي في C#  .

يتم ارسال اسم البلد  من صفحة الويب , والتابع بدوه يقوم بجلبه كل العملاء من DataBase  وارساله على شكل JSON  .

يتم ارجاع البيانات على انها JSON  .

public JsonResult Customer(string Id)
{
    NorthwindEntities db = new NorthwindEntities();
    var result = from r in db.Customers
                    where r.Country == Id
                    select new { r.ContactName, r.Address };
    return Json(result, JsonRequestBehavior.AllowGet);
}

 

كود صفحة الويب , 

 

<p id="DisplayHere">
</p>
 
<p>
    Enter country name @Html.TextBox("Country")
    <input type="submit" id="Get" value="Submit"/>
</p>
 
<script type="text/jscript">
    $('#GetCustomers').click(function () {
        $.getJSON('Customer' + $('#Country').val(), function (data) {
 
            var items = '<table><tr><th>Name</th><th>Address</th></tr>';
            $.each(data, function (i, country) {
                items += "<tr><td>" + country.ContactName + "</td><td>" + country.Address + "</td></tr>";
            });
            items += "</table>";
 
            $('#DisplayHere').html(items);
        });
    })
</script>
 

 

باختصار هذه  احدا ميزات Jquery AJAX wtih ASP.NET MVC 

ساحاول تسجيل فيديو ونشره على Youtube  , ليكون الامر ممتع اكثر وسهل بنفس الوقت .

 

Read more..
On
by

The Model-View-Controller is an architectural pattern that separates an application into three main logical components: the model, the view, and the controller. Each of these components are built to handle specific development aspects of an application. MVC is one of the most frequently used industry-standard web development framework to create scalable and extensible projects.

MVC Components

 

Model

The Model component corresponds to all the data-related logic that the user works with. This can represent either the data that is being transferred between the View and Controller components or any other business logic-related data. For example, a Customer object will retrieve the customer information from the database, manipulate it and update it data back to the database or use it to render data.

View

The View component is used for all the UI logic of the application. For example, the Customer view will include all the UI components such as text boxes, dropdowns, etc. that the final user interacts with.

Controller

Controllers act as an interface between Model and View components to process all the business logic and incoming requests, manipulate data using the Model component and interact with the Views to render the final output. For example, the Customer controller will handle all the interactions and inputs from the Customer View and update the database using the Customer Model. The same controller will be used to view the Customer data.

Read more..
On
by

مشكله يصادفها الكثير من المطورين و المصممين ايضا في طول النص ان كان عنوان او مقالة .

يوجد حلول كثير , لهذه المشكلة :

يمكنك استخدام JavaScript  او JQuery  اوCSS  وحتى لغات اخرى مثل C# 

سوف نستخدم اليوم CSS  .

قم بانشاء ملف CSS جديد باسم a.css  واضف الكود التالي له : 

 

.truncate{
    display: table;
    table-layout: fixed;
    width: 100%;
    height: 250px;
    white-space: nowrap;
}
 
.truncate> * {
    display: table-cell;
    overflow: hidden;
    text-overflow: ellipsis;
}

 

 

وبنفس المجلد الذي قمت بانشاء الملف السابق فيه , قم بانشاء ملف HTML  جديد  واضف الكود التالي :

 

<!DOCTYPE html>
<html>
<head>
	<title>Rest</title>
	<link rel="stylesheet" type="text/css" href="a.css">
</head>
<body>
<div class="truncate">
    <span>
       It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like).
    </span>
</div>
</body>
</html>

والناتج سيكون نص مرن مع حجم المتصفح ...

 

Read more..
On
by

 اليوم سوف نتكلم على الفرق بين

 .NET Framework and .NET Core 

ماذا يجب ان تختار عندما تريد تصميم  برنامجك القادم  ؟ 

.NET Framework and .NET Core ?

في هذه المقالة سوف نقارن بعض الفروقات بين هذه المنصات .

 

.NET Ecosystem 

لنقم بمراجعة هيكلية .NET Ecosytem  .

كما تشاهد في الشكل السابق .NET Ecosystm  يملك ثلاثة مكونات رئيسة , وهي :

 .NET Framework, .NET Core, and Xamarin. 

Xamarin 

عندما تريد بناء برنامج خاص بالموبايل (iOS, Android, and Windows Mobile).

بستخدام لغة C#  ,   طبعا Xamrin  هو خيارك .

The .NET Framework 

تدعم Windows and Web applications و UWP   من اجل بناء تطبيقات على نظام ويندوز , بالاضافة إلى ASP.NET MVC  التى تمكننا من انشاء موقع الويب . على منصة >NET Framework  .

 

.NET Core

منصة مفتوحة المصدر و ايضا يمكنها العمل على اكثر من نظام تشغيل Windows, Mac, and Linux.

يمكنك بناء تطبيقات لتعمل على الانظمة السابقة , وايضا تدعم UWP  و ASP.NET Core  .فقط . 

UWP  تستخدم لبناء تطبيقات على Windows 10  . وتطبيقات  Wndows Mobile  .

 

كانت نظره سريعه على الفروقات . 

لكن ماذا نختار ؟

لكل منصه مزايها ,

.NET Framework

ستكون خيار جيد , لانك لا تريد تعلم تقنية جيده , بيئة عمل مستقره , ويمكنك انشاء تطبيقات Windows Forms or WPF

.NET Core

عندما تريد ان يكون تطبيقك يعمل على اكثر من نظام تشغيل , وتعشق منصات المصادر المفتوحة ... والطريق طويله امامك .

 

 

 

 

 

 

Read more..
On
by

You can use this adapter when your data source is a database Cursor. When using SimpleCursorAdapter, you must specify a layout to use for each row in the Cursor and which columns in the Cursor should be inserted into which views of the layout.

For example, if you want to create a list of people's names and phone numbers, you can perform a query that returns a Cursor containing a row for each person and columns for the names and numbers. You then create a string array specifying which columns from the Cursor you want in the layout for each result and an integer array specifying the corresponding views that each column should be placed −

String[] fromColumns = {ContactsContract.Data.DISPLAY_NAME,
   ContactsContract.CommonDataKinds.Phone.NUMBER};
int[] toViews = {R.id.display_name, R.id.phone_number};

When you instantiate the SimpleCursorAdapter, pass the layout to use for each result, the Cursor containing the results, and these two arrays −

SimpleCursorAdapter adapter = new SimpleCursorAdapter(this,
   R.layout.person_name_and_number, cursor, fromColumns, toViews, 0);
ListView listView = getListView();
listView.setAdapter(adapter);

The SimpleCursorAdapter then creates a view for each row in the Cursor using the provided layout by inserting each from Columns item into the corresponding toViews view.

Read more..
On