asp net bootstrap grid initialize combo box column in batch edit mode asp net bootstrap grid initialize combo box column in batch edit mode رمز المصدر

asp net bootstrap grid initialize combo box column in batch edit mode

فئات أخرى

1.0.0

تنزيل

عرض الشبكة لـ ASP.NET Bootstrap - كيفية تهيئة عمود مربع التحرير والسرد في وضع تحرير الدُفعات

يوضح هذا المثال كيفية إنشاء قالب تحرير عمود Combo Box لربط العمود بمصدر بيانات تم ترشيحه وتكوين وظيفة تحرير خلية الشبكة في وضع الدُفعات.

تهيئة عمود مربع التحرير والسرد

ملخص

اتبع الخطوات أدناه لتهيئة عمود مربع التحرير والسرد في وضع تحرير الدُفعات:

أضف عنصر تحكم bootstrapgridview إلى صفحتك وقم بملء الأعمدة.

قم بإنشاء عمود مربع التحرير والسرد وحدد إعدادات PropertiesCombobox لوضع العرض. لربط عمود مربع التحرير والسرد مع مصدر بيانات ، تعامل مع أحداث ItemRequestedByValue الخاصة بالعمود و itemRequestedByFilterCondition وتصفية مصدر البيانات.

< dx:BootstrapGridViewComboBoxColumn FieldName = " YourFieldName " ... >
    < PropertiesComboBox ValueField = " YourFieldName "	OnItemRequestedByValue = " OnItemRequestedByValue_View "
    OnItemsRequestedByFilterCondition = " OnItemsRequestedByFilterCondition_View " TextFormatString = " {0}|{1}... " >
        < Fields >
        <!-- ... -->
        </ Fields >
    </ PropertiesComboBox >
    <!-- ... -->
</ dx:BootstrapGridViewComboBoxColumn >

 protected void OnItemRequestedByValue_View ( object source , ListEditItemRequestedByValueEventArgs e ) {
    if ( e . Value == null ) return ;
    int subTypeID = ( int ) e . Value ;
    BootstrapComboBox editor = source as BootstrapComboBox ;
    editor . DataSource = ItemTypeFactory . GetItemSubTypes ( ) . Where ( s => s . SubTypeID == subTypeID ) ;
    editor . DataBind ( ) ;
}
protected void OnItemsRequestedByFilterCondition_View ( object source , ListEditItemsRequestedByFilterConditionEventArgs e ) {
    BootstrapComboBox editor = source as BootstrapComboBox ;
    editor . DataSource = ItemTypeFactory . GetItemSubTypes ( ) . Where ( s => s . SubTypeDescription . Contains ( e . Filter )
    || s . SubTypeName . Contains ( e . Filter )
    || s . SubTypeID . ToString ( ) . Contains ( e . Filter ) ) ;
    editor . DataBind ( ) ;
}

حدد خاصية EditItemTemplate الخاصة بالعمود ، وأضف عنصر تحكم bootstrapcombobox إلى القالب لاستخدامه في وضع التحرير ، وتمكين خاصية EnableCallBackMode الخاصة به. تعامل مع عناصر الخادم الخاصة بـ Combo Box و QuestionByFilterCondition و itemRequestedByValue وتصفية مصدر البيانات بناءً على قيم الحقول الأخرى.

< dx:BootstrapGridViewComboBoxColumn Caption = " ItemSubType " FieldName = " SubTypeID " VisibleIndex = " 4 " >
    <!-- ... -->
    < EditItemTemplate >
        < dx:BootstrapComboBox ID = " bsCombobox " runat = " server " EnableCallbackMode = " true " ClientInstanceName = " bsCombobox " OnItemRequestedByValue = " OnItemRequestedByValue " OnItemsRequestedByFilterCondition = " OnItemsRequestedByFilterCondition " ValueField = " SubTypeID " TextFormatString = " SubTypeID: {0} ---- Desription: {1} " >
            < Fields >
                <!-- ... -->
            </ Fields >
            < ClientSideEvents LostFocus = " bsCombobox_LostFocus " />
        </ dx:BootstrapComboBox >
    </ EditItemTemplate >
</ dx:BootstrapGridViewComboBoxColumn >

 protected void OnItemRequestedByValue ( object source , ListEditItemRequestedByValueEventArgs e ) {
    // ...
    int typeID = GetCurrentItemTypeID ( ) ;
    List < SubType > subTypes ;
    if ( typeID > - 1 )
        subTypes = ItemTypeFactory . GetItemSubTypes ( ) . Where ( s => s . TypeID == typeID && s . SubTypeID . ToString ( ) == id ) . ToList ( ) ;
    // ...
    editor . DataSource = subTypes ;
    editor . DataBind ( ) ;
}

protected void OnItemsRequestedByFilterCondition ( object source , ListEditItemsRequestedByFilterConditionEventArgs e ) {
    BootstrapComboBox editor = source as BootstrapComboBox ;
    int typeID = GetCurrentItemTypeID ( ) ;
    List < SubType > subTypes ;
    if ( typeID > - 1 )
        subTypes = ItemTypeFactory . GetItemSubTypes ( ) . Where ( s => s . TypeID == typeID && ( s . SubTypeDescription . Contains ( e . Filter )
        // ...
    editor . DataSource = subTypes ;
    editor . DataBind ( ) ;
}

لتهيئة التحكم في مربع التحرير والسرد على العميل ، تعامل مع أحداث BatchEditStartEditing و BatchEditEndEditing كما هو موضح في المثال التالي: عرض الشبكة لنماذج الويب ASP.NET - كيفية تنفيذ قالب عنصر تحرير في وضع الدُفعة.

 function OnBatchEditStartEdit ( s , e ) {
    var currentTypeID = grid . batchEditApi . GetCellValue ( e . visibleIndex , 'TypeID' ) ;
    var cellInfo = e . rowValues [ ColIndexByName ( 'SubTypeID' ) ] ;
    this . setTimeout ( function ( ) {
    bsCombobox . SetValue ( cellInfo . value ) ;
    bsCombobox . SetText ( cellInfo . text ) ;
    } , 0 ) ;
    RefreshData ( currentTypeID ) ;
}
function OnBatchEditEndEdit ( s , e ) {
    var cellInfo = e . rowValues [ ColIndexByName ( 'SubTypeID' ) ] ;
    cellInfo . value = bsCombobox . GetValue ( ) ;
    cellInfo . text = bsCombobox . GetText ( ) ;
    bsCombobox . SetValue ( null ) ;
}

لتمرير قيمة الحقل الجديدة إلى الخادم ، استخدم عنصر تحكم في الحقل المخفي واتصل بأسلوب PerformCallback Combo Box.
```
 function RefreshData ( currentTypeID ) {
    hf1 . Set ( 'currentTypeID' , currentTypeID ) ;
    bsCombobox . PerformCallback ( ) ;
} 
```