Data Binding: Grid View, List Box, Data binding Events, Repeater, Form View

📖 Theory

એક list, ઘણી rows, copy-paste નહીં

FestConnect પાસે events ની એક list છે, કદાચ 30 જેટલી, અને દરેક માટે screen પર એક row જોઈએ: નામ, તારીખ, સ્થળ. તમે 30 વાર હાથે HTML લખવાના નથી, અને event ની list બદલાય ત્યારે દર વખતે એ બધું ફરી સુધારવાના તો ચોક્કસ નથી.

એને બદલે તમે આખી list control ને સોંપી દો છો અને એ તમારા વતી દરેક row દોરે છે. એ જ છે data binding: data ના સ્રોતને એને બતાવનારા control સાથે જોડવો. નીચેની list બદલો એટલે દેખાવ પણ સાથે બદલાય. આ પાઠમાં data binding અને એને વાપરતાં મુખ્ય controls જોઈશું: GridView, ListBox, Repeater અને FormView.

📖 Theory

Data binding કઈ રીતે કામ કરે છે

ઢબ હંમેશા એ જ બે પગથિયાંની હોય છે. તમે control નું DataSource તમારા data પર (list, DataTable કે query નાં પરિણામો પર) ગોઠવો છો, પછી DataBind() બોલાવો છો. Control એ data માંથી પસાર થાય છે અને item દીઠ એક નોંધ render કરે છે.

આખો વિચાર એટલો જ છે: એને data આપો, bind કરવાનું કહો, અને એ દેખાવ બનાવી દે છે. Data માં 5 events હોય તો 5 rows મળે; 50 હોય તો 50 મળે, અને તમારા code માં કશો ફેરફાર કરવો પડતો નથી. પુનરાવર્તન control સંભાળી લે છે એટલે તમારે સંભાળવું પડતું નથી.

⌨️ Practical

FestConnect ની event list ને GridView સાથે bind કરવી

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        // 'events' could come from a database; a list is shown here for clarity
        var events = GetEvents();        // e.g. a list of Event objects

        gvEvents.DataSource = events;    // 1) point the control at the data
        gvEvents.DataBind();             // 2) render one row per item
    }
}
// gvEvents is an <asp:GridView> in the markup. It now shows every event.

📊 At a glance

✏️ Formula

DataBind() અને item દીઠ events

તમે DataBind() ન બોલાવો ત્યાં સુધી કશું દેખાતું નથી; ફક્ત DataSource ગોઠવવાથી કશું render થતું નથી. Bind કરવાનું યાદ રાખો (સામાન્ય રીતે if (!IsPostBack) ની અંદર, જેથી દરેક click વખતે grid નકામું ફરી ન બને).

Control bind થાય ત્યારે એ item દીઠ એક એવાં data-binding events ઊભાં કરી શકે છે. GridView નું RowDataBound દરેક row બનતી વખતે ચાલે છે અને તમને એને બદલવા દે છે: દાખલા તરીકે 'Full' event ને લાલ રંગ આપવો, કે તારીખને ઢાળમાં ગોઠવવી. Bind થતી વખતે અલગ અલગ items ને સુધારવા માટેની આ તમારી કડી છે.

🧩 Quiz

તમારે FestConnect ના events ને ઓછામાં ઓછી મહેનતે columns, sorting અને paging સાથે table તરીકે બતાવવા છે. કયું control સૌથી બંધબેસતું છે?

1. Repeater, કારણ કે એમાં table ની સૌથી વધુ સગવડો પહેલેથી હોય છે
2. GridView, જે rows અને columns ને grid તરીકે render કરે છે અને sorting તથા paging પહેલેથી આપે છે
3. FormView, કારણ કે એ બધા records ને grid તરીકે બતાવે છે
4. ListBox, કારણ કે એ columns આપોઆપ બતાવે છે

💭 Think first

તો GridView ને બદલે Repeater ક્યારે પસંદ કરાય?

GridView જો આટલું બધું આપોઆપ કરી આપતું હોય, તો મૂળભૂત રીતે કશું જ ન આપતું Repeater શા માટે અસ્તિત્વમાં છે? વિચારીને પછી tap કરો.

✅ Summary

Key takeaways

• Data binding data ના સ્રોતને એવા control સાથે જોડે છે જે દરેક item આપોઆપ બતાવે છે.
• ઢબ બે પગથિયાંની છે: control નું DataSource ગોઠવો, પછી DataBind() બોલાવો; bind ન કરો ત્યાં સુધી કશું render થતું નથી.
• GridView rows અને columns નું grid બતાવે છે, અને એમાં sorting તથા paging પહેલેથી હોય છે.
• ListBox એ પસંદ કરી શકાય એવી items ની scroll થતી list છે; Repeater તમે લખેલું આખું પોતાનું template item દીઠ render કરે છે; FormView પોતાના template સાથે એક સમયે એક record બતાવે છે.
• GridView ના RowDataBound જેવાં data-binding events item દીઠ ચાલે છે અને દરેક row બનતી વખતે એને બદલવા દે છે.
• if (!IsPostBack) ની અંદર bind કરો જેથી દરેક postback વખતે control નકામું ફરી ન બને.
• યાદ રાખવાની કડી: DataSource વત્તા DataBind() એટલે control તમારા વતી દરેક row દોરી આપે.